原型和原型链

创建对象的几种方式

使用字面量或 Object 方式创建

const obj = {name: 'allen'};
const obj1 = new Object({name: 'allen'});

使用显式的构造函数创建

const User = function() {
  this.name = 'allen';
}
const user = new User();

使用 Object.create() 创建

const obj = {name: 'allen'};
const user = Object.create(obj);

原型链

原型链.png

• 构造函数：通过 new 来操作的函数
• 实例：只要是对象就是一个实例
• 原型对象：在JavaScript中，我们创建一个函数A(就是声明一个函数), 那么浏览器就会在内存中创建一个对象B，而且每个函数都默认会有一个属性 prototype 指向了这个对象( 即：prototype的属性的值是这个对象 )。这个对象B就是函数A的原型对象，简称函数的原型。这个原型对象B 默认会有一个属性 constructor 指向了这个函数A ( 意思就是说：constructor属性的值是函数A )。

const User = function() {
  this.name = 'allen';
}
const user = new User();
console.log(User.prototype.constructor === User); // true

函数也有 __proto__ 属性，那是为什么呢？因为函数既是函数也是一个对象。函数默认是 Function 构造函数生成的一个实例对象

const User = function() {
  this.name = 'allen';
}
console.log(User.__proto__ === Function.prototype); // true

在调用实例的方法时，根据该实例的原型链一级一级的向上查找，直到找到 Object.prototype 如果还没有找到的话则调用失败，如果在某一级找到后停止向上查找。

instanceof

instanceof.png

instanceof 运算符用来测试一个对象在其原型链中是否存在一个构造函数的 prototype 属性。

const User = function() {
  this.name = 'allen';
}
const user = new User();
console.log(user instanceof User); // true
console.log(user instanceof Object); // true

new 运算符

new运算符.png