js中的原型与原型链

102 阅读1分钟

本文主要讲述以下javascript中的原型与原型链

1、相关术语

prototype: 原型

__proto__: 原型链(连接点)

2、从属关系

prototype==> 函数的一个属性: 对象

__proto__ ==> 对象Object的一个属性: 对象

"对象的__proto__ 保存着该对象的构造函数的prototype属性"

// 对象的__proto__属性保存着改构造函数的prototype属性

function Test() {
    this.a = 1;
};
Test.prototype = {
    b: 2
}

const t = new Test();

console.log(t.__proto__ === Test.prototype); // True

3、原型链的顶层

function Test(){};
const t = new Test();
t.__proto__ === Test.prototype // true

Test.prototype.__proto__===Object.prototype; //true

原型链的顶层:Object.prototype

4、Function和Object的关系

Function、Object 既是函数也是对象 所以Function.__proto__ 和Function.prototype都存在。并且Function.__proto__ === Function.prototype;即Function对象是由Function函数构造出来的(自己构造自己)。同理Object 也是由Function函数构造的。既有Obeject.__proto__ === Function.prototype。所以就得出Function.__proto__ ===Object.__proto__

console.log(Function.__proto__ === Function.prototype); // true const Function = new Function() 自己构造自己

console.log(Object.__proto__ === Function.prototype); // true const Object = new Function()

console.log(Object.__proto__ === Function.__proto__); // true

4、判断属性是否存在的方法

Object.hasOwnProperty('xxx') ==> true/false 此方法可以判断xxx属性是否是Object自身的属性

xxx in obj(具体的一个实例对象) in 除了在自身对象中查找是否有xxx属性也还会在原型链obj.__proto__上查找直到

function Test() {
    this.a = 1;
};
Test.prototype = {
    b: 2
}

const t = new Test();

console.log(t.hasOwnProperty('a')); // true
console.log('a' in t); // true
console.log('b' in t); // true

5、constructor

实例对象的constructor属性指向构造改实例对象的构造函数,且constructor属性是可以修改的