寫了10年的Javascript也未必全了解的連續(xù)賦值運(yùn)算
更新時間:2011年03月25日 16:26:44 作者:
很喜歡 蔡蔡 的這個標(biāo)題,實(shí)際蔡蔡已經(jīng)分析過了,這里借用了?;蛟S有點(diǎn)標(biāo)題黨的意思。看完就知了。
一、引子
var a = {n:1};
a.x = a = {n:2};
alert(a.x); // --> undefined
這是蔡蔡在看 jQuery源碼 時發(fā)現(xiàn)這種寫法的。以上第二句 a.x = a = {n:2} 是一個連續(xù)賦值表達(dá)式。這個連續(xù)賦值表達(dá)式在引擎內(nèi)部究竟發(fā)生了什么?是如何解釋的?
二、猜想
猜想1:從左到右賦值,a.x 先賦值為{n:2},但隨后 a 賦值為 {n:2},即 a 被重寫了,值為 {n:2},新的 a 沒有 x屬性,因此為undefined。步驟如下
1, a.x = {n:2};
2, a = {n:2};
這種解釋得出的結(jié)果與實(shí)際運(yùn)行結(jié)果一致,貌似是對的。注意猜想1中 a.x 被賦值過。
猜想2:從右到左賦值,a 先賦值為{n:2},a.x 發(fā)現(xiàn) a 被重寫后(之前a是{a:1}),a.x = {n:2} 引擎限制a.x賦值,忽略了。步驟如下:
1, a = {n:2};
2, a.x 未被賦值{n:2}
等價于 a.x = (a = {n:2}),即執(zhí)行了第一步,這樣也能解釋a.x為undefined了。注意猜想2中a.x壓根沒被賦值過。
三、證明
上面兩種猜想相信多數(shù)人都有,群里討論呆呆認(rèn)為是猜想1, 我認(rèn)為是猜想2。其實(shí)都錯了。我忽略了引用的關(guān)系。如下,加一個變量b,指向a。
var a = {n:1};
var b = a; // 暫存a
a.x = a = {n:2};
alert(a.x);// --> undefined
alert(b.x);// --> [object Object]
發(fā)現(xiàn)a.x仍然是undefined,神奇的是 b.x 并未被賦值過(比如:b.x={n:2}),卻變成了[object Object]。b 是指向 a({n:1})的,只有a.x = {n:2}執(zhí)行了才說明b是有x屬性的。實(shí)際執(zhí)行過程:從右到左,a 先被賦值為{n:2},隨后a.x被賦值{n:2}。
1, a = {n:2};
2, a.x = {n:2};
等價于
a.x = (a = {n:2});
與猜想2的區(qū)別在于a.x 被賦值了,猜想2中并未賦值。最重要的區(qū)別,第一步 a = {n:2} 的 a 指向的是新的對象{n:2} , 第二步 a.x = {n:2} 中的 a 是 {a:1}。即在這個連等語句
a.x = a = {n:2};
a.x 中的a指向的是 {n:1},a 指向的是 {n:2}。如下圖
var a = {n:1};
a.x = a = {n:2};
認(rèn)為引擎會限制a.x的重寫(a被重寫后),實(shí)際卻不是這樣的。指向的對象已經(jīng)不同了。引擎也沒有限制a.x={n:2}的重寫。
謝謝所有參與討論的人:蔡蔡、呆呆、儒儒。這個問題最早是蔡蔡提出的。儒儒在 菜鳥灰呀灰 群里每次的討論都那么投入,認(rèn)真,哪怕是別人提出的話題。
五:結(jié)束
呵,以另一個連續(xù)賦值題結(jié)束。fun執(zhí)行后,這里的 變量 b 溢出到fun外成為了全局變量。想到了嗎?
function fun(){
var a = b = 5;
}
fun();
alert(typeof a); // --> undefined
alert(typeof b); // --> number
復(fù)制代碼 代碼如下:
var a = {n:1};
a.x = a = {n:2};
alert(a.x); // --> undefined
這是蔡蔡在看 jQuery源碼 時發(fā)現(xiàn)這種寫法的。以上第二句 a.x = a = {n:2} 是一個連續(xù)賦值表達(dá)式。這個連續(xù)賦值表達(dá)式在引擎內(nèi)部究竟發(fā)生了什么?是如何解釋的?
二、猜想
猜想1:從左到右賦值,a.x 先賦值為{n:2},但隨后 a 賦值為 {n:2},即 a 被重寫了,值為 {n:2},新的 a 沒有 x屬性,因此為undefined。步驟如下
1, a.x = {n:2};
2, a = {n:2};
這種解釋得出的結(jié)果與實(shí)際運(yùn)行結(jié)果一致,貌似是對的。注意猜想1中 a.x 被賦值過。
猜想2:從右到左賦值,a 先賦值為{n:2},a.x 發(fā)現(xiàn) a 被重寫后(之前a是{a:1}),a.x = {n:2} 引擎限制a.x賦值,忽略了。步驟如下:
1, a = {n:2};
2, a.x 未被賦值{n:2}
等價于 a.x = (a = {n:2}),即執(zhí)行了第一步,這樣也能解釋a.x為undefined了。注意猜想2中a.x壓根沒被賦值過。
三、證明
上面兩種猜想相信多數(shù)人都有,群里討論呆呆認(rèn)為是猜想1, 我認(rèn)為是猜想2。其實(shí)都錯了。我忽略了引用的關(guān)系。如下,加一個變量b,指向a。
復(fù)制代碼 代碼如下:
var a = {n:1};
var b = a; // 暫存a
a.x = a = {n:2};
alert(a.x);// --> undefined
alert(b.x);// --> [object Object]
發(fā)現(xiàn)a.x仍然是undefined,神奇的是 b.x 并未被賦值過(比如:b.x={n:2}),卻變成了[object Object]。b 是指向 a({n:1})的,只有a.x = {n:2}執(zhí)行了才說明b是有x屬性的。實(shí)際執(zhí)行過程:從右到左,a 先被賦值為{n:2},隨后a.x被賦值{n:2}。
1, a = {n:2};
2, a.x = {n:2};
等價于
a.x = (a = {n:2});
與猜想2的區(qū)別在于a.x 被賦值了,猜想2中并未賦值。最重要的區(qū)別,第一步 a = {n:2} 的 a 指向的是新的對象{n:2} , 第二步 a.x = {n:2} 中的 a 是 {a:1}。即在這個連等語句
復(fù)制代碼 代碼如下:
a.x = a = {n:2};
a.x 中的a指向的是 {n:1},a 指向的是 {n:2}。如下圖
四:解惑
這篇寫完,或許部分人看完還是暈暈的。因?yàn)槔锩娴奈淖置枋鰧?shí)在是繞口。最初我在理解這個連等賦值語句時
復(fù)制代碼 代碼如下:
var a = {n:1};
a.x = a = {n:2};
認(rèn)為引擎會限制a.x的重寫(a被重寫后),實(shí)際卻不是這樣的。指向的對象已經(jīng)不同了。引擎也沒有限制a.x={n:2}的重寫。
謝謝所有參與討論的人:蔡蔡、呆呆、儒儒。這個問題最早是蔡蔡提出的。儒儒在 菜鳥灰呀灰 群里每次的討論都那么投入,認(rèn)真,哪怕是別人提出的話題。
五:結(jié)束
呵,以另一個連續(xù)賦值題結(jié)束。fun執(zhí)行后,這里的 變量 b 溢出到fun外成為了全局變量。想到了嗎?
復(fù)制代碼 代碼如下:
function fun(){
var a = b = 5;
}
fun();
alert(typeof a); // --> undefined
alert(typeof b); // --> number
相關(guān)文章
js中的hasOwnProperty和isPrototypeOf方法使用實(shí)例
這篇文章主要介紹了js中的hasOwnProperty和isPrototypeOf方法使用實(shí)例,需要的朋友可以參考下2014-06-06一文詳解JS?類型轉(zhuǎn)換方法以及如何避免隱式轉(zhuǎn)換
這篇文章主要為大家介紹了JS?類型轉(zhuǎn)換方法以及如何避免隱式轉(zhuǎn)換示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-04-04