正文

JS深入浅出：值传递与引用传递，告别变量传参疑惑

/0 浏览量
0601

在JavaScript中，理解值传递（Value Passing）和引用传递（Reference Passing）是至关重要的，因为它们决定了变量在函数中是如何被操作的。本文将深入浅出地解释这两个概念，帮助读者告别变量传参的疑惑。

值传递（Value Passing）

在JavaScript中，基本数据类型（如数字、字符串、布尔值等）是通过值传递的方式传递的。这意味着，当我们将一个基本数据类型的变量作为参数传递给一个函数时，实际上传递的是该变量的一个副本。

例子

function changeValue(a) {
    a = 10;
}

let num = 5;
changeValue(num);
console.log(num); // 输出：5

在上面的例子中，num 是一个基本数据类型的变量。当我们将它传递给 changeValue 函数时，a 变量实际上接收了 num 的一个副本。因此，修改 a 的值不会影响 num 的值。

引用传递（Reference Passing）

与基本数据类型不同，复杂数据类型（如对象、数组等）是通过引用传递的方式传递的。这意味着，当我们将一个复杂数据类型的变量作为参数传递给一个函数时，实际上传递的是该变量的内存地址。

例子

function changeArray(arr) {
    arr.push(10);
}

let arr = [1, 2, 3];
changeArray(arr);
console.log(arr); // 输出：[1, 2, 3, 10]

在上面的例子中，arr 是一个复杂数据类型的变量。当我们将它传递给 changeArray 函数时，arr 的内存地址被传递给了函数内部的 arr 变量。因此，修改 arr 的值将影响原始的 arr 变量。

避免混淆的方法

为了防止混淆，我们可以遵循以下原则：

  1. 使用 const 关键字声明基本数据类型的变量，这样它们就不能被修改了。
  2. 当处理复杂数据类型时，使用 .slice()、.concat() 等方法创建副本，然后再进行修改。

例子

let arr = [1, 2, 3];
let newArr = arr.slice();
newArr.push(10);
console.log(arr); // 输出：[1, 2, 3]
console.log(newArr); // 输出：[1, 2, 3, 10]

总结

理解值传递和引用传递是JavaScript编程的基础。通过本文的介绍，相信读者已经对这两个概念有了更深入的了解。在编写JavaScript代码时，正确处理变量传递将有助于避免潜在的错误和混淆。

-- 展开阅读全文 --