首頁 > web前端 > js教程 > 主體

JavaScript中:表達式和語句的區別[譯]_javascript技巧

WBOY
發布: 2016-05-16 17:49:58
原創
1312 人瀏覽過

1.語句和表達式

JavaScript中的表達式和語句是有區別的.一個表達式會產生一個值,它可以放在任何需要一個值的地方,比如,作為一個函數調用的參數.下面的每行程式碼都是一個表達式:

myvar3 xmyfunc("a", "b")語句可以理解成一個行為.循環語句和if語句就是典型的語句.一個程式是由一系列語句組成的.JavaScript中某些需要語句的地方,你可以使用一個表達式來代替.這樣的語句稱之為表達式語句.但反過來不可以:你不能在一個需要表達式的地方放一個語句.比如,一個if語句不能作為一個函數的參數.

2.其他語法

看看下面這兩對類似的語法,搞懂這些後,能夠幫助我們更好的理解語句和表達式之間的關係.

2.1 If語句和條件運算子
下面是一個if語句的例子:

複製程式碼 程式碼如下:

var x;
if (y >= 0) {
x = y;
if (y >= 0) {
x = y;
} else {
x = -y;
}



類似if語句功能的表達式叫做條件運算子.上面的語句等價於下面的.

var x = (y >= 0 ? y : -y);

在等於號=和分號;之間的代碼就是條件表達式.兩邊的小括號不是必需的,但我覺得小括號能讓條件表達式更易讀.

2.2 分號和逗號運算子
在JavaScript中,使用分號可以連接兩個語句:

foo(); bar()要連接兩個表達式,使用的是不常見的逗號運算子:
foo(), bar()逗號運算子會計算前後兩個表達式,然後傳回右邊表達式的計算結果.例如: 複製程式碼
程式碼如下:


" a", "b"
'b'

> var x = ("a", "b");
> x
'b'

> console.log(("a", "b"));




3.看似語句的表達式

有些表達式看起來像是語句,這可能會帶來一些麻煩.

3.1 物件字面量和語句區塊
下面是一個物件字面量,也就是一個可以產生一個物件值的表達式. 複製程式碼
程式碼如下:


{
foo: bar(3, 5)
}


不過同時,它也是一個完全合法的語句,這個語句的組成部分有:

•一個代碼塊:一個由大括號包圍的語句序列.
•一個標籤:你可以在任何語句前面放置一個標籤.這裡的foo就是一個標籤.
•一條語句:表達式語句bar(3, 5).
你也許會感到震驚,那就是JavaScript居然可以有獨立的程式碼區塊(常見的程式碼區塊是依託於迴圈或if語句的).下面的程式碼示範了這種程式碼區塊的作用:你可以給它設定一個標籤然後跳出這個程式碼區塊. 複製程式碼
程式碼如下:


function test(printTwo) {
print: console.log("One");
if (!printTwo) break printing;
console.log("Two");
}
console.log("Three");
}
> test(false)
One
Three
> test(true)
One
Two
Three


3.2 函數表達式和函數宣告
下面的程式碼是一個函數表達式:

function () { }你還可以給這個函數表達式起一個名字,將它轉變為一個命名(非匿名)的函數表達式:

function foo() { }這個函數的函數名稱(foo)只存在於函數內部,例如,可以用它來做遞歸運算:
程式碼如下:


> var fac = function me(x) { return x > fac(10)
3628800
> console.log(me)
ReferenceError: me is not defined


一個命名的函數表達式從表面上看起來,和一個函數聲明並沒有什麼區別.但他們的效果是不同的:一個函數表達式產生一個值(一個函數).一個函數聲明執行一個動作:將一個函數賦值給一個變數. 此外,只有函數表達式可以被立即調用,函數聲明不可以.

3.3 解決衝突
從3.1和3.2可以看出,有些表達式和語句在表面上看不出有什麼區別.也就意味著,相同的代碼,出現在表達式上下文和出現在語句上下文會表現出不同的作用.通常情況下,這兩種上下文是沒有交集的.但是,如果是表達式語句的話,會有一個重疊:也就是說,會有一些表達式出現在語句上下文上.為了解決這種歧義,JavaScript語法禁止表達式語句以大括號或關鍵字" function"開頭:
複製程式碼 程式碼如下:

ExpressionStatement 代碼如下:



那麼,如果你想寫一個以那些標誌開頭的表達式語句,該怎麼辦呢? 你可以把它放在一個括號內部,這樣並不會改變運行結果,只會確保該表達式被解析在表達式上下文中.讓我們看兩個例子.第一個例子:eval會按照語句上下文解析它的參數.如果你想讓eval回傳一個物件,你必須在物件字面量兩邊加上一個括號. 程式碼如下:


> eval("{ foo: 123 }")
123
> eval("({ foo: 123 })")
{ foo: 123 }


第二個範例:下面的範例是一個立即執行的函數表達式. 程式碼如下:


> (function () { return "abc" }())
'abc'


如果你省略了小括號,你會得到一個語法錯誤(函數宣告不可以是匿名的): 程式碼如下:


> function () { return "abc" }()
SyntaxError: function statement requires a name


如果你加上函數名稱,還會得到一個語法錯誤(函數宣告不能被理解執行) : 程式碼如下:


> function foo() { return "abc" } ()
SyntaxError: syntax error



另外一個能讓表達式在表達式上下文上被解析的辦法是使用一元運算子,例如!.但是,和使用或!.但是,和使用或!.但是括號不同的是,這些運算子會改變表達式的運作結果.如果你不關心結果的話,完全可以使用: 程式碼如下:


> function () { console.log("hello") }()
hello
NaNNaN


是作用在函數執行後的回傳值undefined上的結果.

譯者註:我覺的沒翻譯明白,所以用拙劣的水平畫了張圖.
JavaScript中:表達式和語句的區別[譯]_javascript技巧
原文(英文):http://www.2ality.com/2012/09/expressions-vs-statements.html 
相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
最新問題
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板