原型链

什么是原型链

所有的对象都是通过new 函数的方式创建的

var u1 = new User('邓', '旭明'); // 对象 u1 通过 new User 创建
var u2 = { // 对象 u2 通过 new Object 创建
  firstName: '莫',
  lastName: '妮卡'
}
// 等效于
var u2 = new Object(); 
u2.firstName = '莫';
u2.lastName = '妮卡';

上面的代码形成的原型图如下

原型对象本身也是一个对象，默认情况下，是通过new Object创建的，因此，上面的两幅原型图是可以发生关联的

Object.prototype.__proto__比较特殊，它固定指向null

可以看出，u1的隐式原型形成了一个链条，称之为原型链

当读取对象成员时，会先看对象自身是否有该成员，如果没有，就依次在其原型链上查找

完整的链条

对开发的影响

在原型上更改会产生多大影响

更改构造函数的原型会对所有原型链上有该构造函数的原型的对象产生影响

学会利用原型链判断类型

instanceof关键字【常用】

object instanceof constructor
// 判断object的原型链中，是否存在constructor的原型

Object.getPrototypeOf()【不常用】

Object.getPrototypeOf(object);
// 返回object的隐式原型

学会创建空原型的对象

利用Object.create()

Object.create(target);
// 返回一个新对象，新对象以target作为隐式原型

利用Object.setPrototypeOf()

Object.setPrototypeOf(obj, prototype);
// 设置obj的隐式原型为prototype

练习题：

// 下面的代码输出什么？
function User() {}
User.prototype.sayHello = function () {};
var u1 = new User();
var u2 = new User();
console.log(u1.sayHello === u2.sayHello);
console.log(User.prototype === Function.prototype);
console.log(User.__proto__ === Function.prototype);
console.log(User.__proto__ === Function.__proto__);
console.log(u1.__proto__ === u2.__proto__);
console.log(u1.__proto__ === User.__proto__);
console.log(Function.__proto__ === Object.__proto__);
console.log(Function.prototype.__proto__ === Object.prototype.__proto__);
console.log(Function.prototype.__proto__ === Object.prototype);
// true
// false
// true
// true
// true
// false
// true
// false
// true

// 下面的代码输出什么？（字节）
console.log({} instanceof Object);
console.log({}.toString instanceof Function);
console.log(Object instanceof Function);
console.log(Function instanceof Object);

// 四个都是true

// 下面的代码输出什么？（京东）
Function.prototype.a = 1;
Object.prototype.b = 2;
function A() {}
var a = new A();
console.log(a.a, a.b);
console.log(A.a, A.b);
// undefined 2
// 1 2

【JS】原型链：duyi笔记

原型链