JavaScript函数参数可修改性详解：三种方式与变量声明陷阱

直接修改形参值

在函数体内直接对形参进行赋值是最直观的方式。由于JavaScript中基础类型（如数字、字符串）是传值调用，修改内部局部变量不会影响外部实参的值，但在函数内部执行期间，形参会被更新。同时，在早期非严格模式的ECMAScript实现中，形参与 arguments 对象的对应元素存在双向绑定关系。

function f1(a) {
    // 初始弹出 10
    console.log(a); 
    a = 1; // 修改形参a
    console.log(1 === a);       // 输出 true
    console.log(1 === arguments[0]); // 输出 true，二者同步更新
}
f1(10); 

此示例展示了直接赋值后，a 和 arguments[0] 均变为 1。

通过arguments对象修改

另一种方式是访问函数内置的 arguments 对象，并修改其索引对应的值。在非严格模式下，这同样会反映到对应的形参变量上。

function f2(a) {
    console.log(a);        // 初始值 10
    arguments[0] = 1;      // 修改arguments对象
    console.log(1 === a);          // 输出 true
    console.log(1 === arguments[0]); // 输出 true
}

同名局部变量声明的影响

若在函数内部使用 var 声明一个与形参同名的变量，需注意JavaScript的变量提升机制。此时并非创建新变量，而是指向同一个参数存储位置。因此，后续赋值会直接修改参数值。

function f3(a) {
    console.log(a);     // 原始传入值 10
    var a = 1;          // 重新赋值为1
    console.log(1 === a);     // 输出 true
    console.log(arguments[0]); // 输出 1，证明原参数已被修改
}
f3(10); 

尽管代码看起来像是在声明局部变量，但实际上它只是对原有参数进行了重写。

仅声明不赋值的特殊情形

如果仅进行 var 声明而不赋值，情况有所不同。因为参数已经存在且拥有初始值，单纯的声明操作不会改变其状态，也不会将其重置为 undefined。

function f4(a) {
    var a;         // 仅声明，利用已有参数值
    console.log(a);           // 输出 10
    console.log(arguments[0]); // 输出 10
}  
f4(10); 

这里 a 保持了调用时的值 10，验证了重复声明不会丢失原始参数。

总结与注意事项

虽然在上述测试中能修改参数，但在现代开发规范中应避免此类做法。首先，arguments 与形参的双向绑定特性仅在非严格模式下显著，且在ES6引入解构赋值和剩余参数（...）后，旧有行为不再适用；其次，修改传入的参数会降低代码可读性，导致调试困难。建议采用明确的重命名或返回新值的方式来处理数据变更，保持函数行为的纯度和预期一致性。以上就是浅谈JavaScript函数参数的可修改性问题的详细内容，更多关于JavaScript参数传递机制的资料请关注本站其它相关文章！