這道js題你會嗎?

最近看到掘金一篇文章中的有一個題目,比較有意思,因此分享給你們看看。javascript

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

a.x
b.x
複製代碼

有興趣的能夠分析分析,看看答案是多少?五分鐘過去了,答案有了嗎?下面是答案,不知道有沒有跪在這道題上。java

a.x 	// --> undefined
b.x 	// --> {n: 2}
複製代碼

思路:

原文中的解題思路是這樣的:bash

  1. 優先級。. 的優先級高於=,因此先執行a.x,堆內存中的{n: 1}就會變成{n: 1, x: undefined},改變以後相應的b.x也變化了,由於指向的是同一個對象。
  2. 賦值操做是從右到左,因此先執行a = {n: 2}a 的引用就被改變了,而後這個返回值又賦值給了a.x ,須要注意的是這時候a.x 是第一步中的{n: 1, x: undefined}那個對象,其實就是b.x,至關於b.x = {n: 2}

思路很清晰,可是對於第一點,我加入了本身的理解進去。spa

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

// 這裏引擎會有RHS查詢和LHS查詢
// 具體參見《你不知道的javascript上》
複製代碼

RHS和LHS:說簡單的就是,在賦值的左右側進行查找變找,RHS 查詢與簡單地查找某個變量的值別無二致,而 LHS 查詢則是試圖 找到變量的容器自己,從而能夠對其賦值。3d

直接對a.x = a = {n: 2}分析,這裏在賦值前會有兩個LHS查詢,查找a.x和a的容器自己,a.x沒有查找到則聲明瞭一個undefined。code

從內存模型上分析:cdn

在執行 a.x = a = {n: 2}前對象

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

a.x 和 a 進行LHS時:blog

相關文章
相關標籤/搜索