js原型和原型链

原型 prototype                       每一个函数或者类都有一个prototype属性

原型链 __proto__                每一个对象都有__proto__属性

prototype属性可以当作对象来理解，所以prototype对象中有__proto__属性

prototype对象中有constructor属性，指向当前类

prototype对象包含由特定类型所有实例共享的属性和方法

当new 的时候，属性才会在对象中分配空间

function Animal() { //构造函数
    this.type = "哺乳类"
}

console.log(Animal.prototype)

let animal = new Animal()
console.log(animal.__proto__)       //指向当前类的原型 Animal.prototype

console.log(animal.__proto__ === Animal.prototype)

 

属性查找范围： 对象先查找自己身上的属性，如果没有则沿着原型链找到它的原型是否有这个属性，如果还没找到，递归查找到Object.prototype。Object.prototype.__proto__则为Null

 

function Animal() { //构造函数
    this.type = "哺乳类"
}

Animal.prototype.type="哺乳"

let animal = new Animal()

console.log(animal.type)

function Animal() { //构造函数
    this.type = "哺乳类"
}

Animal.prototype.type="哺乳"

let animal = new Animal()
delete animal.type
console.log(animal.type)

 

function Animal() { //构造函数
    this.type = "哺乳类"
}

Animal.prototype.type="哺乳"

let animal = new Animal()
delete animal.type
console.log(animal.type)
console.log(animal.__proto__.__proto__ === Object.prototype)

 prototype对象中有constructor属性，指向当前类或函数

 

function Animal() { //构造函数
    this.type = "哺乳类"
}

Animal.prototype.type="哺乳"

let animal = new Animal()
delete animal.type
console.log(animal.type)
console.log(animal.__proto__.__proto__ === Object.prototype)
console.log(Animal.prototype.constructor === Animal)

 

function Animal() { //构造函数
    this.type = "哺乳类"
}

Animal.prototype.type="哺乳"

let animal = new Animal()
delete animal.type
console.log(animal.type)
console.log(animal.__proto__.__proto__ === Object.prototype)
console.log(Animal.prototype.constructor === Animal)

console.log(Object.prototype.__proto__)

如何理解函数的原型

原型包含所有实例共享的属性和方法

function Animal() { //构造函数
    this.type = "哺乳类"
}

Animal.prototype.type="哺乳"

let animal = new Animal()
delete animal.type
console.log(animal.type)
console.log(animal.__proto__.__proto__ === Object.prototype)
console.log(Animal.prototype.constructor === Animal)

console.log(Object.prototype.__proto__)

console.log(Animal.prototype)

特殊的Function和Object 即是函数又是对象，所以既有prototype又有__proto__

特殊情况

function Animal() { //构造函数
    this.type = "哺乳类"
}

Animal.prototype.type="哺乳"

let animal = new Animal()
delete animal.type
console.log(animal.type)
console.log(animal.__proto__.__proto__ === Object.prototype)
console.log(Animal.prototype.constructor === Animal)

console.log(Object.prototype.__proto__)

console.log(Animal.prototype)

console.log(Function.__proto__ === Function.prototype)      //函数（对象）的原型链指向函数（类）的原型,强制指定

 

Object是由Function创建的

function Animal() { //构造函数
    this.type = "哺乳类"
}

Animal.prototype.type="哺乳"

let animal = new Animal()
delete animal.type
console.log(animal.type)
console.log(animal.__proto__.__proto__ === Object.prototype)
console.log(Animal.prototype.constructor === Animal)

console.log(Object.prototype.__proto__)

console.log(Animal.prototype)

console.log(Function.__proto__ === Function.prototype)      //函数（对象）的原型链指向函数（类）的原型,强制指定
console.log(Object.__proto__ === Function.prototype)

 所以Object.__proto__ === Function.__proto__

function Animal() { //构造函数
    this.type = "哺乳类"
}

Animal.prototype.type="哺乳"

let animal = new Animal()
delete animal.type
console.log(animal.type)
console.log(animal.__proto__.__proto__ === Object.prototype)
console.log(Animal.prototype.constructor === Animal)

console.log(Object.prototype.__proto__)

console.log(Animal.prototype)

console.log(Function.__proto__ === Function.prototype)      //函数（对象）的原型链指向函数（类）的原型,强制指定
console.log(Object.__proto__ === Function.prototype)
console.log(Object.__proto__ == Function.__proto__)

 

 通过in或hasOwnProperty判断 属性在对象还是原型上

in- true 代表属性在对象中存在 来自实例或者来自原型
hasOwnProperty- true代表属性来自于实例 是实例属性

function Animal() { //构造函数
    this.type = "哺乳类"
}

Animal.prototype.type="哺乳"
Animal.prototype.a = 2

let animal = new Animal()
delete animal.type
console.log(animal.type)
console.log(animal.__proto__.__proto__ === Object.prototype)
console.log(Animal.prototype.constructor === Animal)

console.log(Object.prototype.__proto__)

console.log(Animal.prototype)

console.log(Function.__proto__ === Function.prototype)      //函数（对象）的原型链指向函数（类）的原型,强制指定
console.log(Object.__proto__ === Function.prototype)
console.log(Object.__proto__ == Function.__proto__)

console.log('a' in animal)

 

 

 参考纹章：

1、如何理解JavaScript的原型和原型链