JS中的原型和原型链

原型

1.每个构造函数都有一个prototype属性,该属性是个对象（我们称为原型对象）。
2.每个实例化对象都有一个__proto__属性,该属性指向构造函数的原型对象。

// Array,Object,Function这些都是构造函数。 
console.log(typeof Object, typeof Array, typeof Function); // function function function

// 我们创建数组，对象，其实都是在实例化对象。
 const obj = {}                    // const obj = new Object() 
 const arr = []                    // const obj = new Array() 
 function Fn(params) {} const fn = new Fn()
 console.log(typeof obj,typeof arr,typeof fn); // object object object
 
// 实例化对象的__proto__指向构造函数的原型对象
 const obj = {} 
 console.log(obj.__proto__ === Object.prototype); // true

2.构造函数Function实例化对象图解

• 每个构造函数都有一个prototype属性,该属性指向原型对象，原型对象用来给各个实例化对象共享属性和方法。
• 每个实例化对象都有一个__proto__属性，该属性也指向原型对象。
• 每个原型对象都有一个constructor属性，指向构造函数本身

// 构造函数的原型对象的constructor指向构造函数本身
console.log(Person===Person.prototype.constructor)  // true
// 实例化对象的__proto__指向构造函数的原型对象
console.log(per.__proto__ == Person.prototype) // true
// 同1,只是要经过2转化下
console.log(per.__proto__.constructor == Person) // true

原型链

这里我们分三组来看

• 函数Person，实例化对象per,函数的原型对象Person.prototype
• 数组Array，实例化数组arr，数组原型对象Array.prorotype
• 对象Object,实例化对象obj,原型对象Object.prototype
• 其中Person.prototype和Array.prorotype的__ptoto__指向Object.prototype。Object.prototype的__ptoto__指向null.
  

我们验证下数组能不能共享Object.prototype中的属性：

 Object.prototype.name = '张三'
 const arr = [] // const arr = new Array()
 console.log(arr.name);  // '张三'

我们发现,确实是可以共享的。