面向委托的設計模式

看了很久的You don't know Javascript，今天就來寫一寫對于OLOO（對象關聯）編程模式的小總結，雖然這本書吃的不是很透，但是還是試著寫一寫，分享一下。

相信大家對于面向對象編程語言中的類都不陌生，子類會復制父類的所有屬性，而對于JS呢，她并不會去復制，而是利用了委托（即[[prototype]]鏈）。

模仿“類”的JS

Javascript中有一種奇怪的行為一直在被無恥的濫用，那就是模仿類。
比如如下代碼：

function Foo(name) {
  this.name = name;
}
Foo.prototype.myName = function () {
  return this.name;
}

var a = new Foo('a');
var b = new Foo('b');

a.myName();  // a
b.myName();  // b

以上代碼用到了this和prototype，相信大家都很熟悉，但是我們的Foo函數里并沒有myName方法，此時就用到了[[prototype]]鏈，如果myName在a或者b中找不到，就會通過委托在Foo.prototype上進行查找。
下面這段代碼使用的就是典型的“原型風格”：

function Foo(name) {
  this.name = name;
}

Foo.prototype.myName = function () {
  return this.name;
}

function Bar(name, label) {
  Foo.call(this, name);
  this.label = label;
}
// 將Bar.prototype關聯到Foo.prototype上
Bar.prototype = Object.create(Foo.prototype);
// 提示一下，如果此時要使用到Bar.constructor
// 就應該手動重置一下此屬性，使其指到Bar上。

Bar.prototype.myLabel = function () {
  return this.label;
}

var a = new Bar('a', 'obj a');

a.myName();  // a
a.myLabel(); // obj a

委托關聯

大家可以看到，強行模仿類的JS，看著很晦澀難懂。接下就簡單介紹一下委托關聯OLOO（Objects Linking to Others Objects）。

委托關聯沒有用到構造函數，直接通過Object.create方法，構建對象之間的關系。
直接上代碼可能會更容易理解，我們就直接改寫了上邊那個Foo和Bar的例子，代碼如下：

var Foo = {
  initFoo: function (name) {
    this.name = name;
  },
  myName: function () {
    return this.name;
  }
};

// 創建Bar，并委托Foo的屬性
var Bar = Object.create(Foo);

Bar.initBar = function (name, label) {
  this.initFoo(name);
  this.label = label;
};
Bar.myLabel = function () {
  return this.label;
};

var a = Object.create(Bar);

a.initBar('a', 'obj a');
a.myName();  // a
a.myLabel(); // obj a

以上代碼就十分容易理解了吧，Bar委托了Foo的屬性，也沒有煩人的prototype干擾思維。

以上就是對于委托關聯的簡單介紹，請原諒本人是前端小白，講的不妥或者不好的地方，歡迎大家指正以及交流。