首頁 > web前端 > js教程 > Javascript中的方法與匿名方法實例詳解_javascript技巧

Javascript中的方法與匿名方法實例詳解_javascript技巧

WBOY
發布: 2016-05-16 15:55:07
原創
1161 人瀏覽過

本文實例講述了Javascript中的方法和匿名方法。分享給大家供大家參考。具體分析如下:

Javascript方法(函數)

宣告函數

以function開頭,後面跟著函數名,與C#、java不同,Javascript不需要宣告回傳值型別、參數型別。沒有回傳值就是undefined。

舉例比較清楚: 
無參數無回傳值​​的方法:

function f1(){
alert('这是一个方法');
}
f1();//调用方法 

登入後複製

無參數有回傳值的方法:

function f2(){
return 100;
}
var result=f2();//声明一个变量,接收f1()中的返回值
alert(result);//100 

登入後複製

有參數有回傳值的方法:

function f3(n1,n2){
return n1+n2;
}
var result=f3(20,30);
alert(result);//50

登入後複製

注意1:

先看範例:

function f1(){
  alert('这是一个方法'); 
}
alert(f1());//弹出”这是一个方法”后,还会显示undefined

登入後複製

原因:js中,變數沒有賦值,就是undefined;該栗子中f1()沒有回傳值,那麼就是一個未知的值(undefined),這裡未知的變數放入alert(),當然彈出的就是undefined

注意2:

alert(f1);//不写括号,会将f1整个代码以字符串形式显示出来:
function f1(){ 
alert('这是一个方法'); 
} 
登入後複製

JavaScript中沒有方法重載

只呼叫最新定義的方法:

function f1(n1,n2){ 
alert(n1+n2); 
} 
function f1(n1,n2){ 
alert(n1-n2); 
} 
f1(10,2);//8

登入後複製

結論:無論在哪裡調用,都只調用最新定義的方法。

注意:數字 undefined=undefined

function f1(n1,n2,n3){ 
alert(n1-n2+n3); 
} 
f1(10,2);
//NaN,因为没有给n3传值,n3就是undefined,
//数字加上undefined还是undefined

登入後複製

以上結論:Javascript中沒有方法重載

定義方法時注意:

自訂函數名稱不要和內建方法重新名稱:
不要跟js內建、dom內建方法重名,例如selectAll、focus等函數名不要用。

不要與系統函數重名。 (在點擊事件中呼叫自己定義的focus方法,有問題。與系統的focus()方法重名了)

書寫規則括號注意:

一般在js寫大括號都是直接跟在後面

function f1(){ 
return 
{ 
age:100}; 
} 
var s=f1(); 
alert(s.age);
//undefined。s结果是undefined,undefined.age必然还是undefined

登入後複製

匿名方法(用的非常多)

為什麼推薦用匿名方法?

1、有一個1.js中有個方法function aa(){alert{'我挺帥了'}}

2、有一個2.js中有個方法function aa(){alert{'我越來越帥了'}}

3、將1.js和2.js依序匯入index.html中,呼叫aa();結果顯示:我越來越帥了。

結論:2.js中的aa()方法會覆寫1.js中的aa()

怎麼辦?不再指定方法名,使用匿名方法

先看一個將匿名方法賦給變數範例:

var ff=function(n1,n2){ 
return n1+n2; 
}; 
alert(ff(20,30));//50

登入後複製

一行寫完匿名方法:

複製程式碼 程式碼如下:
(function (n1,n2){alert(n1 n2);})(9 ,9);

小案例:1:

var x=1; 
var y=0; 
var z=0; 
var add=function (n){n=n+1;return n}; 
y=add(x);//结果是2,先调用上面add 
add=function(n){n=n+3;return n;}; 
z=add(x);//结果是4,调用上面临近的这个add 
alert(y+','+z);//2,4

登入後複製

小案例2:

function aa() 
{ 
  alert("aaa"); 
  return function(){alert("bbb");}; 
} 
alert(aa);//不写括号,会将aa方法的整个代码显示出来 
alert(aa());//aaa,function(){alert("bbb");}; aaa就不解释了,后面那一串是作为aa()的返回值显示 
alert(aa()());//aaa,bbb,undefined 
//下面分解上面这句进行解释 
var s=aa();//aaa 
alert(s());//s()就是function(){alert("bbb");};首先弹出bbb,其次该方法没有返回值,故弹出undefined

登入後複製

希望本文所述對大家的javascript程式設計有所幫助。

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板