JS匿名函數理解


匿名函數的基本形式為(function(){...})();
前面的括號包含函數體,后面的括號 就是給匿名函數傳遞參數並立即執行之
匿名函數的作用是 避免全局變量的污染以及函數名的沖突
 
1.小括號的作用
小括號能把我們的表達式組合分塊,並且每一塊,也就是每一對小括號,都有一個返回值。這個返回值實際上也就是小括號中表達式的返回值。所以,當我們用一對小括號把匿名函數括起來的時候,實際上小括號對返回的,就是一個匿名函數的Function 對象。因此,小括號對加上匿名函數就如同有名字的函數般被我們取得它的引用位置了。所以如果在這個引用變量后面再加上參數列表,就會實現普通函數的調用形式。
簡單來說就是小括號有返回值,也就是小括號內的函數或者表達式的返回值,所以說小括號內的function返回值等於小括號的返回值
 
2.匿名函數的寫法
 
方式1,調用函數,得到返回值。強制運算符使函數調用執行
(function(x,y){
alert(x+y);
return x+y;
}(3,4)); 
 
方式2,調用函數,得到返回值。強制函數直接量執行再返回一個引用,引用再去調用執行
(function(x,y){
alert(x+y);
return x+y;
})(3,4); 
這種方式也是很多庫愛用的調用方式,如jQuery,Mootools。
 
方式3,使用void
void function(x) {
x = x-1;
alert(x);
}(9);
 
方式4,使用-/+運算符
-function(x,y){
alert(x+y);
return x+y;
}(3,4);
+function(x,y){
alert(x+y);
return x+y;
}(3,4);
--function(x,y){
alert(x+y);
return x+y;
}(3,4);
++function(x,y){
alert(x+y);
return x+y;
}(3,4); 
 
方式5,使用波浪符(~)
~function(x, y) {
alert(x+y);
return x+y;
}(3, 4); 
 
方式6,匿名函數執行放在中括號內
[function(){
console.log(this// 瀏覽器得控制台輸出window
}(this)] 
 
方式7,匿名函數前加typeof
typeof function(){
console.log(this// 瀏覽器得控制台輸出window
}(this
 
方式8,匿名函數前加delete
delete function(){
console.log(this// 瀏覽器得控制台輸出window
}(this
 
方式9,匿名函數前加void
void function(){
console.log(this// 瀏覽器得控制台輸出window
}(this
 
方式10,使用new方式,傳參
new function(win){
console.log(win) // window
}(this
 
方式11,使用new,不傳參
new function(){
console.log(this// 這里的this就不是window了
 
方式12,逗號運算符
 function(){
console.log(this// window
}(); 
 
方式13,按位異或運算符
^function(){
console.log(this// window
}(); 
 
方式14,比較運算符
function(){
console.log(this// window
}(); 
 
最后看看錯誤的調用方式
function(x,y){
alert(x+y);
return x+y;
}(3,4); 
匿名函數的N種寫法如下所示
匿名函數沒有實際名字,也沒有指針,怎么執行?
關於匿名函數寫法,很發散~ 
+號是讓函數聲明轉換為函數表達式。匯總一下
最常見的用法: 
代碼如下:
(function() { 
alert('water'); 
})(); 
當然也可以帶參數: 
代碼如下:
(function(o) { 
alert(o); 
})('water'); 
想用匿名函數的鏈式調用?很簡單: 
代碼如下:
(function(o) { 
console.log(o); 
return arguments.callee; 
})('water')('down'); 
常見的匿名函數都知道了,看看不常見的: 
代碼如下:
~(function(){ 
alert('water'); 
})();//寫法有點酷~ 
代碼如下:
void function(){ 
alert('water'); 
}();//據說效率最高~ 
代碼如下:
+function(){ 
alert('water'); 
}(); 
代碼如下:
-function(){ 
alert('water'); 
}();
代碼如下:
~function(){ 
alert('water'); 
}();
 
代碼如下:
!function(){ 
alert('water'); 
}(); 
 
代碼如下:
(function(){ 
alert('water'); 
}());//有點強制執行的味道~
 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM