JavaScript之函数原型链完整版

我的上一篇文章有解释绅士原型及简单的原型链,在这里我将对原型链做完整讲述;

// 函数的原型链: 把函数当对象(实例对象)来看
        
        function Person(){}
        // 底层Function创建出来的Person, 底层中任意函数都是Function创建的
        // var Person = new Function();
        
        // 把Person 当孩子来看,Person对象的原型链长啥样
        //  Person ==> Function.prototype ==> Object.prototype ==> null;
        // console.log( Person.__proto__ == Function.prototype );
        // console.log( Function.prototype.__proto__ );
        // Person.prototype 这个prototype属性是函数Person自带的
        // Function.prototype 是唯一的原型对象的类型是个函数的
        // Function.prototype  原型对象有call apply bind三个方法
        console.dir( Function.prototype );
        // 函数都可以去使用call apply bind方法, 是的
完整版原型链:
核心的点: 函数的双重身份
1. 函数当函数用
2. 函数也是对象
 // 1. 把Person函数当函数用,具体当构造函数用
        function Person(){}
        var p = new Person();
        // 绘制以上代码的原型三角关系
        // 构造函数: Person
        // 原型对象: Person.prototype
        // 实例对象: p
        // console.log( Person.prototype.__proto__ === Object.prototype );

 // 2. 把Person函数当对象看,当实例对象看(孩子)
        //  Person这个孩子谁创建的?
        // 底层 var Person = new Function();
        // 绘制以上代码的原型三角关系
        // 构造函数: Function
        // 原型对象: Function.prototype
        // 实例对象: Person

// 3. 把Object考虑进来,把Object当构造函数来看
        var obj = new Object();
        // 绘制以上代码的原型三角关系
        // 构造函数: Object
        // 原型对象: Object.prototype
        // 实例对象: obj
// 4. 把Object当实例对象来看,孩子看,Object孩子谁生的
        // 底层 var Object = new Function();
        // 绘制以上代码的原型三角关系
        // 构造函数: Function
        // 原型对象: Function.prototype
        // 实例对象: Object
        // console.log( Object.__proto__ === Function.prototype );

 // 5. Function 函数是谁生下来的,是Function自己
        // var Function = new Function();
        // 绘制以上代码的原型三角关系
        // 构造函数: Function
        // 原型对象: Function.prototype
        // 实例对象: Function
        console.log( Function.__proto__ == Function.prototype );
小结:
 1. 函数是函数,也是对象
     是函数有prototype属性
     是对象有__proto__属性
     所以函数有prototype也有__proto__属性
2. 任何函数的原型链都有 Function.prototype
3. 任何对象的原型链上都有 Object.prototype
4. 函数是一等公民(特权)
      typeof 函数 ==> function
      Function 生自己
      Function.prototype 原型对象的类型是唯一的函数类型

案例:

    console.log( Function.prototype === Function.prototype ); // true
    console.log(Object.__proto__ === Function.prototype); // true
    console.log( Function.prototype.__proto__ === Object.prototype  ); // true
    console.log( Object.prototype.__proto__ === Object.prototype ); // false
    console.log( Object.__proto__.__proto__ === Object.prototype ); // true
// 面试题
    // Function的prototype原型对象有没有在Function对象的原型链上
    /*console.log(Function instanceof Function); // true
    console.log(Function instanceof Object); // true
    console.log(Object instanceof Function); // true
    console.log(Object instanceof Object); // true*/

    // 练习
    function Person() {}
    var p = new Person()
    console.log(p.constructor); // Person
    console.log(Person.constructor); // Function
posted @ 2020-09-15 20:28  大熊在这里  阅读(563)  评论(0)    收藏  举报