在Javascript定義一個函數一般有如下三種方式:
函數關鍵字(function)語句:
function fnMethodName(x){alert(x);}
函數字面量(Function Literals):
var fnMethodName = function(x){alert(x);}
Function()構造函數:
var fnMethodName = new Function(‘x','alert(x);') // 由Function構造函數的參數個數可變。最后一個參數寫函數體,前面的參數寫入參。
上面三種方法定義了同一個方法函數fnMethodName,第1種就是最常用的方法,后兩種都是把一個函數復制給變量fnMethodName,而這個函數是沒有名字的,即匿名函數。
函數的執行順序:
例1.
test1(); function test1() { //函數聲明 alert("1111"); } test2(); var test2 = function(){ //函數字面量 alert("2222"); } test3(); var test3 = new Function("alert(3333);"); //運行時,初始化函數體
執行結果:彈出1111,但是沒有彈出222, 3333
原理:彈出1111 是因為JS函數聲明提前
沒有彈出2222, 3333,是因為函數字面量不是函數聲明,函數字面量表示方法是在運行時解析的,在調用test2()之前,函數字面量的函數體還沒有聲明。
例2.
function f(){return 1;} console.log(f()); // 第四個函數把第一個函數覆蓋 var f = new Function("return 2;"); console.log(f()); // 第二個函數把第四個函數覆蓋 var f = function() {return 3;} console.log(f()); // 第三個函數把第二個函數覆蓋 function f(){return 4;} console.log(f()); // 第四個函數已經被覆蓋 var f = new Function("return 5;"); console.log(f()); // 第五個函數把第三個函數覆蓋 var f = function(){return 6;} console.log(f()); // 第六個函數把第五個函數覆蓋
執行結果: 4 2 3 3 5 6
原理: 先找出函數聲明,“返回值是4的函數聲明”覆蓋了“返回值是1的函數聲明”。所以第一個f()的結果是4 。
函數作用域:
var k = 4; window.onload=function() { var k=1; function t1() { var k = 2; function test(){return k;} console.info(test()); // 彈出 2 var test = function(){return k;}; console.info(test()); // 彈出 2 var test = new Function("return k;"); // 每次執行的時候,動態的new,頂級作用域,無法獲得局部變量 console.info(test()); // 彈出 4 } t1(); };
二、函數字面量和Function()構造函數的區別
雖然函數字面量是一個匿名函數,但語法允許為其指定任意一個函數名,當寫遞歸函數時可以調用它自己,使用Function()構造函數則不行。
var f = function fact(x) { if (x < = 1) return 1; else return x*fact(x-1); };
Function()構造函數允許運行時Javascript代碼動態的創建和編譯。在這個方式上它類似全局函數eval()。
Function()構造函數每次執行時都解析函數主體,並創建一個新的函數對象。所以當在一個循環或者頻繁執行的函數中調用Function()構造函數的效率是非常低的。相反,函數字面量卻不是每次遇到都重新編譯的。
用Function()構造函數創建一個函數時並不遵循典型的作用域,它一直把它當作是頂級函數來執行。
var y = “global”; function constructFunction() { var y = “local”; return new Function(“return y”); // 無法獲取局部變量 } alert(constructFunction()()); // 輸出 “global”
函數直接量:
只要是表達式語法,腳本宿主就認為 function 是一個直接量函數,如果什么都不加,光以 function 開頭的話則認為是一個函數聲明,把 function 寫進一個表達式內部,比如四則運算,宿主也會將其當作是一個直接量,如下:
只有函數表達式可以被立即調用,函數聲明不可以.
var a = 10 + function(){ return 5; }();
誇張一點,如下:
(function(){ alert(1); } ) ( ); ( function(){ alert(2); } ( ) ); void function(){ alert(3); }() 0, function(){ alert(4); }(); -function(){ alert(5); }(); +function(){ alert(6); }(); !function(){ alert(7); }(); ~function(){ alert(8); }(); typeof function(){ alert(9); }();
js中定義函數的方式有多種,函數直接量就是其中一種。如var fun = function(){}, 這里function如果不賦值給fun那么它就是一個匿名函數。
好,看看匿名函數的如何被調用。
1、執行后得到返回值的函數調用
//方式一,調用函數,得到返回值。強制運算符使函數調用執行 (function(x,y){ alert(x+y); return x+y; }(3,4)); //方式二,調用函數,得到返回值。強制函數直接量執行再返回一個引用,引用在去調用執行 (function(x,y){ alert(x+y); return x+y; })(3,4);
2、執行后忽略返回值
//方式三,調用函數,忽略返回值 void function(x) { x = x-1; alert(x); }(9);
嗯,最后看看錯誤的調用方式
//錯誤的調用方式 function(x,y){ alert(x+y); return x+y; }(3,4);
三、應用實例的一些說明
對象直接量創建一個對象:
var obj = {x:[1,2],y:23};
代碼跟下面是一樣的。
var obj=new Object(); obj.x=new Array(1,2); obj.y=23;
測試:
for(var i in obj) alert(obj[i]);
函數直接量:它是一個表達式而不是語句。
(function(){})()
如下例:
(function(){ document.write(“some script code”); })() var a=(function(s){return s})(“abc”); alert(a); var b=function(s){return s}; alert(b(“abc”));
這個如何解釋呢
大家應該記得這種寫法
var a=function (){}
那么怎么運行a呢,那么就是a()
同樣的道理,我們不通過a這個變量來存那么是如何寫法,就是
function(){}()
但是你會發現這樣是錯的
因為解析引擎解析的時候,解析的時候發現}判斷到了函數結束了
並沒有把那個函數作為塊來運行
那么加上()是強制把function那塊作為塊
JS函數調用的四種方法:方法調用模式,函數調用模式,構造器調用模式,apply,call調用模式
1. 方法調用模式:
先定義一個對象,然后在對象的屬性中定義方法,通過myobject.property來執行方法,this即指當前的myobject對象。
var blogInfo={ blogId:123, blogName:"werwr", showBlog:function(){alert(this.blogId);} }; blogInfo.showBlog();
2.函數調用模式
定義一個函數,設置一個變量名保存函數,這時this指向到window對象。
var myfunc = function(a,b){ return a+b; } alert(myfunc(3,4));
3.構造器調用模式
定義一個函數對象,在對象中定義屬性,在其原型對象中定義方法。在使用prototype的方法時,必須實例化該對象才能調用其方法。
var myfunc = function(a){ this.a = a; }; myfunc.prototype = { show:function(){alert(this.a);} } var newfunc = new myfunc("123123123"); newfunc.show();
4.apply,call調用模式
var myobject={}; var sum = function(a,b){ return a+b; }; var sum2 = sum.call(myobject,10,30); //var sum2 = sum.apply(myobject,[10,30]); alert(sum2);