JavaScript变量传递机制:值传递与引用传递详解

作者:半夏

时间:2026-10-25

浏览:550

本文深入解析JavaScript中变量赋值的底层机制,澄清值传递与引用传递的常见误区。通过基本数据类型与对象类型的对比案例,说明JavaScript统一采用按值传递的方式:基本类型复制实际数值,对象类型复制内存地址指针。理解这一机制有助于避免对象属性修改带来的意外副作用,掌握函数参数传递的正确方式。

文章目录

JavaScript变量传递机制:值传递与引用传递详解

当变量A被赋值给变量B时,系统会将栈内存中存储的值复制一份,并放入为新变量B分配的空间中。



这种机制具体如何运作?


参考以下代码示例:

 
var x = y = 1;
y = 2;
alert(x);

此时x的值是多少?


再看另一段代码:

 
var obj = {};
var sub = {};
sub['id'] = 3;
obj['sub'] = sub;
sub['id'] = 4;
alert(obj['sub']['id']);

obj['sub']['id']的值是多少?这是否符合你的预期?



分别运行上述两组代码,我们发现第一组中x的值未发生变化,而第二组中obj['sub']['id']的值发生了改变。尽管两者都涉及赋值操作,且都修改了“拷贝”后的值,但源变量的表现却截然不同。这究竟意味着JavaScript是按值传递还是按引用传递?



李松峰翻译的《JavaScript 高级程序设计 第二版》对此提供了明确解释。


在上述两个示例中,实际上都是将A的值复制给了B。区别在于:第一个例子中,A存储的是整型数值1;第二个例子中,A存储的是一个指向对象的内存地址指针。复制操作后,第一个例子中的B获得了新的整型值1,而第二个例子中的B获得了新的地址指针,该指针指向原对象的内存地址。



以下示例有助于进一步理解这一概念:


代码如下:

 
function setName(obj){
obj.name = "test1";
obj = {};
obj.name = "test2";
} 
var person = new Object();
setName(person);
alert(person.name);

可以看到,尽管在setName函数内部修改了obj的name属性,但person.name的值并未改变。这是因为函数内部的obj指向了一个新的空对象地址,修改该新地址的属性不会影响原person对象所指向的地址。这一现象进一步证实了JavaScript的传递机制是按值传递。

实用工具推荐

电子包浆

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

使用 ›
图片压缩

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

使用 ›
相关文章