2021-09-16 终极原型链

最新推荐文章于 2026-06-21 11:24:48 发布

原创最新推荐文章于 2026-06-21 11:24:48 发布 · 596 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#javascript

学前端专栏收录该内容

27 篇文章

订阅专栏

本文深入探讨了JavaScript中的原型链机制，包括prototype、_proto_、constructor等概念。讲解了所有对象如何从Object.prototype继承，以及Function的自我创建过程。特别指出，Object的原型的隐式原型指向null，形成原型链的终点。

prototype：构造函数的属性(显示原型)，内部保存的是该构造函数的显示原型对象的地址
_ _ proto_ _：实例对象的属性(隐式原型)，指向其构造函数的显示原型
constructor：是构造函数显示原型对象上的一个属性指向这个原型对象对应的构造函数
Object：所有的对象(包括属性 constructor )都是由Object用new创建的，它们都会从 Objet.prototype 继承属性和方法 Person1.constructor= = =Person
Function：所有的函数（包括构造函数）都是由Function 用new创建的
Function自己创建自己（Function自己new自己）
Object的显示原型的隐式原型指向为null
所有的构造函数都有prototype
所有的实例都有 _ _ proto _ _
实例的隐式原型指向其构造函数的显示原型

原型链的终点（关于Object的原型的隐式原型为null）
0x200 是Computer的原型对象也是Object的实例化对象所以0x200的隐式原型指向Object的现实原型(0x500)
0x500 是Object的原型对象同时也是Object的实例化对象
0x500 作为Object的实例化对象其 _ _ proto _ _ 应该指向 Object的显示原型 => 0x500
如果这个时候访问一个方法找到了0x500 如果当它自身没有时会顺着自己的 _ _ proto _ _ 找到0x500
所以因为出现了这种死循环作者将Object的原型对象的 _ _ proto _ _ 属性设置为null 作为原型链的终点

举个栗子

		function Person(name, age) {
            this.name = name;
            this.age = age;
        }
        Person.prototype.grade = function () {
            console.log('毕业啦');
        }
        var Person1 = new Person('夜游', '18');
        console.log(Person1);

在这里插入图片描述

	//实例的隐式原型指向其构造函数的显示原型
	Person1.__proto__ === Person.prototype
	//构造函数的显示原型的constructor属性指向构造函数本身 constructor是构造函数的显示原型的一个属性
	Person.prototype.constructor === Person  === Person1.__proto__.constructor
	//所有的对象都会从其原型上继承一个constructor属性
	Person1.constructor === Person
	Person.constructor === Function
	//构造函数的隐式原型指向Function的显示原型 因为构造函数都是由Function 用new关键字创建的 即构造函数是Fucntion的实例 符合实例的隐式原型指向构造函数的显示原型
	Person.__proto__ === Function.prototype
	Person.prototype.__proto__===Object.prototype