文档章节

js中引用传递和值传递

武文海
 武文海
发布于 2015/12/08 10:23
字数 1677
阅读 44
收藏 1
点赞 0
评论 0

按值传递 VS. 按引用传递

按值传递(call by value)是最常用的求值策略:函数的形参是被调用时所传实参的副本。修改形参的值并不会影响实参。

按引用传递(call by reference)时,函数的形参接收实参的隐式引用,而不再是副本。这意味着函数形参的值如果被修改,实参也会被修改。同时两者指向相同的值。

按引用传递会使函数调用的追踪更加困难,有时也会引起一些微妙的BUG。

按值传递由于每次都需要克隆副本,对一些复杂类型,性能较低。两种传值方式都有各自的问题。

我们先看一个C的例子来了解按值和引用传递的区别:

void Modify(int p, int * q) { 
  p = 27; // 按值传递 - p是实参a的副本, 只有p被修改     
  *q = 27; // q是b的引用,q和b都被修改 
} 
int main() {     
    int a = 1;     
    int b = 1;     
    Modify(a, &b);   // a 按值传递, b 按引用传递,                         
    // a 未变化, b 改变了      
    return(0); 
}

这里我们可以看到:

  • a => p按值传递时,修改形参p的值并不影响实参a,p只是a的副本。

  • b => q是按引用传递,修改形参q的值时也影响到了实参b的值。

探究JS值的传递方式

JS的基本类型,是按值传递的。

var a = 1; 
function foo(x) {     
    x = 2; 
} 
foo(a); 
console.log(a); // 仍为1, 未受x = 2赋值所影响

再来看对象:

var obj = {x : 1}; 
function foo(o) {     
    o.x = 3; 
} 
foo(obj); 
console.log(obj.x); // 3, 被修改了!

说明o和obj是同一个对象,o不是obj的副本。所以不是按值传递。 但这样是否说明JS的对象是按引用传递的呢?我们再看下面的例子:

var obj = {x : 1}; 
function foo(o) {     
    o = 100; 
} foo(obj); 
console.log(obj.x); // 仍然是1, obj并未被修改为100.

如果是按引用传递,修改形参o的,应该影响到实参才对。但这里修改o的值并未影响obj。 因此JS中的对象并不是按引用传递。那么究竟对象的值在JS中如何传递的呢?

按共享传递 call by sharing

准确的说,JS中的基本类型按值传递,对象类型按共享传递的(call by sharing,也叫按对象传递、按对象共享传递)。最早由Barbara Liskov. 在1974年的GLU语言中提出。该求值策略被用于Python、Java、Ruby、JS等多种语言。

该策略的重点是:调用函数传参时,函数接受对象实参引用的副本(既不是按值传递的对象副本,也不是按引用传递的隐式引用)。 它和按引用传递的不同在于:在共享传递中对函数形参的赋值,不会影响实参的值。如下面例子中,不可以通过修改形参o的值,来修改obj的值。

var obj = {x : 1}; 
function foo(o) {     
    o = 100; 
} 
foo(obj); 
console.log(obj.x); // 仍然是1, obj并未被修改为100.

然而,虽然引用是副本,引用的对象是相同的。它们共享相同的对象,所以修改形参对象的属性值,也会影响到实参的属性值。

var obj = {x : 1}; 
function foo(o) {     
    o.x = 3; 
} foo(obj); 
console.log(obj.x); // 3, 被修改了!

对于对象类型,由于对象是可变(mutable)的,修改对象本身会影响到共享这个对象的引用和引用副本。而对于基本类型,由于它们都是不可变的(immutable),按共享传递与按值传递(call by value)没有任何区别,所以说JS基本类型既符合按值传递,也符合按共享传递。

var a = 1; // 1是number类型,不可变 var b = a; b = 6;

据按共享传递的求值策略,a和b是两个不同的引用(b是a的引用副本),但引用相同的值。由于这里的基本类型数字1不可变,所以这里说按值传递、按共享传递没有任何区别。

基本类型的不可变(immutable)性质

基本类型是不可变的(immutable),只有对象是可变的(mutable). 例如数字值100, 布尔值true, false,修改这些值(例如把1变成3, 把true变成100)并没有什么意义。比较容易误解的,是JS中的string。有时我们会尝试“改变”字符串的内容,但在JS中,任何看似对string值的”修改”操作,实际都是创建新的string值。

var str = "abc"; 
str[0]; // "a" 
str[0] = "d"; 
str; // 仍然是"abc";赋值是无效的。没有任何办法修改字符串的内容

而对象就不一样了,对象是可变的。

var obj = {x : 1}; 
obj.x = 100; 
var o = obj; 
o.x = 1; 
obj.x; // 1, 被修改 o = true; obj.x; // 1, 不会因o = true改变

这里定义变量obj,值是object,然后设置obj.x属性的值为100。而后定义另一个变量o,值仍然是这个object对象,此时obj和o两个变量的值指向同一个对象(共享同一个对象的引用)。所以修改对象的内容,对obj和o都有影响。但对象并非按引用传递,通过o = true修改了o的值,不会影响obj。

术语的不同版本

需要注意的是,求值策略中的“引用”和求值策略本身都是抽象概念,这里的引用和语言具体的引用(例如C++的&a, C#的ref参数)可以不同,请不要混淆。

由于JS在传递对象类型的值时,是按值传递引用的副本,参考Dmitry的博文(链接)目前,对JS的求值策略有两种解释:

  • JS采取的都是”按值传递”的求值策略, 其中对象类型较为特殊,实际为按值传递了引用(即传递引用的副本,而不是按引用传递引用)。从这个角度,说对象也是按值传递也是有道理的。(虽然笔者不是十分赞同).

  • 引入“按共享传递”的求值策略,它让我们精确的区分按共享传递与经典的按值传递、按引用传递的不同。在这种情形下,可以按传参类型区分:“基本类型按值传递、而对象按共享传递。”(笔者更倾向的描述方式)

结论

虽然关于JS的求值策略有诸多争议和不同版本,博主比较倾向的结论是:

“JS中基本类型是按值传递的,对象类型是按共享传递的。”


© 著作权归作者所有

共有 人打赏支持
武文海
粉丝 13
博文 95
码字总数 49318
作品 0
成都
高级程序员
JS 底蕴之 变量、作用域和垃圾回收

基本类型和引用类型 在 JavaScript 中,数据类型可分为基本类型和引用类型, 基本类型有六种:Null,Undefined,String,Boolean,Number,Symbol; 而引用类型就是传说中的 Object 了。 其中...

Fly_001 ⋅ 05/23 ⋅ 0

Unity网页数据交互基本原理

1. u3d是一个3D游戏引擎由于和编辑器集成在一起 所以也可以理解为一个制作/开发平台 2. u3d使用javascript C#作为核心脚本语言 来驱动整个游戏引擎 3. 平台可以发布为Exe执行文件或者打包为供...

qq_30279553 ⋅ 04/22 ⋅ 0

【译】为什么需要在 React 类组件中为事件处理程序绑定 this

原文地址:This is why we need to bind event handlers in Class Components in React 原文作者:Saurabh Misra 译文出自:掘金翻译计划 本文永久链接:github.com/xitu/gold-m… 译者:whu...

whuzxq ⋅ 05/15 ⋅ 0

React Native 与原生模块数据通信(一)(iOS)

(一)iOS日历模块封装演示 下面开始演示如何封装一个iOS日历原生模块,让JavaScript可以进行访问到iOS平台日历的功能。 在React Native中,原生模块就是一个Objective-C类,该实现了RCTBridge...

manofit ⋅ 05/24 ⋅ 0

Java的==、equals和JavaScript的===、==比较

之前QQ群里有人问过这样一个问题——Java中有===吗,我想了想,没有,会问这个问题,那他肯定学过JavaScript,毕竟===就是JavaScript里面的,于是,我说——Java中的==就相当于JavaScript中的...

Mthinkway ⋅ 2017/11/12 ⋅ 0

37个JavaScript基本面试问题和解答

编者按:本文转载自众成翻译,译者xiaosheng222,一起来学习吧。 1、使用typeof bar ===“object”来确定bar是否是一个对象时有什么潜在的缺陷?这个陷阱如何避免? 尽管typeof bar ===“obj...

奇舞周刊 ⋅ 05/10 ⋅ 0

15个必备的javascript小技巧,看的懂是入门,全会写就是大神

1、变量转换 看起来很简单,但据我所看到的,使用构造函数,像Array()或者Number()来进行变量转换是常用的做法。始终使用原始数据类型(有时也称为字面量)来转换变量,这种没有任何额外的影...

急速奔跑中的蜗牛 ⋅ 06/06 ⋅ 0

JS实现HTML静态页传值的方法

JS实现HTML静态页传值的方法 作者:前端开发-武方博 发布:2012-10-29 分类:javascript 阅读:8,735次 此处使用JS方式实现静态页之间值传递,其实很简单,废话不多说,见代码,先看index.h...

thinkyoung ⋅ 2015/06/01 ⋅ 0

将一个前端项目改写为chromo插件(一)

编写第一个chrome插件? 编写chrome插件完全就是前端知识加上一些专门的知识。 假设文件夹下有文件 嗯,现在看来他只是普通的html,其实,你只要在当前文件夹下加上文件,chrome浏览器就可以把...

saltfish666 ⋅ 05/27 ⋅ 0

Lynx技术分析-JS引擎扩展设计

JS Binding 技术 Lynx(一个高效的跨平台框架) 的 JS Binding 技术最主要的目的是搭建一个高效的与 JS 引擎解耦的通信桥梁,同时具备 JS 引擎切换的能力。该技术经历了多次迭代,最终通过抽...

hxxft ⋅ 05/15 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

聊聊spring cloud的RequestRateLimiterGatewayFilter

序 本文主要研究一下spring cloud的RequestRateLimiterGatewayFilter GatewayAutoConfiguration @Configuration@ConditionalOnProperty(name = "spring.cloud.gateway.enabled", matchIfMi......

go4it ⋅ 46分钟前 ⋅ 0

Spring JavaConfig 注解

JavaConfig注解允许开发者将Bean的定义和配置放在Java类中。它是除使用XML文件定义和配置Bean外的另一种方案。 配置: 如一个Bean如果在XML文件可以这样配置: <bean id="helloBean" class="...

霍淇滨 ⋅ 54分钟前 ⋅ 0

Spring clound 组件

Spring Cloud技术应用从场景上可以分为两大类:润物无声类和独挑大梁类。 润物无声,融合在每个微服务中、依赖其它组件并为其提供服务。 Ribbon,客户端负载均衡,特性有区域亲和、重试机制。...

英雄有梦没死就别停 ⋅ 55分钟前 ⋅ 0

Confluence 6 重新获得站点备份文件

Confluence 将会创建备份,同时压缩 XML 文件后存储熬你的 <home-directory>/backups> 目录中。你需要自己访问你安装的 Confluence 服务器,并且从服务器上获得这个文件。 运行从 Confluence...

honeymose ⋅ 今天 ⋅ 0

informix的常用SQL语句

1、创建数据库 eg1. 创建不记录日志的库testdb,参考语句如下: CREATE DATABASE testdb; eg2. 创建带缓冲式的记录日志的数据库testdb(SQL语句不一定在事务之中,拥有者名字不被用于对象的解...

wangxuwei ⋅ 今天 ⋅ 0

matplotlib画图

最简单的入门是从类 MATLAB API 开始,它被设计成兼容 MATLAB 绘图函数。 from pylab import *from numpy import *x = linspace(0, 5, 10)y = x ** 2figure()plot(x, y, 'r')...

Dr_hu ⋅ 今天 ⋅ 0

RabbitMQ学习以及与Spring的集成(三)

本文介绍RabbitMQ与Spring的简单集成以及消息的发送和接收。 在RabbitMQ的Spring配置文件中,首先需要增加命名空间。 xmlns:rabbit="http://www.springframework.org/schema/rabbit" 其次是模...

onedotdot ⋅ 今天 ⋅ 0

JAVA实现仿微信红包分配规则

最近过年发红包拜年成为一种新的潮流,作为程序猿对算法的好奇远远要大于对红包的好奇,这里介绍一种自己想到的一种随机红包分配策略,还请大家多多指教。 算法介绍 一、红包金额限制 对于微...

小致dad ⋅ 今天 ⋅ 0

Python 数电表格格式化 xlutils xlwt xlrd的使用

需要安装 xlutils xlwt xlrd 格式化前 格式化后 代码 先copy读取的表格,然后按照一定的规则修改,将昵称中的学号提取出来替换昵称即可 from xlrd import open_workbookfrom xlutils.copy ...

阿豪boy ⋅ 今天 ⋅ 0

面试题:使用rand5()生成rand7()

前言 读研究生这3 年,思维与本科相比变化挺大的,这几年除了看论文、设计方案,更重要的是学会注重先思考、再实现,感觉更加成熟吧,不再像个小P孩,人年轻时总会心高气傲。有1 道面试题:给...

初雪之音 ⋅ 今天 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部