//js中实现继承的几种方式
//实现继承首先要有一个父类,先创造一个动物的父类
function Animal(name){
this.name = name;
this.shoot = function(){
console.log("yelp");
}
}
//动物的原型
Animal.prototype.eat = function(food){
 
console.log(name+"吃"+food);
}
//1.实例继承
var dog = new Animal("大黄");
// console.log(dog.name);
// dog.eat("骨头");
//用父类的构造函数实例化出来的实例对象就继承了父类的属性和方法
//缺点:
//2.上下文继承,改变this的指向
function Dog(name){
Animal.call(this);
this.name = name;
}
var dog = new Dog("rose");
//dog.shoot();
//console.log(dog.name);
// dog.eat("fish");//报错,不能继承原型方法
//使用上下文的方法,改变this的指向,让Dog拥有Animal的属性
//缺点:只能继承父类的实例属性和方法,不能继承父类的原型属性和方法
//3.遍历继承
/* var cat = {};
var a = new Animal("jj");
cat.prototype.lookhome = function(){
console.log("lookhome");
}
for(var key in a){
cat[key]=a[key];
}
cat.lookhome();
console.log(cat.name);
cat.shoot();
cat.eat("fish");*/
//使用循环遍历的方法,把Animal的属性赋给cat,这样cat就拥有了Animal的属性和方法
//4.原型链继承
/* function Cat(name){
this.name = name;
}
Cat.prototype = new Animal();
var cat = new Cat("kitty");
cat.shoot();
cat.eat("meat");//吃meat,没有名字,不能给父类的构造函数传参
console.log(cat.name);*/
//把父类的实例赋给子类的原型,这样子类实例化出来的实例就拥有了父类的属性和方法
//缺点:不能向父类的构造函数传参,
//5.混合继承
/* function Cat(name){
Animal.call(this);
this.name = name;
}
Cat.prototype = new Animal();
Cat.prototype.lookhome=function(){
console.log("lookhome");
}
var cat = new Cat("kitty");
cat.eat("fish");
cat.shoot();
cat.lookhome();
console.log(cat.name);*/
//结合上下文和原型链继承,让子类拥有父类的属性和方法,也拥有原型方法
//缺点:如果要给子类添加自己的原型属性和方法,必须放在继承父类属性的后面,放在继承之前会
//被覆盖
//6.另一种方式实现继承
/* function Cat(){
this.sleep = function(){
console.log("cat sleep");
}
}
Cat.prototype.lookhome = function(){
console.log("lookhome");
}
Cat.prototype.__proto__ = new Animal();
 
var cat = new Cat();
cat.eat("fish");
cat.sleep();
cat.lookhome();*/
//每一个对象都有一个__proto__的属性,通过父类的构造函数的原型的__proto__属性,继承父类的属性和方法,这样不会覆盖自己的原型方法

js 实现继承的几种方式的更多相关文章

  1. js实现继承的5种方式 (笔记)

    js实现继承的5种方式 以下 均为 ES5 的写法: js是门灵活的语言,实现一种功能往往有多种做法,ECMAScript没有明确的继承机制,而是通过模仿实现的,根据js语言的本身的特性,js实现继承 ...

  2. js 实现继承的6种方式(逐渐优化)

    <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...

  3. js实现继承的两种方式

    这是面试时面试官会经常问到问题: js的继承方式大致可分为两种:对象冒充和原型方式: 一.先说对象冒充,又可分为3种:临时属性方式.call().apply(): 1.临时属性方式: 当构造对象son ...

  4. js实现继承的5种方式

    js是门灵活的语言,实现一种功能往往有多种做法,ECMAScript没有明确的继承机制,而是通过模仿实现的,根据js语言的本身的特性,js实现继承有以下通用的几种方式1.使用对象冒充实现继承(该种实现 ...

  5. 深入浅出js实现继承的7种方式

    给大家介绍7中js继承的方法 有些人认为JavaScript并不是真正的面向对象语言,在经典的面向对象语言中,您可能倾向于定义类对象,然后您可以简单地定义哪些类继承哪些类(参考C++ inherita ...

  6. JS实现继承的几种方式

    前言 JS作为面向对象的弱类型语言,继承也是其非常强大的特性之一.那么如何在JS中实现继承呢?让我们拭目以待. JS继承的实现方式 既然要实现继承,那么首先我们得有一个父类,代码如下: // 定义一个 ...

  7. JavaScript面向对象(三)——继承与闭包、JS实现继承的三种方式

      前  言 JRedu 在之前的两篇博客中,我们详细探讨了JavaScript OOP中的各种知识点(JS OOP基础与JS 中This指向详解 . 成员属性.静态属性.原型属性与JS原型链).今天 ...

  8. JS 面向对象 ~ 继承的7种方式

    前言: 继承 是 OO 语言中的一个最为人津津乐道的概念.许多 OO 语言都支持两种继承方式:接口继承 和 实现继承.接口继承只继承方法签名,而实现继承则继承实际的方法.如前所述,由于函数没有签名,在 ...

  9. JS实现继承的几种方式(转)

    转自:幻天芒的博客 前言 JS作为面向对象的弱类型语言,继承也是其非常强大的特性之一.那么如何在JS中实现继承呢?让我们拭目以待. JS继承的实现方式 既然要实现继承,那么首先我们得有一个父类,代码如 ...

随机推荐

  1. 389. Find the Difference 找出两个字符串中多余的一个字符

    [抄题]: Given two strings s and t which consist of only lowercase letters. String t is generated by ra ...

  2. resize函数有五种插值算法

    转自http://blog.csdn.net/fengbingchun/article/details/17335477 最新版OpenCV2.4.7中,cv::resize函数有五种插值算法:最近邻 ...

  3. 利用General框架进行三层架构开发

    三层架构是企业信息管理系统中一种比较流行的架构方式,如大家所知,三层架构将信息系统分为数据访问层(DAL).业务逻辑层(BLL).界面表示层(UI)三部分,三层架构的好处是根据系统中代码所处的层次将系 ...

  4. php学习笔记-continue和break

    这两个关键字经常被用在循环中,但作用是完全不同的. 在循环中遇到continue这个单词的时候一定要理解为skip,跳过或者略过,啥意思?就是跳过本次循环,后面的循环继续走起来,老铁. break是说 ...

  5. Linux tee命令

    一.简介 tee以标准输入作为输入,标准输出和文件作为输出.   二.语法 Usage: tee [OPTION]... [FILE]... Copy standard input to each F ...

  6. bzoj5450 轰炸

    传送门 分析 不难想到如果这个图是一个DAG则答案就是图的最长路 于是我们考虑有环的情况 我们发现一个环上的所有点颜色一定不相同 于是我们发现答案就是缩点之后跑一遍点权最长路 点权就是这个强联通分量中 ...

  7. SSH框架(四) struts2+spring3.0的登陆示例

    (一)关键理念及需要注意的地方: 使用struts2+spring3.0的框架搭建web程序,就是使用spring来进行依赖注入(依赖注入请参考baidu上面的解释:http://baike.baid ...

  8. 安装thrift时,注意openssl参数

    在安装基于openssl-1.0.1c的thrift-0.9.0时,正常使用--with-openssl在configure时会出错,报"Error: libcrypto required. ...

  9. Java50道经典习题-程序35 最大最小交换

    题目:输入数组,最大的与第一个元素交换,最小的与最后一个元素交换,输出数组.分析: 例如输入6 4 8 3 9 7 交换后输出9 4 8 7 6 3 import java.util.Arrays; ...

  10. javaScript实现轮播图

    一.需求分析 在首页完成对轮播图的效果实现,完成自动切换图片的功能. 二.技术分析 获取元素 document.getElementById(“id 名称”) 事件(onload) 定时操作: set ...