前言

一共有三篇，这一篇写在JS中只存在对象与原型链的情况下实现代码复用。

内容来源于《你不知道的js》《阮一峰ES6入门》《JavaScript语言精粹》《JavaScript高级程序设计》《JavaScript设计模式》《JavaScript模式》《MDN web文档》
本博客没有什么有价值的知识，仅作总结梳理之用，初学者可以看看。

只有对象的世界

在静态强类型语言中，继承可能是唯一复用代码的方法，但是在JS中，有更简洁的的方法，其中包括借用、绑定、复制属性、原型链链接、以及从多个对象中混入(mixin)。在JS中不存在类，只存在对象，所以我们只要关注对象与对象之间的关系就行了。所以此节的继承的含义变为对象继承了另一个对象的属性。上一节的含义是子类继承了父类的属性并且实例化生成子类实例。

借用

有时候需要某个对象中的一两个方法，想要重用这些方法的时候又不希望与源对象产生继承关系，可以通过借用方法来实现。call()、apply()、bind()

let foo = {
  a: 2,
  b: function () {
    return this.a
  }
}
let bar = {
  a: 5
}
foo.b.call(bar) //? 5

在foo和bar不产生原型链接的情况下，bar调用了foo中的b方法，上篇SuperType.call(this, name)也是采用了这种方法。

克隆与混合

深拷贝与浅拷贝

因为JS中有基础类型和引用类型，如果分别将属性赋值过去，那两个对象的引用属性如数组和方法对象还是共用的一个。
简单的实现浅拷贝

  function copy(  targetObj,sourceObj ) {
    for (const key in sourceObj) {
      if (sourceObj.hasOwnProperty(key)) {
// 如果不希望发生覆盖可以 if (!(key in targetObj))只复制不存在于targetObj的属性
        targetObj[key] = sourceObj[key];
      }
    }
    return targetObj;
  }

  let foo = {
    a: 1,
    c: [1,2,3]
  }
  let bar = copy({a:2,b:3},foo)
  let baz = copy({},foo)
  bar.c.push(4)


  baz.a //? 1
  bar.a //? 1
  bar.b //? 3
  bar.c //? [1,2,3,4]
  foo.c //?[1,2,3,4]
  Object.getOwnPropertyNames(bar) //?['a','b','c']

引用类型共用所以修改数组c都会变，同名属性会被覆盖。而且拷贝的属性是有限制的，只拷贝源对象的自身属性（不拷贝继承属性），也不拷贝不可枚举的属性（enumerable: false）。ES6新增的对象结构赋值可以简单的实现此操作
let aClone = { ...a }
ES6新增的Object.assign也是这个功能，只不过更加复杂一些，Object.assign(target, source1, source2)可以有很多源对象。也就实现了混合。
可以用来

为对象添加属性和方法
克隆对象
合并多个对象
为属性制定默认值

const DEFAULTS = {
  logLevel: 0
};

function foo(options) {
  options = Object.assign({}, DEFAULTS, options);
  console.log(options)
}
foo({logLevel: 1})

深克隆

利用利用JSON对象中的parse和stringify。

let foo = {
  a: 2,
  b: function () {
    return 3
  },
  c: [1,2,3]
}
let bar = JSON.parse(JSON.stringify(foo))
foo.b() //?3
bar.a //?2
bar.c.push(4)
foo.c //?[1,2,3]
bar.c //?[1,2,3,4]
Object.getOwnPropertyNames(bar) //?[a,c]

可以看到函数丢了，序列化JavaScript对象时，所有函数和原型成员会被有意忽略，但是数组和对象都会被完整保留，在复制JSON对象时这个方法可以使用。

递归

function copyDeep(targetObj,sourceObj) {
  toStr = Object.prototype.toString
  astr = '[object Array]'
  for (const key in sourceObj) {
    if (sourceObj.hasOwnProperty(key)) {
      if (typeof sourceObj[key] === 'object') {
        targetObj[key] = (toStr.call(sourceObj[i]) === astr ? [] :{})
        copyDeep(targetObj[key],sourceObj[key])
      } else {
        targetObj[key] = sourceObj[key]
      }
    }
  }
}

简单的实现一下，这个代码很有问题。实际运用中最好使用lodash库来进行深克隆

不克隆

简单想一下克隆的应用场景，一是数据持久化，二是在不可变对象的情况下修改对象。非要深度克隆遍历所有属性继承属性数组对象函数的情况很少。这样在第一种情况下可以用JSON很好的实现。第二种情况，可以使用库来实现，比如diffy-update或者Immutable.js。因为没有用过就不细说了，下次特意用一下再写。

Object.create

Object.create()方法创建一个新对象，使用现有的对象来提供新创建的对象的__proto__。

let foo  = {
  a: 2,
  b: function (params) {
    return 3
  }
}
let bar = Object.create(foo)
bar.a //? 2 
bar.b() // 3

Object.getOwnPropertyDescriptors(bar) //? {}

和文章开头的例子一样，bar依然是个空白的对象，调用的方法都是沿着原型链向上查找的，为了不引起困惑让代码清晰。可以在bar上设置新方法调用的时候调用这个新方法。

bar.c = function () {
  return this.b()
}
bar.c() //?3

这样我们可以调用在bar上切实存在的属性方法又来源于foo

行为委托

这种复用的实质是JS中只存在对象与对象的链接，像上文一样，我们可以通过让两个对象链接在一起，从而使一个能够使用另一个的方法。
一个栗子，虽然很想用前面那个改造，而且也可以实现，但是SuperType在此节语境下有歧义并且不符合本节只有对象的思路。

let Foo = {
  init(name) {
    this.name = name
  },
  identify() {
    return this.name
  }
}
let Bar = Object.create(Foo)
Bar.speak = function () {
  console.log(`Hello, I am ${this.identify()}`)
}
let b1 = Object.create(Bar)
b1.init('b1')
let b2 = Object.create(Bar)
b2.init('b2')
b1.speak() //Hello I am b1
b2.speak() //Hello I am b2

这段代码中一共有四个对象，原型链接清晰明了。没有prototype对象也没有consructor的指向迷惑。这个原型图不需要画了，代码上就一目了然。

委托的应用

在《你不知道的js》上看的这种使用模式，在《js设计模式》上也有。有一些应用例子，但是复制粘贴也没意思，和typescript一样，没有在实际应用中使用过。这个也是等写几个demo后回来写。

总结

在js中还是用对象与原型链的方式比较舒服，没有任何歧义。

JavaScript中的代码复用——this、对象、类（3）（只有对象的世界）

前言