我自己对 prototype 的一些理解

/*
* 理解原型: 一看到就要产生反射弧
* 函数是 Function 的一个实例, Function 是 ECMA262 定义的
* 函数即有 prototype 指针, 又有 __proto__ 指针
* prototype 用的多, 一般指向 new Object()
* __proto__ 用的少, 一般指向 Function.prototype
* 所有 函数.prototype 默认都指向 new Object() ( 多级继承就不会指向 new Object(), 一般会指向 new (new Function())() )
* 所有 实例.__proto__ 默认都指向 函数.prototype ( 只有 Object.prototype.__proto__ 指向 null )
* */
console.log('理解原型: 一看到就要产生反射弧');
const Vue = new Function();
console.log(Vue.prototype); // new Object()
console.log(Vue.__proto__); // Function.prototype
console.log(Vue); // new Function()

//实例没有 prototype, Vue.__proto__ 也是指向 new Object() 即 new Object().prototype 也是 undefined;
console.log(Vue.__proto__.prototype); // undefined, 一般没有非继承关系中没有: 实例.__proto__.prototype
console.log(new Vue().prototype); // undefined

/*
* 引用真正的 vue 打印出来的结果也是一样的
* https://cdn.jsdelivr.net/npm/vue/dist/vue.js
* */
console.log(Vue.__proto__ === Function.prototype); // true
console.log(Vue.__proto__.__proto__ === Object.prototype); // true
console.log(Vue.prototype.__proto__ === Object.prototype); // true
console.log(Vue.__proto__.__proto__.__proto__ === null); // true
console.log(new Vue().__proto__ === Vue.prototype); // true
console.log(new Function().__proto__ === Function.prototype); // true
console.log(new Object().__proto__ === Object.prototype); // true
console.log(Vue.prototype.__proto__ === Object.prototype); // true
console.log(Function.prototype.__proto__ === Object.prototype); // true
console.log(Object.prototype.__proto__ === null); // true
console.log(null === null); //true
console.log(undefined === undefined); //true
console.log(null === undefined); //false

/*
* 我自己发明的新式写法,嘿嘿~~
* 第一步: new (new Function())().__proto__ -> new Object()
* 第二步: new Object().__proto__ -> Object.prototype
* */
console.log(new (new Function())().__proto__.__proto__ === Object.prototype); // true

// 以下是头脑风暴
/*
new Vue() -> new (new Function())() -> new (new (new Object())())()
new Vue() -> new (new Function())() -> new (new ( Function = {
    __proto__: Object.prototype,
    prototype: {
        constructor: Function,
        __proto__  : Object.prototype
    }
})())()
*/
new ( // Vue
    new ( // Function
        { // Object
            __proto__: Object.prototype,
            prototype: { // 系统指定的
                constructor: Function,
                __proto__  : Object.prototype
            }
        }
    )()
)()
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
禁止转载,如需转载请通过简信或评论联系作者。

相关阅读更多精彩内容

友情链接更多精彩内容