js中變量的連續(xù)賦值(實例講解)

發(fā)布時間：2020-09-20 13:56:12 來源：腳本之家閱讀：155 作者：jingxian 欄目：web開發(fā)

今天遇到了一個連續(xù)賦值的經(jīng)典案例，網(wǎng)友們給出的答案也是五花八門，看起來有些繁瑣，我也來說說自己的看法。

下面就是這個經(jīng)典案例：

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

console.log(a);
console.log(b);
console.log(a.x);
console.log(b.x)；

我們先來看一下普通連續(xù)賦值，即：變量賦值的類型是數(shù)據(jù)類型值

var a=3;
var b=a=5;
console.log(a);
console.log(b);

一般來說，等號賦值的方向是從右至左，那么上面的代碼等同于下面這段代碼，那么我們就用下面這段代碼來解釋上面的代碼：

var a=3;　　//全局變量a被賦值為3
var a=5;　　//此時a被重新賦值為5
var b=a;　　//將a的值賦給全局變量b
console.log(a);//a最終的值就是第二次被賦的值：5
console.log(b);//按照代碼執(zhí)行順序b的值也是：5

上面的小案例用來拋磚引玉，現(xiàn)在我們來分析這個經(jīng)典案例：

var a = {n: 1}；//a第一次被賦值，是一個引用類型值，請記得變量賦值為引用類型值的時候，通過變量改變這個對象的時候，對象本身也發(fā)生了變化
var b = a;//b被賦值為a,因此b就是對象{n:1}

a.x = a = {n: 2}；
//這個賦值與之前的簡單案例有所不同，a.x指的是給a添加一個x屬性，在js的運算中“.”和"="運算符同時出現(xiàn)，會先執(zhí)行"."運算
//因此，賦值順序被改變了，是先給a.x賦值，再給a賦值
//就是先執(zhí)行：a.x={n:2},注意這里a并未改變，是給a的x屬性賦值為{n:2},a還是{n:1}
//再回到我代碼中的第一句話，這個賦值行為，改變了{n:1}這個對象，即給它增加了名為x的屬性
//再執(zhí)行a={n:2}，這是變量a不再是對象{n:1},而被重新賦值為一個新的對象{n:2};

console.log(a);//自然此時a是對象{n:2}
console.log(b);//a的二次賦值，并沒有影響b，b還是對象{n:1},但是由于a在重新賦值之前，給{n:1}這個對象，增加了一個x屬性，因此，這時的b已經(jīng)有了x屬性
console.log(a.x);//{n:2}對象沒有x屬性，所以結果是undefined
console.log(b.x)；//綜上所述，這個結果是{n:2}

以上這篇js中變量的連續(xù)賦值(實例講解)就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持億速云。

向AI問一下細節(jié)

js中變量的連續(xù)賦值(實例講解)

猜你喜歡

最新資訊

相關推薦

相關標簽