在 JavaScript 中，函数是编程语言中的核心概念之一，尤其在前端开发中更是不可或缺的。函数中的参数传递是我们经常会遇到的问题。在这篇文章中，我们将深入研究 JavaScript 中的函数参数传递，探讨其内部的机制和使用上的技巧，以及一些实用的示例代码。
JavaScript 中的参数传递方式
在 JavaScript 中，函数可以接收零个或多个参数。这些参数可以通过以下三种方式传递给函数：
- 值类型传递（传递基本数据类型的值）
- 引用类型传递（传递对象、数组等引用类型的数据）
- ES6 中新增的扩展运算符（...）
值类型传递
值类型传递指的是传递基本数据类型的值，包括 undefined、null、布尔值、数字和字符串等。当把一个基本数据类型的值作为函数的参数传递时，函数会在新的内存地址中创建一个新的变量，它的值与参数值相同。在函数内部修改该变量的值不会影响原始的参数值。
下面是一个值类型传递的示例：
function demo(val) {
val = 123; // 修改了函数内的变量，不会影响外面的变量，因为它们是不同的
}
let num = 456;
demo(num);
console.log(num); // 456引用类型传递
引用类型传递指的是传递对象、数组等引用类型的数据。当把一个引用类型的值作为函数的参数传递时，函数会创建一个指向该对象或数组的新的变量。在函数内部如果修改该变量的属性或元素，原始值将发生变化。
下面是一个引用类型传递的示例：
function demo(obj) {
obj.name = "Jack"; // 修改了函数内的对象属性，会影响外面的对象属性，因为它们指向的是同一个对象
}
let person = { name: "John" };
demo(person);
console.log(person.name); // Jack扩展运算符
ES6 中新增了扩展运算符（...），它可以将数组或对象解构成个别的参数，或将参数组合成数组或对象。使用扩展运算符可以方便地将多个参数合并成一个数组，或将一个数组解构后作为函数的多个参数。
下面是一个扩展运算符的示例：
function demo(...args) {
console.log(args); // [1, 2, 3, 4]
}
let arr = [1, 2, 3, 4];
demo(...arr); // 将数组解构成多个参数传递给函数JavaScript 中函数参数异常处理
在函数中，我们经常需要处理一些参数异常，比如检查参数是否齐全、参数类型是否正确等。下面是一些常见的参数异常处理方法：
参数默认值
ES6 中新增了函数参数的默认值语法，它允许为函数的参数设置默认值。如果该参数没有被传递，会自动使用设置的默认值。这样可以避免无效参数的出现。
下面是一个参数默认值的示例：
function demo(x = 0, y = 0) {
return x + y;
}
console.log(demo(1, 2)); // 3
console.log(demo(1)); // 1
console.log(demo()); // 0参数检查
为了确保函数的正确性和稳定性，我们需要对参数进行检查。通常我们会使用类型判断、正则表达式等方式来检查参数是否符合要求。
下面是一个参数检查的示例：
-- -------------------- ---- -------
-------- ---------- ---- -
-- ------- ---- --- --------- -
----- --- --------------- ---- -- - --------- -- --------
-
-- ------- --- --- --------- -
----- --- -------------- ---- -- - --------- -- --------
-
--------------- ---- -- -------- --- - -- ------ ----- -------
-
------------ ----
------------ -- --------
------------ ------ -- --------可选参数
有时函数可能需要一些可选参数，我们需要在函数中检查是否有传入该参数，如果没有则使用默认值或其他处理方法。
下面是一个可选参数的示例：
-- -------------------- ---- -------
-------- ---------- ---- ----- -
-- ----- --- ---------- -
---- - -- -- - --------- --- ------------
-
--------------- ---- -- -------- --- - -- ------ ----- ---- ----------
-
------------ ----
----------- --- -- -- -- -- ------------总结
函数参数传递是 JavaScript 中一个重要的概念，理解其内部的机制和使用方法对于我们编写高质量的代码非常重要。在本文中，我们深入讨论了值类型传递、引用类型传递和扩展运算符等传递方式，并介绍了参数默认值、参数检查和可选参数等异常处理方法。希望这篇文章对于您在前端开发中使用函数时有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6456f285968c7c53b09d64a4