前端面试中,JS代码的坑(堆与栈)


前言

两题均来自大厂
若能理解以下重点,可直接做题,不看解析

💡本文重点

1、当一个对象A的属性名为另一个对象B赋值时候会自动将对象B转化字符串[object Object]

A[B]=20  // 实际上运行的是 A['[object Object]']=20;注意这里的第二个Object首字母大写

在这里插入图片描述

2、.的优先级大于=

✍️A.x=A=B的执行过程

  • 先执行A.x=,若A中无x,则将x赋undefined放入A,A.x=一直停留等待赋值。
  • 再执行A=B,A的指向发生改变,但由于A.x已经悬挂起,还是可以赋值,不影响。
  • 将A的值赋给A.x。

🙌题目一

      let a = {n : 1};   
      let b = a;       
      a.x = a = {n: 2};   

      console.log(a.x)    
      console.log(b.x)     
🌟提炼知识点如下:
  • 引用数据类型的数据存放位置地址存放在(内存大小固定,运行速度快)中;存放在中。
  • 引用数据类型的变量是一个存放在栈内存的指针,该指针指向堆内存的一个地址。
  • 引用数据类型的值可变(基本数据类型不可,改变实际上是创建了一个新的值)
  • 深拷贝与浅拷贝:引用数据类型的拷贝属于浅拷贝(传址)【只有当拷贝引用数据类型时,拷贝才存在浅拷贝与深拷贝之分】
🌟做题步骤
  1. let a = {n : 1};
  • 栈内存中的a指向堆内存中的{n:1}
  • 在这里插入图片描述
  1. let b = a;
  • a浅拷贝给了b,此时b也指向{n:1}
    • 在这里插入图片描述
  1. a.x = a = {n: 2};
  • 按优先级,先执行a.x=,a中无x,所以加了x后赋值undefined。此时a.x=被挂起等待别人赋值。
    • 在这里插入图片描述
    • 执行后面 a = {n: 2} 操作,栈内存中的a改变指向,指向堆内存中的{n:2}
    • 在这里插入图片描述
    • 执行 a.x = a,将a浅拷贝给a.x,即a.x={n:2}【刚刚a.x=已经被挂起,a的指向改变也不会造成影响】
    • 在这里插入图片描述
  1. console.log(a.x)
  • 由上图,a里面没有x,所以输出undefined
  1. console.log(b.x)
  • {n:2}
🌟答案

在这里插入图片描述

🙌题目二

      let a = {a:30};   
      let b = {b:10};       
      let obj={a:10};
      obj[b]=20;
      
      console.log(obj[a])    
🌟提炼知识点如下
  • ES6中属性名表达式的理解:如果属性名表达式是一个对象的话,那么默认情况下会自动将对象转为字符串[object Object]
🌟做题步骤
  1. let a = {a:30};
  • 在这里插入图片描述
  1. let b = {b:10};
    在这里插入图片描述
  2. let obj={a:10};
  • 在这里插入图片描述
  1. obj[b]=20;
  • 由于属性名b是一个对象,所以默认将b转换为字符串[object Object]
    • 在这里插入图片描述
  1. console.log(obj[a])
  • 属性名a是一个对象,默认将a转换为字符串[object Object],即要求输出obj[‘[object Object]’]
  • 答案为20
🌟答案

在这里插入图片描述

参考资料: let a = {n : 1};let b = a;a.x = a = {n: 2};console.log(a.x) console.log(b.x)

  • 1
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值