js深入之从原型到原型链

米兰小铁匠172025-11-18 17:08

构造函数创建对象

js 复制代码

function A {
}
let a=new A();
a.name="abc";
console.log(a.name);

在这个例子中A就是一个构造函数，我们使用new创建了一个实例对象a

prototype

每个函数都有一个prototype属性

js 复制代码

function A {
}
A.prototype.name="张三"
let a1=new A();
let a2=new A();
console.log(a1.name,a2.name)

prototype指向的是调用该函数创建的实例的原型，也就是例子中a1,a2的原型。每一个对象（null除外）创建的时候，都会关联另外一个对象，这个对象就是原型，每个对象都会从原型"继承"属性

proto

每个对象（除了null）都有一个__proto__属性，这个属性指向该对象的原型

js 复制代码

function A {
}
let a=new A();
console.log(a.__proto__===A.prototype)

constructor

每个原型都有一个constructor属性指向关联的构造函数

js 复制代码

function A {
}
console.log(A.prototype.constructor===A)

js 复制代码

function A {
}
let a=new A();
console.log(A.prototype.constructor===A)
console.log(a.__proto__===A.prototype)
console.log(a.contructor===A.prototype.constructor)
// 顺便学习一个ES5的方法,可以获得对象的原型
console.log(Object.getPrototypeOf(a) === A.prototype)

当读取实例属性时，如果找不到就会从与对象关联的原型上查找，如果还查不到就会查找原型的原型，一直找到最顶层为止。

js 复制代码

function A {
}
A.prototype.name="test";
let a=new A();
a.name="aaa";
console.log(a.name);//aaa
delete a.name;
console.log(a.name);//test

原型的原型，其实是有Object构造函数生成

原型链

红色部分就代表了原型链的形成