var a = {n: 1};
var b = a;
a.x = a = {n: 2}; console.log(a.x);
console.log(b.x);
有道题是这样的,觉得很奇葩,分析一下

1.对象 引用类型

对象属于引用类型,c,java,js里面都是的,对象就是引用类型,包括数组。

上面的a是引用类型,a保存的是对象 {n: 1}的地址,对这个对象的引用。b = a 。把a里面的地址赋值给了b,b也指向{n: 1}这个对象的物理地址。所以,a 一旦做赋值更改,修改的是a对引用的修改。b也同时修改,b修改的时候,a也会被修改。这就是引用类型。

堆和栈。堆是真实的{n:1} 。栈里面存放的是堆的物理地址,值比较小。根据栈的地址去找堆里面的数据。

2.

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

  第二个奇葩结果

3.

https://blog.csdn.net/qiphon3650/article/details/78860973

我把这篇看了,然后觉得还是不理解

就这句: 执行a.x=a,此时a已经指向了新对象,而a.x因为在执行前保留了原引用。

不理解的点是 a都已经改变指向了,a指向了{n: 2},a.x里面的a的指向当然也改变成了{n: 2},为什么,a.x还会保留原引用

4.我又看了别人写的,觉得这样比较好绕回来

a.x的运算优先级最高

也就是说

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

这段代码可以写成这样

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

  

这样就解释通了

1.a指向 {n: 1};   ---> var a = {n: 1};

2.b指向 a指向的这个 {n: 1}  ---> var b = a;

  3.计算 a.x = (a = {n: 2});    a.x的值是 后面值的结果,后面的值先不管。此时 a.x = (某个值),是先计算的。a.x 这个a 指向并没有被         改变

  所以. a.x 里面的a仍然是原来的 {n: 1};a.x里面的值是后面( a = {n: 2})这个结果的返回值。这个返回值是 {n: 2};

4.所以拆分成a.x = { n: 2 }; 然后原来的a的值被 a = {n: 2},b是对原来对象的引用; a 最后赋值的结果是a = {n: 2};

所以。a.x是underfined,因为新的a里面并没有 x这个属性

所以我觉得这个赋值运算的结果,a = {n: 2}这个a并没有更改引用的时候,它的返回值就已经确定了,就先赋值给原来的a.x里面的a了。我只是猜想。。。连等式可能并不会去计算过程,其中所有的值都直接被最后一个等号的值给赋值,其中,引用类型的赋值. 会优先赋值计算。

这个图表示最后的结果,并不能表示赋值过程。

js对象等号赋值的bug的更多相关文章

  1. js对象结构赋值const {XXX } =this

    样例1: const { xxx } = this.state; 上面的写法是es6的写法,其实就相当于: const xxx = this.state.xxx 样例2: const {comment ...

  2. js对象动态赋值

    <view class="movies-template"> <template is="movieListTemplate" data=&q ...

  3. jquery实现点击展开列表同时隐藏其他列表 js 对象操作 对象原型操作 把一个对象A赋值给另一个对象B 并且对象B 修改 不会影响 A对象

    这篇文章主要介绍了jquery实现点击展开列表同时隐藏其他列表的方法,涉及jquery鼠标事件及节点的遍历与属性操作技巧,具有一定参考借鉴价值,需要的朋友可以参考下 本文实例讲述了jquery实现点击 ...

  4. js对象的直接赋值、浅拷贝与深拷贝

    最近Vue项目中写到一个业务,就是需要把对话框的表单中的数据,每次点击提交之后,就存进一个el-table表格中,待多次需要的表单数据都提交进表格之后,再将这个表格提交,实现多个表单数据的同时提交,期 ...

  5. js 对象操作 对象原型操作 把一个对象A赋值给另一个对象B 并且对象B 修改 不会影响 A对象

    我最近在做一个vue + element-UI + vue-resource + vuex项目的时候,遇到了一个对象的问题. 当我们在项目需要 复制一个对象到另一个对象并且  被复制的对象不能受复制后 ...

  6. JS连等赋值的坑

    cnblogs标题: JS连等赋值的坑 关于JS连等赋值有个经典的笔试题: var a = {n: 1}; var b = a; a.x = a = {n: 2}; console.log(a.x); ...

  7. JS对象继承篇

    JS对象继承篇 ECMAScript只支持实现继承,而且其实现继承主要是依靠原型链来实现的 原型链 其基本思路是利用原型让一个引用类型继承另一个引用类型的属性和方法 function Person() ...

  8. JS 对象封装的常用方式

    JS是一门面向对象语言,其对象是用prototype属性来模拟的,下面,来看看如何封装JS对象. 常规封装 function Person (name,age,sex){ this.name = na ...

  9. js 对象深复制,创建对象和继承

    js 对象深复制,创建对象和继承.主要参考高级编程第三版,总结网上部分资料和自己的代码测试心得.每走一小步,就做一个小结. 1.对象/数组深复制 一般的=号传递的都是对象/数组的引用,如在控制台输入 ...

随机推荐

  1. Vue - 引入本地图片的两种方式

    第一种,只引入单个图片,这种引入方法在异步中引入则会报错. 比如需要遍历出很多图片展示时 <image :src = require('图片的路径') /> 第二种,可引入多个图片,也可引 ...

  2. SIM800L AT command

    /*********************************************************** AT+ICF==<format> ,<parity> ...

  3. 30 整数中1出现的次数(从1到n整数中1出现的次数)这题很难要多看*

    题目描述 求出1~13的整数中1出现的次数,并算出100~1300的整数中1出现的次数?为此他特别数了一下1~13中包含1的数字有1.10.11.12.13因此共出现6次,但是对于后面问题他就没辙了. ...

  4. Python 绘图

    python绘图库有很多,底层的就是matplotlib,另外还有基于matplotlib的更方便,代码可读性更强的库,比如seaborn.plotnine等.各个库之间的对比: https://ww ...

  5. 嵊州普及Day5T4

    题意:两个1,每次可将一个*k,一个*K2,n个问题,问能否达成x,y? 思路:只有将x,y相乘为3次方时,才可能.并且相乘的三次方一定要是x,y的因子. 下面证明:3次方易证,因为对每个k,都会乘三 ...

  6. 1-2SpringBoot项目属性配置

    前面我们讲解了SpringBoot HelloWorld实现 今天具体来讲解上那个application.properties项目配置文件 打开是空白 里面可以配置项目,所以配置项目我们 alt+/ ...

  7. 有时间会做系列一(Dice)

    题目大意:给n个骰子的每面安排点数,第i个骰子有a[i]面,a[i]和为m,点数范围从1到m,不重复.问怎么安排掷骰子的点数和的期望最大.输出期望和每个骰子的点数(按骰子输入顺序). 思路: EX=x ...

  8. 修改Centos7的yum源

    以下为修改Centos7的yum源: 1. 备份原镜像文件,便于后期恢复 [root@keepmydream ~]# mv /etc/yum.repos.d/CentOS-Base.repo /etc ...

  9. Lesson 3 Matterhorn man

    What was the main objective of early mountain climbers? Morden alpinists try to climb mountains by a ...

  10. Python学习笔记之基础篇(-)python介绍与安装

    Python学习笔记之基础篇(-)初识python Python的理念:崇尚优美.清晰.简单,是一个优秀并广泛使用的语言. python的历史: 1989年,为了打发圣诞节假期,作者Guido开始写P ...