函数参数传递的按值传递本质

在JavaScript中，函数参数的传递方式经常引起开发者的困惑。许多人误以为JavaScript中对象是通过"引用传递"的，但实际上JavaScript中的所有参数传递都是"按值传递"的。理解这一本质区别对于编写可靠和可预测的代码至关重要。

基本类型与引用类型的值传递

JavaScript中的数据类型可以分为基本类型（Primitive types）和引用类型（Reference types）：

基本类型：Undefined、Null、Boolean、Number、String、Symbol（ES6新增）
引用类型：Object（包括Array、Function等）

对于基本类型，参数传递的行为非常直观：

javascript 复制代码

function changeValue(num) {
  num = 10;
  console.log(num); // 10
}

let originalNum = 5;
changeValue(originalNum);
console.log(originalNum); // 5

在这个例子中，originalNum的值被复制给了函数内部的num参数，函数内部对num的修改不会影响外部的originalNum。

对象传递的误解

当涉及到对象时，情况看似不同，但本质相同：

javascript 复制代码

function changeObj(obj) {
  obj.name = "Changed";
  console.log(obj.name); // "Changed"
}

let originalObj = { name: "Original" };
changeObj(originalObj);
console.log(originalObj.name); // "Changed"

这个例子似乎表明对象是通过引用传递的，因为函数内部的修改影响了外部对象。但实际上，这里传递的仍然是值——只不过这个值是对象的引用（内存地址）的副本。

按值传递的本质证明

要证明JavaScript是严格按值传递的，请看以下示例：

javascript 复制代码

function reassignObj(obj) {
  obj = { name: "New Object" };
  console.log(obj.name); // "New Object"
}

let myObj = { name: "Original" };
reassignObj(myObj);
console.log(myObj.name); // "Original"

如果JavaScript是按引用传递的，那么重新赋值obj应该改变外部myObj的引用，但实际上并没有。这说明函数内部获得的只是外部对象引用的副本，而不是引用本身。

参数传递的内存模型

理解这一概念的关键在于区分"引用"和"引用值"：

对于基本类型，传递的是实际值的副本
对于对象类型，传递的是对象引用（指针）的副本，而不是引用本身

内存中的表现如下：

复制代码

原始对象引用 (myObj) → 对象内存
                      ↗
函数参数 (obj) ——→

当我们在函数内部修改对象属性时，通过副本引用仍然可以访问和修改原始对象。但当我们将参数重新赋值为一个新对象时，只是改变了副本引用的指向，原始引用不受影响。

实际应用中的注意事项

理解这一机制有助于避免常见的错误：

不要期望通过参数重新赋值来修改外部变量：

javascript 复制代码

function clearArray(arr) {
  arr = []; // 这不会影响外部数组
}

let myArray = [1, 2, 3];
clearArray(myArray);
console.log(myArray); // [1, 2, 3]

如果需要修改外部对象，应该操作其属性：

javascript 复制代码

function clearArray(arr) {
  arr.length = 0; // 这会清空外部数组
}

创建防御性副本：

javascript 复制代码

function processData(data) {
  let localCopy = JSON.parse(JSON.stringify(data));
  // 操作localCopy不会影响原始数据
}

总结

JavaScript中的参数传递始终是按值传递的，无论是基本类型还是对象类型。对于对象类型，传递的值是对象引用的副本，这解释了为什么可以修改对象属性但不能直接替换整个对象。理解这一本质区别有助于开发者编写更可靠、更可预测的代码，避免常见的陷阱和错误。