迹忆客 专注技术分享

当前位置:主页 > 学无止境 > WEB前端 > JavaScript >

JavaScript 函数重载

作者:迹忆客 最近更新:2024/03/17 浏览次数:

本教程向你介绍 JavaScript 函数重载。函数重载意味着拥有多个同名函数和各种实现。但是,这个概念在 JavaScript 中不可用。

如果你有多个同名函数,则最后一个函数在 JavaScript 中执行。因此,我们使用替代方法在 JavaScript 中实现函数重载。

本教程使用 if-elseswitch 和函数表达式来完成函数重载。


在 JavaScript 中使用 if-else 语句进行函数重载

function displaySum() {
  // if no argument
  if (arguments.length == 0) {
    console.log('No argument is passed.');
  }

  // if only one argument
  else if (arguments.length == 1) {
    console.log('You have to pass at least two arugments to perform addition.');
  }

  // multiple arguments
  else {
    let sum = 0;
    let length = arguments.length;
    for (var i = 0; i < length; i++) {
      sum = sum + arguments[i];
    }
    console.log('Sum is ' + sum);
  }
}

displaySum();                     // call function with no parameter
displaySum(3);                    // call function with one parameter
displaySum(4, 5);                 // call function with two parameters
displaySum(3, 5, 7, 2, 9, 7, 8);  // call function with multiple parameters

输出:

"No argument is passed."
"You have to pass at least two arguments to perform addition."
"Sum is 9"
"Sum is 41"

在代码片段中,我们使用 if-else 语句在 JavaScript 中进行函数重载。我们调用 displaySum() 函数,它使用不同的参数执行不同的操作。如果没有传递或传递一个参数,它会显示一条消息。

如果给定两个参数,它将添加两个数字,并使用 for 循环将多个参数中的所有值相加。arguments 是类似数组的对象,它们起着至关重要的作用,可以在函数中使用。它表示正在使用它的特定函数传递的参数


在 JavaScript 中使用 switch 语句进行函数重载

我们还可以在 JavaScript 中通过使用 switch 语句而不是 if-else 语句来实现函数重载。尽管两者都产生相同的输出,但使用 switch 语句的代码看起来更简洁。

function displaySum() {
  switch (arguments.length) {
    // if no argument
    case 0:
      console.log('No argument is passed.');
      break;

      // if only one argument
    case 1:
      console.log(
          'You have to pass at least two arguments to perform addition.');
      break;

      // multiple arguments
    default:
      let sum = 0;
      let length = arguments.length;

      for (var i = 0; i < length; i++) {
        sum = sum + arguments[i];
      }
      console.log('Sum is ' + sum);
      break;
  }
}

displaySum();                     // call function with no parameter
displaySum(3);                    // call function with one parameter
displaySum(4, 5);                 // call function with two parameters
displaySum(3, 5, 7, 2, 9, 7, 8);  // call function with multiple parameters

输出:

"No argument is passed."
"You have to pass at least two arguments to perform addition."
"Sum is 9"
"Sum is 41"

在这段代码中,我们使用 switch 语句根据各种参数完成不同的操作。你可以在此处或上一节中阅读有关 arguments 对象的信息。


在 JavaScript 中使用函数表达式进行函数重载

// Creating a class "practiceFunctionOverloading"
class practiceFunctionOverloading {
  // Creating an overloadable function.
  displaySum() {
    // Define four overloaded functions
    var functionNoParam = function() {
      return 'No parameter is passed.';
    };
    var functionOneParam = function(arg1) {
      return 'You must have at least two parameters to sum.';
    };
    var functionTwoParam = function(arg1, arg2) {
      console.log('Sum is given below: ');
      return arg1 + arg2;
    };
    var functionMultiParam = function(arg1, arg2, arg3) {
      var sum = 0;
      for (var i = 0; i < arguments.length; i++) {
        sum = sum + arguments[i];
      }
      console.log('Sum is given below: ');
      return sum;
    };

    /* the length and type of the arguments passed
       ( in this case an Array ) we can determine
       which function to be executed */
    if (arguments.length === 0) {
      return functionNoParam();
    } else if (arguments.length === 1) {
      return functionOneParam(arguments[0]);
    } else if (arguments.length === 2) {
      return functionTwoParam(arguments[0], arguments[1]);
    } else if (arguments.length > 2) {
      return functionMultiParam(arguments[0], arguments[1], arguments[2]);
    }
  }
}
// Driver Code
// create an object of class practiceFunctionOverloading
var object = new practiceFunctionOverloading();
console.log(object.displaySum());         // call function with no parameter
console.log(object.displaySum(1));        // call function with one parameter
console.log(object.displaySum(2, 3));     // call function with two parameters
console.log(object.displaySum(2, 4, 5));  // call function with three parameters

输出:

"No parameter is passed."
"You must have at least two parameters to sum."
"Sum is given below: "
5
"Sum is given below: "
11

我们使用函数和函数表达式来模拟使用 JavaScript 的函数重载。这种方法的缺点是如果传递了数百个参数,代码看起来会比较混乱。

上一篇:JavaScript 中函数的返回值

下一篇:没有了

转载请发邮件至 1244347461@qq.com 进行申请,经作者同意之后,转载请以链接形式注明出处

本文地址:

相关文章

JavaScript console.error

发布时间:2024/03/17 浏览次数:61 分类:JavaScript

JavaScript 有多个与其他数据类型和对象交互的对象。控制台也是一个类似的对象,它允许我们在浏览器环境中预览开发输出。本文展示了控制台在 JavaScript 中的使用。

Discord JavaScript 控制台

发布时间:2024/03/17 浏览次数:177 分类:JavaScript

实验上,通过控制台面板向收件人发送消息是一个有趣的事实。几乎抽象的 UI 在发送和接收消息时几乎没有任何踪迹来了解正在运行的内容。使用标头,添加特定的用户 ID,结合 Disco

在 JavaScript 中求平均值的示例

发布时间:2024/03/17 浏览次数:72 分类:JavaScript

没有内置的方法可以在 JavaScript 中获得平均值。我们通常会使用不同的技巧和方法来实现该功能以计算定义值的平均值。

扫一扫阅读全部技术教程

社交账号
  • https://www.github.com/onmpw
  • qq:1244347461

最新推荐

教程更新

热门标签

扫码一下
查看教程更方便