深入理解js的赋值语句

你的名字 2022-05-20 04:11 184阅读 0赞

var a = {};

a.x = a = 3;

a 的值是什么。

其实当执行赋值语句的时候，js 的 = 左侧不是原始变量地址，而是一个新值。  
怎么理解这句话呢？

来看下ECMA对 = 的定义吧。《[11.13 Assignment Operators][]》  
当然看不懂也没关系，我也是半懂不懂的简单理解了下。

文档中说 LeftHandSideExpression = AssignmentExpression  
中文翻译为：左手边表达式 = 赋值表达式

虽然不知道什么意思，不过很明显，左侧的不是原始地址，应该是一个表达式。

我们来解释下这个吧。

文本运行

var a = {}; a.x = a = 3; console.log(a); // 3

var a = \{\};  这个完全没问题，完全可以理解。。  
那我们来详细解释下  a.x = a = 3;  是怎么回事吧。  
用 左手边表达式 = 赋值表达式 原则套用下，相当于：  
**左手边表达式 = (左手边表达式 = 赋值表达式)**

a.x 不再指向 a.x, 而是属性 x 的一个准备被赋值的表达式。

同样 a = 3 也是指向 a 的表达式而已。

关键是编译的时候在语句中先把引用得到，才去对他进行操作

一般的赋值表达式` A = B`的呢？简单地说，按如下步骤：

1.  计算表达式A，得到一个引用`refA`；
2.  计算表达式B，得到一个值`valueB`；
3.  将`valueB`赋给`refA`指向的名称绑定；
4.  返回`valueB`。

也就是 a 被赋值为 3，原来那个对象的 x 属性被复制为 3。  
其实很容易就可以验证刚才的说法。

文本运行

var a = {}; b = a; a.x = a = 3; console.log(a); // 3 console.log(b); // {x:3}

执行后 a 是 3, 同时 b.x 也是 3

可能前面说的左手边表达式不太容易理解，看下这个例子吧：

文本运行

var obj = {n: 0}; function fn() { return obj; } fn().n = 123; console.log(obj);

这个就很直观了，左手边表达式的意思就是，左侧可以是一个"表达式"，当然不是真正意义上的表达式，你看这里就是调用了一个函数，但是n的值确实变成了 123 。

[原文链接][Link 1]

[好文链接][Link 2]

[11.13 Assignment Operators]: http://www.ecma-international.org/ecma-262/5.1/#sec-11.13
[Link 1]: https://www.cnblogs.com/52cik/archive/2014/07/01/js-assignment-operators.html
[Link 2]: https://segmentfault.com/a/1190000004224719

发表评论取消回复

表情：

评论列表（有 0 条评论，184人围观）

还没有评论，来说两句吧...

相关阅读

相关深入理解Python变量与赋值

ython是一门很特殊的语言,它和C语言不一样,python是"弱类型"的脚本语言,变量在声明的时候并不定义它的类型,而是通过赋值的类型体现出来,所以一般python变量...

傷城~/ 2024年04月17日 06:02/ 0 赞/ 72 阅读

相关赋值语句的运用

public class java6_1 { / @param args / public static voi

太过爱你忘了你带给我的痛/ 2022年09月17日 14:26/ 0 赞/ 188 阅读

相关深入理解 Node.js 的 Inspector

> `Node.js` 提供的 `Inspector` 非常强大，不仅可以用来调试 `Node.js` 代码，还可以实时收集 `Node.js` 进程的 `Heap Snaps

朴灿烈づ我的快乐病毒、/ 2022年09月07日 14:42/ 0 赞/ 193 阅读

相关深入理解 Node.js 的 Inspector

> `Node.js` 提供的 `Inspector` 非常强大，不仅可以用来调试 `Node.js` 代码，还可以实时收集 `Node.js` 进程的 `Heap Snaps

喜欢ヅ旅行/ 2022年09月07日 03:54/ 0 赞/ 209 阅读

相关深入理解js中的return

JavaScript在事件中调用函数时用return返回值实际上是对window.event.returnvalue进行设置，而该值决定了当前操作是否继续。当返回的是

た入场券/ 2022年06月15日 09:39/ 0 赞/ 299 阅读

相关 python 深入理解赋值、引用、拷贝、作用域

转自：http://www.cnblogs.com/jiangzhaowei/p/5740913.html 在 python 中赋值语句总是建立对象的引用值，而不是复制对象。

喜欢ヅ旅行/ 2022年06月14日 01:08/ 0 赞/ 177 阅读

相关深入理解js的赋值语句

var a = {}; a.x = a = 3; a 的值是什么。其实当执行赋值语句的时候，js 的 = 左侧不是原始变量地址，而是一个新值。怎么

你的名字/ 2022年05月20日 04:11/ 0 赞/ 185 阅读

相关 js中src赋值理解

不用Jquery时：document.getElementById("imageId").src = "xxxx.jpg"; 用Jquery时：$("\imageId").

以你之姓@/ 2021年09月27日 18:32/ 0 赞/ 472 阅读

相关深入理解js中的yield

`yield` 关键字用来暂停和恢复一个生成器函数（([`function`][function] 或[遗留的生成器函数][Link 1]）。语法 [rv]

清疚/ 2021年09月19日 04:18/ 0 赞/ 444 阅读

相关深入理解js中的yield

`yield`是什么 `yield`是ES6的新关键字，使生成器函数执行暂停，`yield`关键字后面的表达式的值返回给生成器的调用者。它可以被认为是一个基于生成器

谁借莪１个温暖的怀抱￠/ 2021年06月26日 16:06/ 0 赞/ 567 阅读