美文网首页
JavaScript原型与原型链深入理解

JavaScript原型与原型链深入理解

作者: 奔跑的痕迹 | 来源:发表于2020-03-29 18:46 被阅读0次

    原型:
    每一个js 对象(null除外)都会和另一个对象相关联,“另一个”对象就被我们称之为‘原型’,
    而每一个原型拥有一个prototype 属性指向原型对象(就是原型的实例)的引用,
    原型就是通过该prototype将自身的属性和方法共享给继承他的子对象;
    子对象通过__proto__指向原型的prototype进行属性方法继承;这种方式称之为‘原型链’

    原型链

    如图

    1. 其实Function 最特殊(函数界一等公民) 它是它自己的一个实例 ;
      如:
    Function(){}
    let F = new Function();
    Function.prototype = F;
    Function.__proto__ = F;
    

    就是说 Funciton 的原型就是F , 即Function.__proto__ === Function.prototype,
    Function.constructor === Function
    Function.prototype.__proto__ === {} ,没有再指向F而是{}避免了无意义的死循环

    1. 而Object 也是new Function()来的,
      Object.__proto__=F
      Object.__proto__ === Function.prototype

      Object.prototype ==={}
      此处同Function.prototype.__proto__同理最终他的原型对象并没有再指向F; 而是指向了最上层的{} 一个空对象,

    简单分析不难得出 要是他的原型对象和原型都指向同一个那就成死循环了
    即会出现Object.__proto__ = F ; F = new Object();


    1. 而自定义函数默认原型为 F ,即 CustFn.__proto__ === Function.prototype
      以此类推他的构造函数就是Function了 即 CustFn.constructor === Function

    到这里 CustFn 与 其实例的关系也就好理解了,

     let FC = new CustFn();
    CustFn.prototype = FC;
    
    

    而 var custfn = new CustFn(); 就如 custfn = FC;

    所以 custfn.__proto__ === FC
    custfn.__proto__ === CustFn.prototype

    而CustFn.prototype 是 new CustFn();

    来的那么 他的constructor 当然是 CustFn了

    CustFn.prototype 是通过newCustFn() 这个普通函数来的,所以他的原型是一个{}空对象
    CustFn.prototype.__proto__ === {}

    到此不难理解 '只有new Function()来的函数 的原型才是Function 其的都是普通对象',如同 new Object()一样

    个人能力有限,如理解有误的地方还望指点谢谢

    相关文章

      网友评论

          本文标题:JavaScript原型与原型链深入理解

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