前几天看到一个javascript 连续赋值的问题,运行了一下,结果出乎意料,发现这里的水真的有点深啊,连续赋值的底层机制,没有一本前端书籍有详细介绍的,自己做实验研究了一下,先来看结果:

var a = {n: 1}
var b = a;
a.x = a = {n: 2}
console.log("a.x:",a.x); //undefined
console.log("b.x:",b.x) //{n:2}

运行结果:

a.x: undefined

b.x: Object {n: 2}

a.x居然是undefined,没搞错吧,根据我印象中的连续赋值原理,执行顺序是从右向左执行,a.x = a = {n: 2} ,相当于依次执行了(1) a={n:2}, (2) a.x=a 这两行代码,那么a.x应该是递归引用到a本身的,形成一棵子节点无限引用自身的子树,但是我猜中了开头却没猜中结局,我的世界观开始崩塌,先来验证一下连续赋值是否是从右向左的吧。

var a={};
Object.defineProperty(a,"x",{
get:function(){console.log("get a.x");return this._x;},
set:function(v){console.log("set a.x:"+v);this._x=v;return this._x}
})

var b={};
Object.defineProperty(b,"x",{
get:function(){console.log("get b.x");return this._x;},
set:function(v){console.log("set b.x:"+v);this._x=v;return this._x}
})

a.x=b.x="hello,world";

运行结果是

set b.x:hello,world
set a.x:hello,world

说明了两件事:

1)赋值顺序是从右向左

2)执行了b.x="hello,world",a.x="hello,world",   a.x的值并没有从b.x获取,因为get属性存取器并没有执行。

那么问题来了,a.x = a = {n: 2} ,等价的运行结果是a={n:2}, a.x={n:2}   ,a.x应该有值才对,现在运行的结果是b有值,说明这两行代码虽然是有先后执行顺序,但实际上是相互隔离的。当执行a.x={n:2} 时,a的引用仍然指向旧的对象(即变量b指向的对象),所以b.x有值了。

javascript 连续赋值(连等运算)问题研究的更多相关文章

  1. javascript的变态位运算

    javascript的变态位运算 var a = "10" | 0; alert(a); alert (typeof a);结果为10,number. 这就是说这条语句可以将字符串 ...

  2. 奇特的JavaScript连续赋值运算

    一.引子: }; a.x = a = {n:}; alert(a.x); // --> undefined 以上第二句 a.x = a = {n:2} 是一个连续赋值表达式.这个连续赋值表达式在 ...

  3. (转)深入理解javascript连续赋值表达式

    引入 今天逛园子的时候看到一道javascript面试题,是关于连续赋值的,正好最近读jQuery源码经常看到这种连续赋值的表达式,所以很感兴趣. 废话不多说,来看题: var a = {n: 1} ...

  4. javascript中的浮点数运算

    解释一下下面代码的输出 console.log(0.1 + 0.2); //0.30000000000000004 console.log(0.1 + 0.2 == 0.3); //false Jav ...

  5. javascript 连续赋值(转载)

    先看一个例子   ● var a = {n:1}; ● var b = a; ● a.x = a = {n:2}; ● console.log("a.x: " + a.x); // ...

  6. JavaScript知识点---->运算规则与运算(逻辑、位)

    *在js中不同类型之间的运算,所得到结果的类型也会有所变化: string + number = string string + boolean = string string + undefiend ...

  7. javascript继承(一)—类的属性研究

    本篇文章主要针对javascript的属性进行分析,由于javascript是一种基于对象的语言,本身没有类的概念,所以对于javascript的类的定义有很多名字,例于原型对象,构造函数等,它们都是 ...

  8. JavaScript中的加法运算

    <head runat="server"> <title>JavaScript实现加法计算器</title> <script type=& ...

  9. JavaScript定时机制setTimeout与setInterval研究

    JavaScript的setTimeout与setInterval是两个很容易欺骗别人感情的方法,因为我们开始常常以为调用了就会按既定的方式执行, 我想不少人都深有同感, 例如 setTimeout( ...

随机推荐

  1. Github版本控制系统

    Git是什么? Git是目前世界上最先进的分布式版本控制系统(没有之一). 特别推荐简单易懂的廖雪锋大神制作的学习教程: https://www.liaoxuefeng.com/wiki/896043 ...

  2. springboot中文官方文档

    springboot中文官方文档 https://www.breakyizhan.com/springboot/3028.html spring框架 https://www.breakyizhan.c ...

  3. C++ Primer Plus 6 笔记(2)

    第4章 1.求数组元素个数的一种方法:num=sizeof 数组名/sizeof (元素类型) 2.确定字符串所需的最短数组时,别忘了将结尾的'\0'计算在内.表面可以无,内存必须有. 3.'S'表示 ...

  4. POJ 3259:Wormholes bellman_ford判定负环

    Wormholes Time Limit: 2000MS   Memory Limit: 65536K Total Submissions: 37906   Accepted: 13954 Descr ...

  5. 新闻网大数据实时分析可视化系统项目——21、大数据Web可视化分析系统开发

    1.基于业务需求的WEB系统设计 2.下载Tomcat并创建Web工程并配置相关服务 下载tomcat,解压并启动tomcat服务. 1)新建web app项目 创建好之后的效果 2)对tomcat进 ...

  6. 2-10 就业课(2.0)-oozie:10、伪分布式环境转换为HA集群环境

    hadoop 的基础环境增强 HA模式 HA是为了保证我们的业务 系统 7 *24 的连续的高可用提出来的一种解决办法,现在hadoop当中的主节点,namenode以及resourceManager ...

  7. 智能充电安全管理首选SOC单芯片方案:SI24R2F

    SI24R2F简介:       SI24R2F是一颗工作在2.45GHZ ISM 频段,专为低功耗有源RFID应用场合设计,集成崁入式2.45GHZ 无线射频发射器模块.64次可编程NVM存储器模块 ...

  8. hashCode() 和 equals()的问题解答及重写示范

    本章的内容主要解决下面几个问题: 1 equals() 的作用是什么? 2 equals() 与 == 的区别是什么? 3 hashCode() 的作用是什么? 4 hashCode() 和 equa ...

  9. 使用conda创建虚拟环境

    conda创建python虚拟环境 前言 conda常用的命令: conda list 查看安装了哪些包. conda env list 或 conda info -e 查看当前存在哪些虚拟环境 co ...

  10. jmeter常见错误及解决方法

    jmeter常见错误:   错误一: Response code: Non HTTP response code: java.net.SocketTimeoutException Response m ...