连等的思考

栏目: JavaScript · 发布时间: 5年前

内容简介:年前写了一篇博客,立了一个flag说是以后一个星期写一篇博客,但被年前的997和过年给耽误了,算了一下一共欠了四篇博客,后续会补上从18年到这篇博客之前都是在简书上写,当然写的都是一些浅显一点的东西,也获得了几十个粉丝和不少赞(惭愧),写的都是一些工具的使用,经过了一年的磨练决定以后写一点稍微深入一点的东西,或者是更原理一些的东西,望共勉昨天水群的时候看到有人发了一道很有意思的面试题,看起来简单,但是答错的人倒是占了十之八九,还有一些人可能是之前看过类似的题,但是解释的也是差强人意,所以就自己研究了一番

年前写了一篇博客,立了一个flag说是以后一个星期写一篇博客,但被年前的997和过年给耽误了,算了一下一共欠了四篇博客,后续会补上

从18年到这篇博客之前都是在简书上写,当然写的都是一些浅显一点的东西,也获得了几十个粉丝和不少赞(惭愧),写的都是一些 工具 的使用,经过了一年的磨练决定以后写一点稍微深入一点的东西,或者是更原理一些的东西,望共勉

昨天水群的时候看到有人发了一道很有意思的面试题,看起来简单,但是答错的人倒是占了十之八九,还有一些人可能是之前看过类似的题,但是解释的也是差强人意,所以就自己研究了一番

题目是这样的

var obj = {n:1}
  var newObj = obj
  obj.m = obj = {n:2}
  console.log(obj)
  console.log(newObj)
复制代码

题目就这么长,答案是 obj = {n: 2}, newObj = {n: 1, m: {n:2}}

小伙伴们答对了吗?

其实最主要的就是那段连等赋值的代码,在分析这段代码之前我们先看一个简单的连等代码

let obj;
let obj1 = obj = {name: 'zhangsan'}
复制代码

思考一下这个赋值操作时怎么进行的

是这样的???

拆分1

let obj1 = {name: 'zhangsan']
    obj = {name: 'zhangsan'}
复制代码

还是这样的?

拆分2

obj = {name: 'zhangsan'}
let obj1 = obj
复制代码

上面两段代码的拆分,第一个是两个对象分别指向不同的内存地址,第二个是指向同一个内存地址

那我们来验证一下,看修改其中一个的值另一个会不会改变

let obj;
let obj1 = obj = {name: 'zhangsan'}

//测试改值
obj.name = 'lisi'
console.log(obj1.name) // 'lisi'
复制代码

看来好像是指向同一块地址的,难道是拆分2这样的???

带着这个疑问继续看我们的面试题,拆分一下

var obj = {n:1}
  var newObj = obj
  obj = {n:2}
  obj.m = obj
  console.log(obj)    //{n:2,m:{n:2,m: {...}}}
  console.log(newObj) //{n: 1}
复制代码

拆分之后输出的结果和不拆分的时候结果是不一样的

以上的测试得出这篇文章的第一个结论:

连等代码是不可拆分的

接下来继续分析面试题,看看这段代码到底做了什么

obj.m = obj = {n:2}
复制代码

我们都知道赋值是从右向左赋值的

所以上面的代码 相当于下面的三步

赋值操作之前编译器就已经读取到了变量和它的属性m,然后编译器会在作用域中查找对象是否有m属性,没有的话就会生成m属性

赋值之前读取当obj还有m属性,所以把他添加到内存里面,因为需要等待右边赋值完成所以暂时指定为null

连等的思考

从右侧开始赋值,即执行obj = {n: 2}, '=' 赋值就相当于new Object()的语法糖所以新创建了一块内存空间

连等的思考

赋值到左侧的时候m的属性值指向了obj的新内存地址

连等的思考

这个时候我们在测试一下

var obj = {n:1}
  var newObj = obj
  obj.m = obj = {n:2}
  //改变n的值
  obj.n = 100
  console.log(obj)     //{n: 100}
  console.log(newObj)  //{n: 1,m: {n: 100}}
复制代码

看来上述的三步猜想是成立的

大家有更好的解释吗,欢迎留言评论


以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

数学世纪

数学世纪

皮耶尔乔治·奥迪弗雷迪 / 胡作玄、胡俊美、于金青 / 上海科学技术出版社 / 2012-1 / 28.00元

《数学世纪:过去100年间30个重大问题》以简短可读的方式论述了整个20世纪的数学。20世纪的数学博大精深,新兴领域及学科的建立发展,许多经典问题得到解决,大量新的有意义的问题的引入,为数学带来了活力。《数学世纪:过去100年间30个重大问题》介绍了数学基础,20世纪的纯粹数学、应用和计算数学,以及目前未解的重要问题,中间穿插了希尔伯特的23个问题的解决情况、菲尔兹奖和沃尔夫奖得主的工作成就等。一起来看看 《数学世纪》 这本书的介绍吧!

MD5 加密
MD5 加密

MD5 加密工具

Markdown 在线编辑器
Markdown 在线编辑器

Markdown 在线编辑器

HEX CMYK 转换工具
HEX CMYK 转换工具

HEX CMYK 互转工具