JavaScript函数参数修改的三种方式及变量声明的影响

作者:青柠

时间:2026-10-27

浏览:125

本文探讨JavaScript中函数内部修改参数值的三种方式:直接修改形参、通过arguments对象修改以及函数内部声明同名局部变量。文章通过代码示例展示了直接赋值和arguments索引修改对形参及arguments对象的同步影响,并重点分析了仅声明不赋值局部变量与赋值操作在变量提升机制下的不同表现,指出此时形参值保持不变。

文章目录

JavaScript函数参数修改机制概述

这一讨论源于一道笔试题的启发。在常规开发实践中,开发者通常避免在函数内部修改传入的参数值,但为了深入理解JavaScript的执行机制,这里对三种可以修改参数值的情形进行具体分析。

直接修改形参

第一种情形是直接修改函数声明时定义的形参。

代码如下:

function f1(a) {
alert(a);
a = 1;//修改形参a
alert(1 === a);
alert(1 === arguments[0]);
} 
f1(10);

在函数f1中定义了参数a,调用时传入参数10。执行流程先弹出10,随后将a修改为1。此时再次弹出两次true,表明形参a和arguments[0]的值均已同步更新为1。

通过arguments对象修改

第二种情形是通过函数内部的arguments对象来修改参数。

代码如下:

function f2(a) {
alert(a);
arguments[0] = 1;//修改arguments
alert(1 === a);
alert(1 === arguments[0]);
} 

其执行效果与函数f1相同,修改arguments[0]同样会同步更新形参a的值。

声明同名局部变量并赋值

第三种情形涉及函数内部声明的局部变量与形参同名。

代码如下:

function f3(a) {
alert(a);
var a = 1;//声明局部变量a且赋值为1
alert(1 === a);
alert(arguments[0]);
} 
f3(10);

在函数f3中定义了形参a,并在函数内部使用var声明了一个同名的局部变量a,同时赋值为1。尽管存在变量声明,此处的a仍然指向参数a。从最后弹出的arguments[0]被修改为1这一结果可以证明,形参与arguments对象的绑定关系依然有效。

仅声明局部变量不赋值的情况

4,若仅声明局部变量a而未赋值,情形则有所不同

代码如下:

function f3(a) {
var a;//仅声明,不赋值
alert(a);
alert(arguments[0]);
} 
f3(10);

此时弹出的值均为10,而不是undefined。这表明仅声明而不赋值的局部变量,其提升后的初始值即为形参传入的值,不会像赋值操作那样触发对arguments对象的同步修改机制。

实用工具推荐

电子包浆

绿化、压缩、噪点和虚拟水印,自由调节做旧程度。

使用 ›
图片压缩

选择画质和输出格式,预览压缩前后的大小。

使用 ›
相关文章