建站
咨詢
售后
建站咨詢
新聞中心
該文章中將分享一下作者在寫Javascript的心得，是關(guān)于連續(xù)賦值運(yùn)算一些技巧。對(duì)大家在Web開發(fā)方面肯定有很大的啟發(fā)和幫助。
一、引子
- var a = {n:1};
- a.x = a = {n:2};
- alert(a.x); // --> undefined
這是蔡蔡在看jQuery源碼 時(shí)發(fā)現(xiàn)這種寫法的。以上第二句 a.x = a = {n:2} 是一個(gè)連續(xù)賦值表達(dá)式。這個(gè)連續(xù)賦值表達(dá)式在引擎內(nèi)部究竟發(fā)生了什么?是如何解釋的?
二、猜想
猜想1：從左到右賦值，a.x 先賦值為{n:2}，但隨后 a 賦值為 {n:2}，即 a 被重寫了，值為 {n:2}，新的 a 沒有 x屬性，因此為undefined。步驟如下
- a.x = {n:2};
- a = {n:2};
這種解釋得出的結(jié)果與實(shí)際運(yùn)行結(jié)果一致，貌似是對(duì)的。注意猜想1中 a.x 被賦值過。
猜想2：從右到左賦值，a 先賦值為{n:2}，a.x 發(fā)現(xiàn) a 被重寫后(之前a是{a:1})，a.x = {n:2} 引擎限制a.x賦值，忽略了。步驟如下：
- a = {n:2};
- a.x 未被賦值{n:2}
等價(jià)于 a.x = (a = {n:2})，即執(zhí)行了***步，這樣也能解釋a.x為undefined了。注意猜想2中a.x壓根沒被賦值過。
三、證明
上面兩種猜想相信多數(shù)人都有，群里討論呆呆認(rèn)為是猜想1， 我認(rèn)為是猜想2。其實(shí)都錯(cuò)了。我忽略了引用的關(guān)系。如下，加一個(gè)變量b，指向a。
Js代碼
- 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}。
- a = {n:2};
- a.x = {n:2};
等價(jià)于
- a.x = (a = {n:2});
與猜想2的區(qū)別在于a.x 被賦值了，猜想2中并未賦值。最重要的區(qū)別，***步 a = {n:2} 的 a 指向的是新的對(duì)象{n:2} ， 第二步 a.x = {n:2} 中的 a 是 {a:1}。即在這個(gè)連等語句
Js代碼
- a.x = (a = {n:2});
a.x 中的a指向的是 {n:1}，a 指向的是 {n:2}。如下圖
四：解惑
這篇寫完，或許部分人看完還是暈暈的。因?yàn)槔锩娴奈淖置枋鰧?shí)在是繞口。最初我在理解這個(gè)連等賦值語句時(shí)
Js代碼
- var a = {n:1};
- a.x = a = {n:2};
認(rèn)為引擎會(huì)限制a.x的重寫(a被重寫后)，實(shí)際卻不是這樣的。指向的對(duì)象已經(jīng)不同了。引擎也沒有限制a.x={n:2}的重寫。
謝謝所有參與討論的人：蔡蔡、豬大腸 、呆呆、雅儒。這個(gè)問題最早是蔡蔡提出的。雅儒在 菜鳥灰呀灰 群里每次的討論都那么投入，認(rèn)真，哪怕是別人提出的話題。
五：結(jié)束
呵，以另一個(gè)連續(xù)賦值題結(jié)束。fun執(zhí)行后，這里的 變量 b 溢出到fun外成為了全局變量。想到了嗎?
Js代碼
- function fun(){
- var a = b = 5;
- }
- fun();
- alert(typeof a); // --> undefined
- alert(typeof b); // --> number
原文鏈接：http://www.javaeye.com/topic/785445
【編輯推薦】
- JavaScript初學(xué)者應(yīng)注意的七個(gè)細(xì)節(jié)
- Web開發(fā)者必知 31個(gè)最實(shí)用的Javascript工具（附下載）
- JavaScript函數(shù)式編程
- 提升JavaScript遞歸效率：Memoization技術(shù)詳解
分享標(biāo)題：寫了10年Javascript未必全了解的連續(xù)賦值運(yùn)算
瀏覽地址：http://www.dlmjj.cn/article/ccoesei.html
