javascript 连等赋值问题(这是从SegmentFault转过来的一个问题)
var a = {n:1};
var b = a; // 持有a,以回查
a.x = a = {n:2};
alert(a.x);// --> undefined
alert(b.x);// --> {n:2}
对于这段代码,大部分人的理解是这样的:========错误的理解=======
对于 a.x = a = {n:2}
,大部分人的思路应该是:
- 先把
{n:2}
赋值给 a - 然后再创建 a.x,将
{n:2}
再赋值给 a.x
这样似乎确实说不通 a.x 的值是 undefined,因为 a.x 确实是被赋值了的啊。
可是事实上,a.x 的值却是 undefined。
再来看一下这个: a = a.x = {n:2}
的话,按原先的思路应该是:
- 先把
{n:2}
赋值给 a.x,那么也就相当于b.x = {n:2}
啦 - 再把 a 重新指向
{n:2}
。那么这是后 a.x 的值确实是 undefined,a 对象{n:2}
中就没有 x 属性嘛。
按这个思路,上述两种方式的结果应该是不同的。但事实却是a = a.x = {n:2}
和a.x = a = {n:2}
的结果是一致的。所以很明显这个思路不对。
===========================正确的理解是这样的===================
解析器在接受到 a = a.x = {n:2}
这样的语句后,会这样做:
- 找到 a 和 a.x 的指针。如果已有指针,那么不改变它。如果没有指针,即那个变量还没被申明,那么就创建它,指向 null。
a 是有指针的,指向{n:1}
;a.x 是没有指针的,所以创建它,指向 null。 - 然后把上面找到的指针,都指向最右侧赋的那个值,即
{n:2}
。
所以执行以后,就有了如下的变量关系图。大家可以慢慢体会下,想通了就很简单的。
如果大家觉得这种理解比较难,可以先按下面一种方式理解,等理解了再过来看看上面的解释
赋值是从右到左的,但不要被绕晕了, 其实很简单,从运算符优先级
来考虑
a.x = a = {n:2};
.
运算优先于=
赋值运算,因此此处赋值可理解为
- 声明a对象中的x属性,用于赋值,此时b指向a,同时拥有未赋值的x属性
- 对a对象赋值,此时变量名a改变指向到对象{n:2}
- 对步骤1中x属性,也即a原指向对象的x属性,也即b指向对象的x属性赋值
赋值结果:
a => {n: 2}
b => {n: 1, x: {n: 2 } }
javascript 连等赋值问题(这是从SegmentFault转过来的一个问题)的更多相关文章
- ajax实现给JavaScript中全局变量赋值(转)
原文地址:ajax实现给JavaScript中全局变量赋值 问题简化: <script type="text/javascript"> var a=1 ; functi ...
- JavaScript解构赋值
JavaScript解构赋值 JavaScript解构赋值为我们提供了很多方便,但是用法比较多,本文就来梳理一下.总体来说,主要就两种地方使用解构赋值,一种是数组的解构赋值,另一种是对象的解构赋值.以 ...
- javascript对象引用与赋值
avascript对象引用与赋值 <script type="text/javascript"> //例子一: 引用 var myArrayRef = new Arra ...
- JavaScript连等赋值
最近探究js原理的过程中遇到了这个挺有趣的问题. 先贴代码: var a = {n:1} a.x = a = {n:2} alert(a.x) //undefined 在弄懂这个之前,我们先普及一个知 ...
- javascript给输入框赋值的一个误区
一. 错误的示范 如下代码所示,如果需要用javascript获取id为username1, password1的输入框的值,将其写入id为username2, password2的输入框,那么红线区 ...
- JavaScript的算数,赋值,比较和逻辑运算符
类似a=1+1这样的表达式称为运算符,js的运算符分为算数,赋值,比较和逻辑运算符:常见的算数有:+ - * / %(加减乘除,取模),比方说5/4=4*1+1:5%4=1,js算数顺序:从左往右,先 ...
- JavaScript对象属性赋值操作的逻辑
对象进行属性赋值操作时,其执行逻辑如下所示: 1. 当前对象中是否有该属性?有,进行赋值操作:没有,进行下一步判断. 2. 对象的原型链中是否有该属性?没有,在当前对象上创建该属性,并赋值:有,进行下 ...
- javascript 连等赋值问题
var a = {n:1}; var b = a; // 持有a,以回查 a.x = a = {n:2}; alert(a.x);// --> undefined alert(b.x);// - ...
- JavaScript 将多个引用(样式或者脚本)放入一个文件进行引用
1.将样式放入一个文件进行引用 @import url("../media/css/bootstrap.min.css"); @import url("../media/ ...
随机推荐
- groups, usermod, chown, chgrp, chmod
Linux文件权限简介 Linux的每个文件可以由三种用户访问 属主权限:创建人的权限 属组权限:与创建同一个用户组的权限 其他权限:和创建人不在同一个用户组的用户的权限 当然,root用户拥有最高权 ...
- Linux vim编辑命令
yum install -y vim-enhanced 安装vim 命令 一般模式 shift 4 行尾 shift 6 或 0行首 gg 顶部 G 下部 复制 yy 剪切几行 数字 dd p粘贴 ...
- 使用Fiddler对Android或者iOS设备进行抓包
1.PC端Fiddler配置 Tools->HTTPS->选中“Decrpt HTTPS traffic”,“Ignore server certificate errors” Tools ...
- 组合使用css选择器
今天看到有网站使用.classA.classB类似的选择器,不知道是否有人和我一样没有用过,所以了解一下,以下记录. 一.用法介绍 在css中.classA.classB指的是一个元素,同时满足cla ...
- [转]NopCommerce之旅: 应用启动
本文转自:http://www.cnblogs.com/devilsky/p/5359881.html 我的NopCommerce之旅(6): 应用启动 一.基础介绍 Global.asax 文件 ...
- [转]Ionic系列——CodePen上的优秀Ionic_Demo
本文转自:http://my.oschina.net/u/1416844/blog/514361?fromerr=bbFC5JIl 案例网站 Slidebox with Dynamic Slides ...
- laravel administrator 一款通用的后台插件(PHP框架扩展)
前几天我看了一下zend framework 2的一些官方文档,也找了一些例子,可惜所有的资料少之甚少.于是我就开始去找这国外用的比较流行的PHP框架laravel,希望能够找到其合适的例子,而且我本 ...
- C#中Abstract和Virtual
C#中Abstract和Virtual 在C#的学习中,容易混淆virtual方法和abstract方法的使用,现在来讨论一下二者的区别.二者都牵涉到在派生类中与override的配合使用. 一.Vi ...
- HTML5 WebSocket 技术介绍
WebSocket是html5规范新引入的功能,用于解决浏览器与后台服务器双向通讯的问题,使用WebSocket技术,后台可以随时向前端推送消息,以保证前后台状态统一,在传统的无状态HTTP协议中,这 ...
- python黑客编程之端口爆破
#coding:utf-8 from optparse import OptionParser import time,re,sys,threading,Queue import ftplib,soc ...