JS 连等赋值操作

偶然看到s的一道题,嗯…又进去了~
不过,不踩坑你就不知道自己遗漏了什么知识

直接看题:

var l = m = 10;  
(function(){
    
  var l=m=20;  
})();
console.log(l);  
console.log(m); 

关于js的连等操作符,是从右往左执行的,每次连等操作符的执行都可能会伴随产生一个全局变量.

以上代码可以解析为:

var l = m ;
m = 10;  // m是个全局变量,而不是用var定义的局部变量
(function(){
    
    m=20;   // 这里修改的是全局变量m的值
  var l=m;  // 这里是在function的作用域内声明了l的变量并赋值(无法修改在function作用域外的l的值)
})();
console.log(l);  // 10
console.log(m);  // 20

那如果赋值的是个对象呢?

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

第三行代码 涉及到一个运算符优先级的问题,".“的优先级>”="的优先级,
所以a.x = a={n:2},先执行的是a.x,此时a={n:1,x:undefined},b={n:1,x:undefined};再来看赋值运算符,从右往左执行,所以这段代码a重新被赋值给了一个对象,此时a={n:2},执向了另一个对象的引用地址,但在a被重新赋值之前,a.x已经执行完成了,所以这会a,b的值分别为:a={n:2},b={n:1,x:{n:2}};a,b指向了两个不同的对象内存地址.

所以上述代码打印结果为:undefied,{n:2}

再来个练习的:

var c=d=e={
    };   
c.val = 1;   
d.val = 2; 
console.log(c.val); 
console.log(d.val);  
console.log(e.val);

还是解析一下上面代码:

var c=d=e={
    };  // e = {}, d = e , c = d 
c.val = 1;   
d.val = 2; 
console.log(c.val);  // 2 把d赋值给c,c跟d引用的都是同一个对象地址,所以后面那行d.val = 2 这个代码也直接修改了c对象里面val的值 
console.log(d.val);  // 2 d跟e引用的都是同一个对象地址.所以d对象发生了改变,e也会跟着发生改变.
console.log(e.val);  // 2

对于连等赋值操作,记住两点:
1.从右到左执行,
2.对引用类型的赋值要注意.对于对象,赋值操作指向的可能是对同一个对象地址的引用,后者发生改变导致前者也会发生改变.