摘要：碰過的一個(gè)有趣的問題實(shí)現(xiàn)一個(gè)構(gòu)造函數(shù)，有一個(gè)屬性，每次調(diào)用該值加。共有方法看下面的代碼可以發(fā)現(xiàn)，被重復(fù)創(chuàng)建了如果不想方法或者屬性在每次時(shí)新創(chuàng)建一份，可以將其設(shè)置在構(gòu)造函數(shù)的原型上。

面向?qū)ο笥腥齻€(gè)特點(diǎn)，一個(gè)個(gè)來說：

利用閉包實(shí)現(xiàn)對(duì)象的私有變量。

function Animal (age) {
  this.getAge = function () {
    return age
  }
}
var dog = new Animal(3)
console.log(dog.age) // undefined
console.log(dog.getAge()) // 3

碰過的一個(gè)有趣的問題：
實(shí)現(xiàn)一個(gè)book構(gòu)造函數(shù)，有一個(gè)屬性id，每次調(diào)用該值加1。
運(yùn)用閉包和立刻執(zhí)行函數(shù)。

let Book = (function () {
  let id = 1
  return function () {
    this.id = id++
  }
})()
let bok1 = new Book() 
let bok2 = new Book() 
let bok3 = new Book() 
console.log(bok3.id) // 3

看下面的代碼可以發(fā)現(xiàn)，getAge被重復(fù)創(chuàng)建了

var dog = new Animal(3)
var cat = new Animal(5)
console.log(dog.getAge === dog.getAge) // false

如果不想方法或者屬性在每次new時(shí)新創(chuàng)建一份，可以將其設(shè)置在構(gòu)造函數(shù)的原型prototype上。

Animal.prototype.feed = function () {
  console.log("feed")
}
console.log(dog.feed === cat.feed) // true

聽說繼承有六種方法，假設(shè)讓Dog繼承Animal，無非就是for in 復(fù)制屬性，修改原型鏈如dog.prototype = new Animal，直接Object.create，在Dog中使用Animal.call
然而我們記住最好的一種就夠了,就是組合繼承。

先試下這樣寫，利用call的繼承:

function Animal (name) {
  this.name = name;
  this.say = function() {
    console.log(this.name)
  }
}
// *1
function Dog (color, name) {
  Animal.call(this, name)
  this.color = color
}


// *2
let wangcai = new Dog("blue", "wangcai")
console.log(wangcai) // {color: "blue", name: "wangcai")
wangcai.say() // "wangcal"

可是如果在*1處加上這樣的代碼

Animal.prototype.say2 = function() {
    console.log(this.name)
}

在*3處輸入

wangcai.say2()，會(huì)報(bào)錯(cuò)提示不存在該方法，說明我們的繼承是不完整的。dog沒有繼承原型鏈上的方法

我們需要在*2補(bǔ)上:

Dog.prototype = Object.create(Animal.prototype)

這時(shí)候不會(huì)報(bào)錯(cuò)了,補(bǔ)上Object.create的polyfill

function objectCreate (proto) {
  function F() {}
  F.prototype = proto;
  return new F();
}

然而還有一點(diǎn)小漏洞，當(dāng)我們查看wangcai.constructor時(shí)，會(huì)發(fā)現(xiàn)指向的是Animal。因此我們需要修復(fù)一下:

Dog.prototype.constructor = Dog

補(bǔ)充一下new的模擬

function fNew (base) {
var o = {}
o.__proto__ = base.prototype
base.call(o)
return o
}

完整代碼

function Animal (name) {
  this.name = name;
  this.say = function() {
    console.log(this.name)
  }
}
Animal.prototype.say2 = function () {
  console.log(this.name)
}
function Dog (color, name) {
  Animal.call(this, name)
  this.color = color
}
Dog.prototype = Object.create(Animal.prototype)
Dog.prototype.constructor = Dog
let wangcai = new Dog("blue", "wangcai")

檢測(cè)繼承是否成功的代碼:

console.log(wangcai instanceof Animal)
console.log(wangcai instanceof Dog)
console.log(wangcai.constructor === Dog)
console.log(wangcai.say2 === Animal.prototype.say2)
console.log(wangcai.__proto__ === Dog.prototype)
console.log(wangcai.__proto__.__proto__ === Animal.prototype)
console.log(wangcai.__proto__.__proto__.__proto__ === Object.prototype)
console.log(wangcai.constructor === Dog)

使用Object.create()和修復(fù)Dog.prototype.constructor = Dog是不是挺多余的？es6提供了這么一個(gè)函數(shù)Object.setPrototypeOf.

因此我們可以使用

Object.setPrototypeOf(Dog.prototype, Animal.prototype)

替換剛剛提到的兩行代碼

可以了解到Object.setPrototypeOf(A,B)相當(dāng)于令A(yù).__proto__ = B。

一個(gè)函數(shù)可以應(yīng)用于不同的對(duì)象。并且根據(jù)this的不同，函數(shù)調(diào)用的結(jié)果也不同

function test() {
  alert([this.a, this.b]);
}
 
test.call({a: 10, b: 20}); // 10, 20
test.call({a: 100, b: 200}); // 100, 200
 
var a = 1;
var b = 2;
 
test(); // 1, 2

或是在函數(shù)中檢測(cè)arguments的數(shù)量和類型來實(shí)現(xiàn)多態(tài)

function add (a, b) {
  if (arguments.length  === 2) {
    return a + b
  } else {
    return a + 1
  }
}
console.log(add(1,4))
console.log(add(1))

END