JavaScript函數重載

SnaiLiu 發布于2019-08-23 16:55 / 3422人閱讀

摘要：實現函數重載函數重載，是等編程語言中具有的一項特性，這項特性允許創建數項名稱相同但輸入輸出類型或個數不同的子程序，它可以簡單地稱為一個多帶帶功能可以執行多項任務的能力。其它在中加入了類型，它自帶函數重載。

JavaScript實現函數重載

函數重載（function overloading），是 Ada、C++、C#、D、Java等編程語言中具有的一項特性，這項特性允許創建數項名稱相同但輸入輸出類型或個數不同的子程序，它可以簡單地稱為一個多帶帶功能可以執行多項任務的能力。維基百科-函數重載

函數重載是強類型語言的特性，雖然 js 是弱類型語言，我們可以通過一些方法實現函數重載。

場景

班級中有很多學生，通過姓名要找到某個學生或多個學生時，同一個方法傳入的參數個數的不同去查找同學。

const classRoom = {
    students: ["武大", "郎二", "張三", "張起靈", "李四", "王五"],
}

classRoom.find(); // ["武大", "郎二", "張三", "張起靈", "李四", "王五"];
classRoom.find("張"); // ["張三", "張起靈"];
classRoom.find("張", "三"); // ["張三"];

find()方法不傳入參數時，輸出班級所有學生。

find()方法傳一個參數（姓），輸入班級相同姓的學生。

find()方法傳兩個個參數（姓，名），輸入班級相同姓名的學生。

第一種

我們使用 arguments 和 switch 實現重載。

classRoom.find = function() {
    switch(arguments.length) {
        case 0:
            return this.students;
        case 1:
            return this.students.filter(student => {
                let surname = arguments[0];
                return ~student.indexOf(surname);
            });
        case 2:
            return this.students.filter(student => {
                let fullName = Array.prototype.slice.call(arguments).join("");
                return ~student.indexOf(fullName);
            });
    }
}

console.log(classRoom.find()); // [ "武大", "郎二", "張三", "張起靈", "李四", "王五" ]
console.log(classRoom.find("張")); // [ "張三", "張起靈" ]
console.log(classRoom.find("三")); // [ "張三" ]

第二種

使用 arguments 和閉包。

function addMethod(target, name, fn) {
    const old = target[name];

    target[name] = function() {
        if (fn.length === arguments.length) {
            return fn.apply(this, arguments);
        } else if (typeof old === "function") {
            return old.apply(this, arguments);
        }
    }
}

addMethod(classRoom, "find", function() {
    return this.students;
});

addMethod(classRoom, "find", function(surname) {
    return this.students.filter(student => {
        return ~student.indexOf(surname);
    });
});

addMethod(classRoom, "find", function(surname, personalName) {
    return this.students.filter(student => {
        return ~student.indexOf(surname + personalName);
    });
});

console.log(classRoom.find()); // [ "武大", "郎二", "張三", "張起靈", "李四", "王五" ]
console.log(classRoom.find("張")); // [ "張三", "張起靈" ]
console.log(classRoom.find("三")); // [ "張三" ]

調用addMethod時會將匿名函數指向classRoom中的find，由于classRoom是全局變量所以addMethod執行完畢后其中的old、fn仍然在被引用，這里產生閉包。

所以在每次調用addMethod時，都有一個執行環境保存著當時的old以及fn，所以在使用find方法是可以找到fn，實現重載。

需要注意的是：

這個重載適用于不同數量的參數，不區分類型、參數名或其它。

會有一些函數調用的開銷。

其它

在 TypeScript 中加入了類型，它自帶函數重載。ts函數

云服務器 GPU云服務器重載函數 python函數重載函數重載java舉例 javascript 函數

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/103506.html

JavaScript中的函數重載（Function overloading）

摘要：說明中沒有真正意義上的函數重載。先看第一種辦法，通過對象來實現對象，是函數內部的一個類數組對象，它里面保存著調用函數時，傳遞給函數的所有參數。說明 JavaScript 中沒有真正意義上的函數重載。函數重載函數名相同，函數的參數列表不同(包括參數個數和參數類型)，根據參數的不同去執行不同的操作。我們舉個例子看看 function overload(a){ conso...

inapt 2019-08-22 18:39 評論0 收藏0
重名就會被覆蓋？那JavaScript中是如何實現重載的呢？

摘要：但是我們知道中是沒有重載的為什么沒重載不是的特性也會有的嗎，因為后面定義的函數會覆蓋前面的同名函數，但是重載那么好用，我們想在實現函數重載該怎么辦呢今天就來給大家講講在里面實現函數重載的兩個思路。這就是閉包的核心作用。大家都知道，所謂重載，就是一組相同的函數名，有不同個數的參數，在使用時調用一個函數名，傳入不同參數，根據你的參數個數，來決定使用不同的函數！重載這個在JAVA這些經典的...

mozillazg 2019-08-22 18:40 評論0 收藏0
JavaScript實現函數重載

摘要：我們知道，函數可以隨意傳遞任意數量任意類型的參數，那么它有沒有重載呢答案是有的，下面我們通過種方法來實現的函數重載。因此，每次調用，都會有一個執行環境保存著當時的和，所以在調用的時候可以找到當時注入的，實現函數重載。概念重載是指函數或者方法有相同的名稱，但是參數個數或類型不相同的情形，這樣的同名不同參的函數或者方法之間，互相稱之為重載函數或方法。我們知道，JavaScript函數...

QLQ 2019-08-23 11:34 評論0 收藏0
JavaScript函數重載

摘要：譯者按之父巧妙地利用了閉包，實現了函數重載。在一個業余項目中，我寫了一個簡單的函數，用于實現函數重載。而所謂函數重載，就是函數名稱一樣，但是輸入輸出不一樣。譯者按: jQuery之父John Resig巧妙地利用了閉包，實現了JavaScript函數重載。原文: JavaScript Method Overloading 譯者: Fundebug 為了保證可讀性，本文采用意...

testHs 2019-08-20 18:26 評論0 收藏0
JavaScript之模擬函數重載

摘要：背景高級程序設計中提及，不支持函數重載。若出現函數名稱相同情況下，后者覆蓋前者，故此不會出現重載的情況。維基百科場景例如，一個工廠有著數量級的員工，期望通過姓名找到某一員工或某類員工，使用同一個方法通過透傳參數個數去查找員工。背景 ???????《JavaScript高級程序設計》中提及，JavaScript 不支持函數重載。若出現函數名稱相同情況下，后者覆蓋前者，故此不會出現重載...

chenjiang3 2019-08-26 10:46 評論0 收藏0