美文网首页
js经典面试题-连续赋值运算

js经典面试题-连续赋值运算

作者: 辣瓜瓜 | 来源:发表于2020-11-28 10:06 被阅读0次

今天看技术群里谈论连续赋值运算的问题,justjavac直接拿出了十年前的文章
文章,不愧是大神,10年前就有研究,在这里分享下我的理解:

一. 两个顺序问题

1. js的代码(不考虑变量提升、异步操作),它的执行顺序是从上倒下,从左到右的,一行一行的执行的。

2. 赋值运算有以下两种形式:

  • 简单的赋值运算=:把等号右侧操作数的值直接复制给左侧的操作数,因此左侧操作数的值会发生变化。
  • 附加操作的赋值运算:赋值之前先对右侧操作数执行某种操作,然后把运算结果复制给左侧操作数。

注意,赋值运算是从右往左进行复制的

二. JS内存的基础知识

JS的引用数据类型,比如数组Array,它们值的大小是不固定的。引用数据类型的值是保存在堆内存中的对象。
JavaScript不允许直接访问堆 内存中的位置,因此我们不能直接操作对象的堆内存空间。在操作对象时,实际上是在操作对象的引用而不是实际的对象。
因此,引用类型的值都是按引用访问的。这里的引用,我们可以粗浅地理解为保存在变量对象中的一个地址,该地址与堆内存的实际值相关联。
这里不做过多介绍,可以百度下堆栈的相关知识即可。

具备上述基础后,下面的题就很好理解了

第一题:
var a = {n:1}; 
var b = a;  
a = {n:2}; 
a.x = a;
console.log(1,a); // { n: 2, x:{ n: 2, x:{ n: 2,x:{...循环 } } } }
console.log(2,a.x); // { n: 2, x:{ n: 2, x:{ n: 2,x:{...循环 } } } }
console.log(3,b); // {n: 1}
console.log(4,b.x); // undefined
分析:

var a = {n:1}; // 开辟一块内存空间a,在栈内存中存入{n:1}的指针0x0012ffc
var b = a; // 开辟一块内存空间b,在栈内存中存入{n:1}的指针0x0012ffc
a = {n:2}; // 更改a的指向为0x0012ffd
a.x = a; // 创建x属性,并将x属性存入a的指针0x0012ffd
因此b一直指向指针0x0012ffc的地址,所以打印的结果很好理解。
a有x属性,x属性指向a,一直循环。因此console.log(1,a);console.log(2,a.x);打印出来是循环引用的样子。

1.png
第二题:
var a ={n:1};
var b = a;
a.x=a={n:2};
console.log(1,a); // {n: 2}
console.log(2,a.x); // undefined
console.log(3,b); // {n: 1, x: { n: 2 }}
console.log(4,b.x); // {n: 2}
分析:

var a = {n:1}; // 开辟一块内存空间a,在栈内存中存入{n:1}的指针0x0012ffc
var b = a; // 开辟一块内存空间b,在栈内存中存入{n:1}的指针0x0012ffc
a.x=a={n:2}; // 1. 创建a的属性;2.更改a的指向为0x0012ffd;3. 给x赋值{n:2}的指针0x0012ffd
这里需要注意顺序问题先创建a的属,在从右向左进行赋值运算。
console.log(1, a); // 打印时候先找a的指针,指向为0x0012ffd {n:2},因此打印为{n:2}。
console.log(2, a.x); // 打印时候先找a的指针,指向为0x0012ffd {n:2},不包含a的属性,因此打印为undefined。
console.log(3,b); // 打印时候先找b的指针,指向为0x0012ffc,如下图,因此打印为{n: 1, x: { n: 2 }}

2.png

相关文章

  • js经典面试题-连续赋值运算

    今天看技术群里谈论连续赋值运算的问题,justjavac直接拿出了十年前的文章文章[https://justjav...

  • 剑指Offer学习笔记

    面试题1:赋值运算符函数 如下为CMyString的声明,请为该类添加赋值运算符函数。 class CMyStri...

  • js运算符

    js基础语法:运算符,判断语句,数据类型,js对象 一、运算符 赋值运算符 =算数运算符 +-*/% ++...

  • JavaScript 02 (运算符和选择结构)

    js的关系运算符,js的逻辑运算符,js的赋值运算符,js的运算符的优先级问题,js的自增和自减,js的选择结构 ...

  • 2018-12-01

    赋值运算符 关系运算符 Unicode编码 相等运算符 条件运算符 运算符的优先级 代码块 js操作属性 js换肤...

  • JS隐性转换

    JS的运算符中,=,==,===这三个运算符对初学者而言,很容易混淆 = 是赋值运算符,用来给变量赋值 == 判...

  • 剑指offer第二版-1.赋值运算符函数

    本系列导航:剑指offer(第二版)java实现导航帖 面试题1:赋值运算符函数 题目要求:为自定义类添加赋值运算...

  • 3、运算符

    JS有四种运算类型,分别是:算术运算、赋值运算、比较运算和逻辑运算。 算术运算符: 1、+ 加运算- 用于numd...

  • js运算符

    JS中为我们提供了三种逻辑运算符: 赋值运算符: = 可以将符号右侧的值赋值给符号左侧的变量 +=...

  • web前端入门到实战:js函数与作用域,了解函数基本概念

    通过js基础语法了解到js的值包含数字,字符串和布尔值;js运算符分为算数,赋值,比较和逻辑运算符;js的流程控制...

网友评论

      本文标题:js经典面试题-连续赋值运算

      本文链接:https://www.haomeiwen.com/subject/glqliktx.html