天天看點

JavaScript建立函數的三種方式

1.函數聲明

1

2

3

<code>function</code> <code>sum1(n1,n2){</code>

<code>    </code><code>return</code> <code>n1+n2;</code>

<code>  </code><code>};</code>

2.函數表達式,又叫函數字面量

<code>var</code> <code>sum2=</code><code>function</code><code>(n1,n2){</code>

<code>};</code>

兩者的差別:解析器會先讀取函數聲明,并使其在執行任何代碼之前可以通路;而函數表達式則必須等到解析器執行到它所在的代碼行才會真正被解釋執行。

自執行函數嚴格來說也叫函數表達式,它主要用于建立一個新的作用域,在此作用域内聲明的變量,不會和其它作用域内的變量沖突或混淆,大多是以匿名函數方式存在,且立即自動執行。

<code>(</code><code>function</code><code>(n1,n2){</code>

<code>    </code><code>console.log (n1+n2)</code>

<code>})(1,3);</code><code>//4</code>

另外幾種自執行函數:

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

58

59

60

61

62

63

64

65

66

67

68

<code>//可用來傳參</code>

<code>(</code><code>function</code><code>(x,y){</code>

<code>  </code><code>console.log(x+y);</code>

<code>})(2,3);</code>

<code>//帶傳回值</code>

<code>var</code> <code>sum=(</code><code>function</code><code>(x,y){</code>

<code>  </code><code>return</code> <code>x+y;</code>

<code>console.log(sum);</code>

<code>~</code><code>function</code><code>(){</code>

<code>  </code><code>var</code> <code>name=</code><code>'~'</code>

<code>  </code><code>console.log(name);</code>

<code>}();</code>

<code>!</code><code>function</code><code>(){</code>

<code>  </code><code>var</code> <code>name=</code><code>'!'</code>

<code>;(</code><code>function</code><code>(){</code>

<code>  </code><code>var</code> <code>name=</code><code>';'</code>

<code>})();</code>

<code>-</code><code>function</code><code>(){</code>

<code>  </code><code>var</code> <code>name=</code><code>'-'</code>

<code>//逗号運算符</code>

<code>1,</code><code>function</code><code>(){</code>

<code>  </code><code>var</code> <code>name=</code><code>','</code><code>;</code>

<code>//異或</code>

<code>1^</code><code>function</code><code>(){</code>

<code>  </code><code>var</code> <code>name=</code><code>'^'</code><code>;</code>

<code>//比較運算符</code>

<code>1&gt;</code><code>function</code><code>(){</code>

<code>  </code><code>var</code> <code>name=</code><code>'&gt;'</code><code>;</code>

<code>~+-!(</code><code>function</code><code>(){</code>

<code>  </code><code>var</code> <code>name=</code><code>'~+-!'</code><code>;</code>

<code>~!(</code><code>function</code><code>(){</code>

<code>  </code><code>var</code> <code>name=</code><code>'~!'</code><code>;</code>

<code>(</code><code>function</code><code>(){</code>

<code>  </code><code>var</code> <code>name=</code><code>'call'</code><code>;</code>

<code>}).call();</code>

<code>  </code><code>var</code> <code>name=</code><code>'apply'</code><code>;</code>

<code>}).apply();</code>

3.函數構造法,參數必須加引号

<code>var</code> <code>sum3=</code><code>new</code> <code>Function(</code><code>'n1'</code><code>,</code><code>'n2'</code><code>,</code><code>'return n1+n2'</code><code>);</code>

<code>console.log(sum3(2,3));</code><code>//5</code>

從技術角度講,這是一個函數表達式。一般不推薦用這種方法定義函數,因為這種文法會導緻解析兩次代碼(第一次是解析正常ECMAScript代碼,第二次是解析傳入構造函數中的字元串),進而影響性能。

<code>var</code> <code>name=</code><code>'haoxl'</code><code>;</code>

<code>  </code><code>function</code> <code>fun(){</code>

<code>    </code><code>var</code> <code>name=</code><code>'lili'</code><code>;</code>

<code>    </code><code>return</code> <code>new</code> <code>Function(</code><code>'return name'</code><code>);</code><code>//不能擷取局部變量</code>

<code>  </code><code>}</code>

<code> </code><code>console.log(fun()());</code><code>//haoxl</code>

 Function()構造函數每次執行時都會解析函數主體,并建立一個新的函數對象,是以當在一個循環或頻繁執行的函數中調用Function()構造函數效率是非常低的。而函數字面量卻不是每次遇到都會重新編譯的,用Function()構造函數建立一個函數時并不遵循典型的作用域,它一直把它當作是頂級函數來執行。

内容轉載至:http://www.jb51.net/article/80861.htm

本文轉自    風雨蕭條 部落格,原文連結:    http://blog.51cto.com/1095221645/1870031    如需轉載請自行聯系原作者

繼續閱讀