美文网首页
JS--原型链理解

JS--原型链理解

作者: 君莫叹人生如若初见 | 来源:发表于2016-11-30 16:30 被阅读19次

本文是作者记录的笔记,以免以后忘记。参考博客廖雪峰

function Person (name) {    
          this.name = name;    
          this.say = function () { 
          console.log('hello, my name is ' + this.name);   
     }
}
var person01 = new Person('asayao');
console.log(person01.__proto__ === Person.prototype);
console.log(person01.constructor === Person.prototype.constructor);
console.log(person01.constructor === Person);
console.log(Person.prototype.__proto__ == Object.prototype);

如上代码创建了一个Person的对象,其原型链是这样的:
person01 -----> Person ------> Object -----> null
person01 包含以下主要属性:__proto__constructor
Person 包含以下主要属性: prototypeconstructorproto

  • person01.__proto__ === Person.prototype 说明实例对象_proto指向该类的prototype
  • person01.constructor === Person 说明实例对象指向该类
  • person01.constructor === Person.prototype.constructor 说明实例对象指向该类的constructor
  • Person === Person.prototype.constructor 该类的construtor 指向该类
    原型链图

那么,现在,我们可以通过以下方式来继承函数:


function SuperMan(name, age) {
    Person.apply(this, arguments);
}
    inheritProperty(Man,Person);
    var man1 = new Man('jax');
    var man2 = new Man('ezer');
    console.log(man1.say == man2.say);
    console.log(man1.name == man2.name);

    function inheritProperty(subType, superType) { 
    var prototype = Object.create(superType.prototype);//创建对象         
    prototype.constructor = subType;//增强对象   
    subType.prototype = prototype;//指定对象
 }

解析此inheritProperty函数:

  • 创建一个与父类相同的类型
  • 该类指向子类
  • 子类指向该类型

那么相当于拷贝了一份类型。随后通过此类型来继承即可。

相关文章

  • JS--原型链理解

    本文是作者记录的笔记,以免以后忘记。参考博客廖雪峰。 如上代码创建了一个Person的对象,其原型链是这样的:pe...

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

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

  • 再学JS--原型与原型链

    prototype 在JavaScript中,每一个函数都有一个prototype属性,且prototype属性是...

  • 再来看一次JS继承

    原型链继承 理解原型链的概念 用一张图来理解原型链再合适不过了。 总结概括JS红宝书上对原型链的概念:每个函数都有...

  • 廖雪峰JS小记

    (function(){})() 原型,原型链 浅谈Js原型的理解JS 原型与原型链终极详解 对象 对象:一种无序...

  • Prototype

    原型链理解图

  • 2018-01-09 关于javascript原型链的思考 pl

    s 深入理解原型和原型链? 构造函数 理解原型和原型链 new的时候js都干了什么? 一个实现继承的demo 构造...

  • js继承完全理解

    认识原型链 要理解js的继承原来要先理解原型链,要理解原型链要先清楚下面两个结论: 任何一个构造函数(其实是任何一...

  • 来来来,通俗的理解一下原型,原型链......

    今天,在网上看到这个讲原型和原型链的通俗的分析,感觉对理解还是有帮助的,特此分享: 原型链理解起来有点绕了,网上资...

  • 读《javaScript高级程序设计-第6章》之继承

    读这篇之前,最好是已读过我前面的关于对象的理解和封装类的笔记。 一、原型链 原型链最简单的理解就是:原型对象指向另...

网友评论

      本文标题:JS--原型链理解

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