js连续赋值和引用指针的工作方式

1var  a = {n:1};

2var    b =a;

3a.x = a = {n:2};

4console.log(a.x);//undefined

5console.log(b.x);// [object,objcct]

上面这个例子看似简单,但运行后的结果却很绕人,a.x的结果让人甚为疑惑。

现在我们可以来分析下这段代码具体是如何运行的。为了方便理解,我这里会以图文的形式来说明

var  a = {n:1};

var   b = a;


接着是这句比较复杂的连续赋值操作的代码

#a.x = a = {n:2};

很多人可能以为这个连续赋值操作等价于

a = {n:2};

a.x= a;

其实不然。 js代码从左到右的执行顺序没有问题。只是赋值表达式是 “=”右边赋值给左边

首先执行针对a.x的赋值操作,而a.x的右边也是一个赋值表达式 a = {n :2}。 而赋值表达式是有返回值的(表达式左边对应的值)

所以我们可以这样理解  a.x =  [expression]   ,而这个[expression] 为 a = {n:2}

因为对象a上不存在‘x’属性,所以对a.x赋值的时候会这个对象扩展一个‘x’属性  (属性扩展或取值操作在编译器内部有着相对复杂的操作,这里暂时不做深入)

然后执行a= {n:2},这里相当于新创建了一个对象,然后把a重新指向这个对象,在内存中的操作如下图所示



执行完a.x右边的表达式后,结果也出现了, x属性指向的是{n:2}这个对象





所以这里我们就明白为何b.x为对象,a.x为undefined。

以上为个人理解,如有不正确的地方欢迎指正。

我们也可以把最后一句连续赋值代码改为

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

第一次接触这么深得接触js ,这次就到这里:

转自:http://www.cnblogs.com/saxibuni/articles/6397473.html

你可能感兴趣的:(js连续赋值和引用指针的工作方式)