源码解读之setprototypeof

今天的解读的源码是setprototypeof，源码地址https://github.com/wesleytodd/setprototypeof

'use strict'
/* eslint no-proto: 0 */
module.exports = Object.setPrototypeOf || ({ __proto__: [] } instanceof Array ? setProtoOf : mixinProperties)

function setProtoOf (obj, proto) {
  obj.__proto__ = proto
  return obj
}

function mixinProperties (obj, proto) {
  for (var prop in proto) {
    if (!obj.hasOwnProperty(prop)) {
      obj[prop] = proto[prop]
    }
  }
  return obj
}

这段代码的作用是什么？

Polyfill for Object.setPrototypeOf

实现三条路径

1. 优先使用：Object.setPrototypeOf
2. 第二选择：proto
3. 最后选择：遍历赋值

知识点一

({ __proto__: [] }) instanceof Array 

• instanceof 用来查找对象的构造函数
• { __proto__: [] } 对象改变了原型链，也可能只是对象的key

知识点二

obj.__proto__ = proto

__proto__ 可以改变原型链指向

知识点三

!obj.hasOwnProperty(prop)

找出原型链上的属性

知识点已经罗列完毕，如何测试学习成果呢？

function Foo() {
}

Foo.prototype.hello = function() {
    console.log('hello')
}

var foo1 = new Foo()
foo1.hello()

上方代码，通过new实现化了一个对象，那么不用new，不考虑兼容性，应该如何实现呢？

例如：

var foo2 = {}
foo2.__proto__ = Foo.prototype
foo2.hello()

var foo3 = Object.create(Foo.prototype, {})
foo3.hello()

更多方法不再提供，大家可以文章下方留言，一起讨论。

相关链接

• https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/instanceof
• https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/proto
• https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/setPrototypeOf
• https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty
• https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/create