JavaScript函数重载

SnaiLiu 发布于2019-08-23 16:55 / 3398人阅读

摘要：实现函数重载函数重载，是等编程语言中具有的一项特性，这项特性允许创建数项名称相同但输入输出类型或个数不同的子程序，它可以简单地称为一个多带带功能可以执行多项任务的能力。其它在中加入了类型，它自带函数重载。

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 函数

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/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