JavaScript運算符優先級與結合性

優先級與結合性

優先級和結合性會決定表達式中的運算如何結合,也就是指結合的優先級(通俗一點,可以理解爲 優先級高的運算符會用個括號括起來),例如:
var value1 = 1 + 0 ? 2 : 3;
var value2 = ( 1 + 0 ) ? 2 : 3;
var value3 = 1 + ( 0 ? 2 : 3 );
console.log(value1);//2
console.log(value2);//2
console.log(value3);//4
因爲+的優先性高於:?,所以value1等價於value2。
再例如:
var value1 = 1 ? 1 : 0 ? 4 : 5;
var value2 = 1 ? 1 : ( 0 ? 4 : 5 );
var value3 = ( 1 ? 1 : 0 ) ? 4 : 5;

console.log(value1);//1
console.log(value2);//1
console.log(value3);//4
...?...:... 是右結合的,因此value1與value2是等價的(如果...?...:... 是左結合,那麼value1應該等於value3)。
此外對於value1和value2而言,0?4:5是沒有執行的,將上面的代碼改下:
function getValue(v){
    console.log("get ",v);
    return v;
}

var value1 = 1 ? 1 : 0 ? 4 : getValue(5);
var value2 = 1 ? 1 : ( 0 ? 4 : getValue(5) );
var value3 = ( 1 ? 1 : 0 ) ? 4 : 5;

console.log(value1);//1
console.log(value2);//1
console.log(value3);//4
//並沒有輸出 get 5
因此,加上括號之後並不意味着表達式會先執行,括號可以理解爲求值。也就是說表達式還是從左往右執行的,JavaScript會根據優先級與結合性來給表達式加上括號,在計算過程中,遇到括號就求括號的值,然後再繼續運算。例如
var a, b;
a = b = 1;
//相當於:
a = ( b = 1 );
//(...)理解爲求值運算,因此有
console.log( (b = 2) );//這裏輸出2
賦值運算符=,是右結合的。

關於JavaScript的優先級與結合性,彙總如下
優先級 運算類型 結合性 運算符
19 圓括號 n/a ( … )
18 成員訪問 從左到右 … . …
需計算的成員訪問 從左到右 … [ … ]
new (帶參數列表) n/a new … ( … )
17 函數調用 從左到右 … ( … )
new (無參數列表) 從右到左 new …
16 後置遞增(運算符在後) n/a … ++
後置遞減(運算符在後) n/a … --
15 邏輯非 從右到左 ! …
按位非 從右到左 ~ …
一元加法 從右到左 + …
一元減法 從右到左 - …
前置遞增 從右到左 ++ …
前置遞減 從右到左 -- …
typeof 從右到左 typeof …
void 從右到左 void …
delete 從右到左 delete …
14 乘法 從左到右 … * …
除法 從左到右 … / …
取模 從左到右 … % …
13 加法 從左到右 … + …
減法 從左到右 … - …
12 按位左移 從左到右 … << …
按位右移 從左到右 … >> …
無符號右移 從左到右 … >>> …
11 小於 從左到右 … < …
小於等於 從左到右 … <= …
大於 從左到右 … > …
大於等於 從左到右 … >= …
in 從左到右 … in …
instanceof 從左到右 … instanceof …
10 等號 從左到右 … == …
非等號 從左到右 … != …
全等號 從左到右 … === …
非全等號 從左到右 … !== …
9 按位與 從左到右 … & …
8 按位異或 從左到右 … ^ …
7 按位或 從左到右 … | …
6 邏輯與 從左到右 … && …
5 邏輯或 從左到右 … || …
4 條件運算符 從右到左 … ? … : …
3 賦值 從右到左 … = …
… += …
… -= …
… *= …
… /= …
… %= …
… <<= …
… >>= …
… >>>= …
… &= …
… ^= …
… |= …
2 yield 從右到左 yield …
yield* 從右到左 yield* …
1 展開運算符 n/a ... …
0 逗號 從左到右 … , …

參考資料:
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/Operator_Precedence
http://www.cnblogs.com/yy-hh/p/4624792.html
http://www.cnblogs.com/lvdabao/p/4280518.html

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章