写了10年Javascript未必全了解的连续赋值运算

发布于 09-09 09:08 字数 2658 浏览 11 评论 0

一、引子
  1. var a = {n:1};
  2. a.x = a = {n:2};
  3. alert(a.x); // --> undefined
复制代码以上第二句 a.x = a = {n:2} 是一个连续赋值表达式。这个连续赋值表达式在引擎内部究竟发生了什么?是如何解释的?

二、猜想
猜想1:从左到右赋值,a.x 先赋值为{n:2},但随后 a 赋值为 {n:2},即  a 被重写了,值为 {n:2},新的 a 没有 x属性,因此为undefined。步骤如下



1, a.x = {n:2};
2, a = {n:2};



这种解释得出的结果与实际运行结果一致,貌似是对的。注意猜想1中 a.x 被赋值过。



猜想2:从右到左赋值,a 先赋值为{n:2},a.x 发现 a 被重写后(之前a是{a:1}),a.x = {n:2} 引擎限制a.x赋值,忽略了。步骤如下:



1, a = {n:2};
2, a.x 未被赋值{n:2}



等价于 a.x = (a = {n:2}),即执行了第一步,这样也能解释a.x为undefined了。注意猜想2中a.x压根没被赋值过。



三、证明
上面两种猜想相信多数人都有,群里讨论呆呆认为是猜想1, 我认为是猜想2。其实都错了。我忽略了引用的关系。如下,加一个变量b,指向a。
  1. var a = {n:1};
  2. var b = a; // 持有a,以回查
  3. a.x = a = {n:2};
  4. alert(a.x);// --> undefined
  5. alert(b.x);// --> [object Object]
复制代码发现a.x仍然是undefined,神奇的是 b.x 并未被赋值过(比如:b.x={n:2}),却变成了[object Object]。b 是指向 a({n:1})的,只有a.x = {n:2}执行了才说明b是有x属性的。实际执行过程:从右到左,a 先被赋值为{n:2},随后a.x被赋值{n:2}。



1, a = {n:2};
2, a.x = {n:2};

等价于


a.x = (a = {n:2});



与猜想2的区别在于a.x 被赋值了,猜想2中并未赋值。最重要的区别,第一步 a = {n:2} 的 a 指向的是新的对象{n:2} , 第二步 a.x = {n:2} 中的 a 是 {a:1}。即在这个连等语句
  1. a.x = a = {n:2};
复制代码a.x 中的a指向的是 {n:1},a 指向的是 {n:2}。如下图

www.javaeye.com__1304e9c9-1e99-3cb6-ad70-97a0ef10c5cb.png (17.16 KB, 下载次数: 2)

下载附件

2011-02-27 14:06 上传



四:解惑
这篇写完,或许部分人看完还是晕晕的。因为里面的文字描述实在是绕口。最初我在理解这个连等赋值语句时
  1. var a = {n:1};
  2. a.x = a = {n:2};
复制代码认为引擎会限制a.x的重写(a被重写后),实际却不是这样的。指向的对象已经不同了。引擎也没有限制a.x={n:2}的重写。

五:结束
呵,以另一个连续赋值题结束。fun执行后,这里的 变量 b 溢出到fun外成为了全局变量。想到了吗?
  1. function fun(){
  2.         var a = b = 5;
  3. }
  4. fun();
  5. alert(typeof a); // --> undefined
  6. alert(typeof b); // --> number
复制代码原文http://www.javaeye.com/topic/785445

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文