美文网首页
原型、原型链、继承

原型、原型链、继承

作者: kimberle | 来源:发表于2019-05-27 12:09 被阅读0次

原型与原型链

什么是原型、原型链

原型:每一个对象(除null外)都有另一个对象与之相关联,这个另一个对象便称之为“原型”(prototype),每个对象都是从原型继承属性。
原型链:是指一系列链接的原型对象的链称为“原型链”(prototype chain)。
在了解这两个概念之前,先了解三句话:

  1. 每一个构造函数都有一个原型对象,每一个原型对象都有一个指针constructor指向创建当前对象的构造(初始化)函数。
  2. 每一个实例都有一个内部指针__proto__,指向原型对象,原型对象上的属性和方法能被实例所访问
  3. 原型链上的属性和方法能被实例所访问

(函数都有prototype,实例都有__proto__)
另:__proto__是实例和Person.prototype之间的关系,而constructor是实例和Person之间的关系

function Male(){}
var male = new Male(); 
male.__proto__  ->   Male.prototype   // -> 表示指向

对于原型链用一种我自己理解的方式表述就是说,通过__proto__来向上查找,最终到Object的__proto__为null。
就是说当前的__proto__指向上一层的prototype,而上一层prototype的__proto__指向上上一层的prototype,以此类推直到最顶层。

一些继承方式

组合继承

用遍历的方法把prototype的方法依次赋给子类的prototype。

Male.prototype = Person.prototype;   //会出现地址拷贝(父类能访问子类方法)
//所以使用遍历的方式
for(var i in Person.prototype){
Male.prototype[i] = Person.prototype[i];

call或apply继承

通过call或apply来改变this指向达到继承目的

function Person(name,age){
    this.name = name;
    this.age = age;
    this.sayHello = function(){
        console.log(this.name);
    }
}
function Male(name,age){  //通过apply改变person里的this指向
    Person.apply(this,[name,age])//第一个参数this指本方法里的this
}
function Female(name,age){     
    Person.call(this,name,age);//通过call改变person里的this指向
}

寄生式继承

通过Object本身的creat方法实现

//Person作为Male的__proto__指向的原型函数存在。
Male.prototype = Object.creat(Person.prototype);
//此时Male.prototype.constructor会指向Person
//所以要将constructor指回Male
Male.prototype.constructor = Male;//constructor:始终指向创建当前对象的构造(初始化)函数。

ES6的继承

通过super来继承

class Person{            //定义父类
    constructor(name){
    this.name = name;
    }
    sayHello(){
        console.log(this.name);
    }
    static foo(){        //定义一个静态方法
        console.log("foo");
    }
}
class Male extends Person{
    constructor(name){ //使用super
        super(name);   //super指向父类的构造函数
         this.sexy = "male";
    }
    sayHi(){
        super.sayHello();  //super指向父类的原型对象
    }
    static bar(){
        super.foo();      //super指向父类
    }
}

相关文章

  • JavaScript 原型、原型链与原型继承

    原型,原型链与原型继承 用自己的方式理解原型,原型链和原型继承 javascript——原型与原型链 JavaSc...

  • 继承

    原型链直接继承 原型链直接继承prototype 原型链继承_prototype属性 继承_构造函数绑定

  • js中的实现继承的几种方式

    大纲:原型链借用构造函数组合继承原型式继承寄生式继承寄生组合式继承 1、原型链: 什么是原型链? 原型链的基本思想...

  • Javascript 面向对象的程序设计(原型链与继承)

    继承 原型链 讲原型的时候提到过继承,设计原型的初衷就是为了继承,原型链是实现继承的主要方法。那什么是原型链,还记...

  • js基础之实现继承的几种方式

    js 实现继承的方式有: 原型链继承; 构造函数继承; 组合继承(原型链继承 + 构造函数继承)(最常用);(原型...

  • es5的部分继承以及es6的class

    一、JavaScript常用的原型继承方式 原型链继承 2,构造函数继承(对象冒充继承) 3,组合继承(原型链继承...

  • 构造函数原型的继承方式分析

    1.通过原型链继承 综上我们可以总结出 通过原型链来实现继承的原理通过原型链来实现继承的原理原型链继承方案中,父类...

  • js_继承及原型链等(四)

    js_继承及原型链等(三) 1. 继承 依赖于原型链来完成的继承 发生在对象与对象之间 原型链,如下: ==原型链...

  • JavaScript继承方式详解

    JavaScript实现继承的方式主要有两种: 原型链继承和借助构造函数继承 一、原型链继承 原型链继承的主要思想...

  • js常见的继承方式

    1.原型链继承 基于原型链查找的特点,我们将父类的实例作为子类的原型,这种继承方式便是原型链继承。 Child.p...

网友评论

      本文标题:原型、原型链、继承

      本文链接:https://www.haomeiwen.com/subject/bkorzqtx.html