首頁 > web前端 > js教程 > JS匿名函數與匿名自執行函數概念與用法分析

JS匿名函數與匿名自執行函數概念與用法分析

亚连
發布: 2018-05-29 17:14:18
原創
1404 人瀏覽過

這篇文章主要介紹了JS匿名函數和匿名自執行函數概念與用法,結合實例形式分析了匿名函數和匿名自執行函數的概念、功能、應用場景及相關使用技巧,需要的朋友可以參考下

本文實例講述了JS匿名函數和匿名自執行函數概念與用法。分享給大家供大家參考,具體如下:

1. 匿名函數的常見場景

js中的匿名函數是一種很常見的函數類型,比較常見的場景:

<input type="button" value="点击" id="btn">
<script type="text/javascript">
  //匿名函数的第一种情形
  var btn=document.querySelector("#btn");
  btn.onclick=function(){
    // alert("aaaaa");
  }
  //匿名函数的第二种情形
  setInterval(function(){
    // alert("bbbbb");
  }, 1000);
  //匿名函数的第三种情形
  var fun=function(){
    alert("ccccc");
  }
  // fun();
  //匿名函数的第四种情形
  var obj={
    name:"dddd",
    say:function(){
      alert(this.name);
    }
  }
  obj.say();
</script>
登入後複製

上面展示的就是常見的匿名函數的使用場景。 (注意:querySelector是H5中新增的查找dom元素的方法)

2. 匿名自執行函數

見名思義,匿名自執行函數首先是一個匿名函數,但是這個函數是可以自己自動執行的,不需要藉助其他的元素。

<input type="button" value="点击" id="btn">
<script type="text/javascript">
//1,匿名函数的第一种实现方式
(function(data){
  // alert(data);
})("eee");
//2.匿名自执行函数的第二种实现方式
(function(){
  // alert("fff");
}());
//3.匿名自执行函数的第三种实现方式
!function(data){
  // alert(data);
}("hhh");
//4.匿名自执行函数的第四种实现方式
var fun=function(data){
  alert(data);
}("iii");
登入後複製

從上面的程式碼區塊我們可以總結實現匿名自執行函數的方法一般有四種。

3. 匿名自執行函數的作用

①. 匿名自執行函數最常見的作用是用來實作閉包的情況。關於閉包的概念我會在後面的文章中詳細介紹。這裡簡單說明一下閉包。 閉包:閉包是js的一種特性,我們可以透過閉包實現函數內部外部的連接,並且可以使得函數的局部變數始終存在於記憶體中。

②. 匿名自執行函數也可以用於在js中模擬建立區塊級作用域,即如果使用匿名自執行函數將某些程式碼包起來可以實現區塊級作用域的效果,減少全域變數的數量,在匿名自執行函數執行結束後變數就會被記憶體釋放掉,因此也會節省了記憶體。

4. 匿名函數與匿名自執行函數總結

#匿名函數可以簡單理解為沒有名字的函數,常見的場景總共有4種。

匿名自執行函數可以簡單理解為可以自己執行的匿名函數,實現匿名自執行函數的方式一共有4種。

匿名自執行函數的作用就是用來閉包和建立獨立的命名空間兩個面向。

上面是我整理給大家的,希望今後對大家有幫助。

相關文章:

jQuery ajax讀取json資料並依照價格排序範例

vue 開發一個按鈕元件的範例程式碼

vue-cli腳手架-bulid下的設定檔

以上是JS匿名函數與匿名自執行函數概念與用法分析的詳細內容。更多資訊請關注PHP中文網其他相關文章!

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