摘要：我們知道，函數(shù)可以隨意傳遞任意數(shù)量任意類型的參數(shù)，那么它有沒有重載呢答案是有的，下面我們通過種方法來實(shí)現(xiàn)的函數(shù)重載。因此，每次調(diào)用，都會(huì)有一個(gè)執(zhí)行環(huán)境保存著當(dāng)時(shí)的和，所以在調(diào)用的時(shí)候可以找到當(dāng)時(shí)注入的，實(shí)現(xiàn)函數(shù)重載。

重載是指函數(shù)或者方法有相同的名稱，但是參數(shù)個(gè)數(shù)或類型不相同的情形，這樣的同名不同參的函數(shù)或者方法之間，互相稱之為重載函數(shù)或方法。

我們知道，JavaScript函數(shù)可以隨意傳遞任意數(shù)量、任意類型的參數(shù)，那么它有沒有重載呢？

答案是有的，下面我們通過3種方法來實(shí)現(xiàn)JavaScript的函數(shù)重載。

我們有一個(gè)people對(duì)象

var people = {
  values: ["Dean Edwards", "Sam Stephenson", "Alex Russell", "Dean Tom"]
};

想要實(shí)現(xiàn)一個(gè)find方法，不傳參數(shù)的時(shí)候，輸出所有名字，只傳1個(gè)參數(shù)的時(shí)候，輸出所有fristName和參數(shù)相同的名字，傳2個(gè)參數(shù)的時(shí)候，輸出所有firstName和lastName和2個(gè)參數(shù)分別相同的名字。

people.find();                          // ["Dean Edwards", "Sam Stephenson", "Alex Russell", "Dean Tom"]
people.find("Dean");                    // ["Dean Edwards", "Dean Tom"]
people.find("Dean", "Edwards");            // ["Dean Edwards"]

people.find = function () {
  switch (arguments.length) {
    case 0:
      return this.values;

    case 1:
      return this.values.filter((value) => {
        var firstName = arguments[0];
        return value.indexOf(firstName) !== -1 ? true : false;
      });

    case 2:
      return this.values.filter((value) => {
        var fullName = `${arguments[0]} ${arguments[1]}`;
        return value.indexOf(fullName) !== -1 ? true : false;
      });
  }
};

console.log(people.find());                 // ["Dean Edwards", "Sam Stephenson", "Alex Russell", "Dean Tom"]
console.log(people.find("Dean"));           // ["Dean Edwards", "Dean Tom"]
console.log(people.find("Dean", "Edwards"));   // ["Dean Edwards"]

這種方式大家肯定都能看懂，就不多說啦。

function addMethod (object, name, fn) {
  // 把前一次添加的方法存在一個(gè)臨時(shí)變量old中
  var old = object[name];

  // 重寫object[name]方法
  object[name] = function () {
    if (fn.length === arguments.length) {
      // 如果調(diào)用object[name]方法時(shí)，如果實(shí)參和形參個(gè)數(shù)一致，則直接調(diào)用
      return fn.apply(this, arguments);
    } else if (typeof old === "function") {
      // 如果實(shí)參形參不一致，判斷old是否是函數(shù)，如果是，就調(diào)用old
      return old.apply(this, arguments);
    }
  };
}

addMethod(people, "find", function() {
  return this.values;
});

addMethod(people, "find", function(firstName) {
  return this.values.filter((value) => {
    return value.indexOf(firstName) !== -1 ? true : false;
  });
});

addMethod(people, "find", function(firstName, lastName) {
  return this.values.filter((value) => {
    var fullName = `${firstName} ${lastName}`;
    return value.indexOf(fullName) !== -1 ? true : false;
  });
});

console.log(people.find());                     // ["Dean Edwards", "Sam Stephenson", "Alex Russell", "Dean Tom"]
console.log(people.find("Dean"));               // ["Dean Edwards", "Dean Tom"]
console.log(people.find("Dean", "Edwards"));    // ["Dean Edwards"]

這里addMethod(object, name, fn)方法是核心。我們著重分析一下為什么這里會(huì)有閉包，可以保存上一個(gè)注冊(cè)的函數(shù)。

function addMethod (object, name, fn) {
  // object, name, fn是傳入的3個(gè)參數(shù)
  var old = object[name];

  object[name] = function () {
    // 這里對(duì)old和fn進(jìn)行了引用
    if (fn.length === arguments.length) {
      return fn.apply(this, arguments);
    } else if (typeof old === "function") {
      return old.apply(this, arguments);
    }
  };
}

object是另外一個(gè)引用對(duì)象，它的一個(gè)方法中引用了old和fn，所以對(duì)于addMethod來說，它的局部變量在addMethod函數(shù)執(zhí)行完后，仍然被另外的變量所引用，導(dǎo)致它的執(zhí)行環(huán)境無法銷毀，所以產(chǎn)生了閉包。

因此，每次調(diào)用addMethod，都會(huì)有一個(gè)執(zhí)行環(huán)境保存著當(dāng)時(shí)的old和fn，所以在調(diào)用people.find()的時(shí)候可以找到當(dāng)時(shí)注入的fn，實(shí)現(xiàn)函數(shù)重載。

var proxy = new Proxy(people, {
  get: function (target, key, receiver) {
    if (key === "find") {
      return function () {
        switch (arguments.length) {
          case 0:
            return this.values;
      
          case 1:
            return this.values.filter((value) => {
              var firstName = arguments[0];
              return value.indexOf(firstName) !== -1 ? true : false;
            });
      
          case 2:
            return this.values.filter((value) => {
              var fullName = `${arguments[0]} ${arguments[1]}`;
              return value.indexOf(fullName) !== -1 ? true : false;
            });
        }
      };
    }

    return Reflect.get(target , key , receiver);
  },

  set: function (target, key, value, receiver) {
    return Reflect.set(target, key, value, receiver);
  }
});

console.log(proxy.find());                     // ["Dean Edwards", "Sam Stephenson", "Alex Russell", "Dean Tom"]
console.log(proxy.find("Dean"));               // ["Dean Edwards", "Dean Tom"]
console.log(proxy.find("Dean", "Edwards"));   // ["Dean Edwards"]

這樣寫其實(shí)感覺有點(diǎn)畫蛇添足了，就當(dāng)成是另外一種思路吧。

JavaScript可以實(shí)現(xiàn)函數(shù)重載，主要有兩種思想：

利用arguments類數(shù)組來判斷接收參數(shù)的個(gè)數(shù)

利用閉包保存以前注冊(cè)進(jìn)來的同名函數(shù)