IIFE(立即執行函數表達式)

来源:http://www.cnblogs.com/liuyongjia/archive/2017/11/25/7896923.html
-Advertisement-
Play Games

我們經常會看到這樣的寫法: 這就是一個簡單的IIFE(立即執行函數表達式,immediately invoked function expression)了。 這樣的寫法有什麼好處呢?來簡單分析一下。 1. 開頭的分號 我們都知道,js是可以加分號或者不加分號的,在某些情況下,不加分號會讓解析器解析 ...


我們經常會看到這樣的寫法:

;(fuction () {
    // do something
})()

這就是一個簡單的IIFE(立即執行函數表達式,immediately-invoked function expression)了。

這樣的寫法有什麼好處呢?來簡單分析一下。

1. 開頭的分號

我們都知道,js是可以加分號或者不加分號的,在某些情況下,不加分號會讓解析器解析出錯,舉個例子:

var 
    a = 0
    , b = 0
;
a = b + 3
(b = a)
// Uncaught TypeError: 3 is not a function

解析代碼的時候,a = b + 3和(b = a)這兩條語句之間沒有明確的分界,回車和空格會自動被忽略。解析器會認為這是一句。所以,此時會認為3是一個函數,b=a是他的參數。
在知乎的這個問題下,尤大做瞭解釋。

真正會導致上下行解析出問題的 token 有 5 個:括弧,方括弧,正則開頭的斜杠,加號,減號。我還從沒見過實際代碼中用正則、加號、減號作為行首的情況,所以總結下來就是一句話:一行開頭是括弧或者方括弧的時候加上分號就可以了,其他時候全部不需要。其實即使是這兩種情況,在實際代碼中也頗為少見。

ok,回到我們的例子,我們的例子就是以括弧開頭的,如果上一個語句沒有加分號,很可能會出現這樣問題,這個分號就是為了防止這樣的情況發生,稱之為防禦性分號。

2. function(){}

函數有兩種聲明方式:

function foo () {}
var foo = function () {}

這兩種聲明方式的不同之處在於,使用var聲明的函數不會自動提升到頂部。也就是說,不能在var聲明函數的語句之前調用函數,否則會拋出undefined的錯誤。
function () {}這種形式被稱為匿名函數。匿名函數沒有名字,也就是沒有指針,是無法在其他地方調用的。
將匿名函數賦值給foo,則可以通過foo來調用。
當然還有辦法調用它,就是例子中的兩對括弧。第一對括弧將匿名函數包裝成了一個表達式,而第二對括弧意思就是立即執行它。

function () {console.log('a')} // 報錯 Uncaught SyntaxError: Unexpected token (
(function () {console.log('a')}) // 返回函數定義 ƒ () {console.log('a')},沒有log
(function () {console.log('a')})() // a
function foo() {console.log('a')}() // 報錯 Uncaught SyntaxError: Unexpected token )

第一行,因為不是合法的聲明方式,希望找到函數名的地方是‘(’,所以拋出了該異常。
第二行,()中的語句被當成了表達式,解析器會認為是var聲明的方式。
第三行,自執行。
第四行,function foo() {console.log('a')}是正確的函數聲明方式,被正確解析。接下來的一對括弧依次解析,括弧里需要有表達式,但是沒有,所以會拋出這樣的異常。

3. 好處

IIFE的好處就是不會污染全局變數,就在當前的函數體的作用域下進行操作,保證了父作用域的乾凈,如果return出一些函數,那這些函數就形成了閉包。
我們常用IIFE來寫module。

var counter = (function(){
  var i = 0;

  return {
    get: function(){
      return i;
    },
    set: function( val ){
      i = val;
    },
    increment: function() {
      return ++i;
    }
  };
})()

Refer:

  1. 維基百科:立即調用函數表達式
  2. 知乎:JavaScript 語句後應該加分號麽?

您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 配套視頻詳解 繼承子類與父類的關係 繼承子類與父類的關係代碼演示 繼承方法的覆蓋 方法覆蓋原則 一、繼承編寫過程 二、子類可以繼承父類當中哪些內容 可以自行把修飾符換下, 然後查看子類能不能訪問 詳細演示在視頻當中 三、方法覆蓋 四、方法覆蓋原則 五、判斷方法是否是覆蓋 六、什麼時候使用覆蓋 七、方 ...
  • 配套詳解視頻 繼承思想 繼承extends 一、引出繼承 二、什麼是繼承 從已有類中,派生出新的類,新的類中吸收已有類當中的狀態和行為,並能擴展出新的能力。 Java繼承是使用已有類作為基礎,建立新的類。 三、如何表示繼承 代碼-軟體在群文件共用當中 ...
  • 個人覺得,比如登錄的時候一般都會用session持久化保證登錄時間,你在session過期之前的這段時間訪問或者說有刷新的話,它就會從你當前刷新訪問的時間開始計算過期時間,如果沒有動作的話,到了過期時間網頁就自動退出登錄了;而保持到資料庫就是為了輔助完成驗證功能; ...
  • 使用jdbcTemplate 原理是把載入驅動Class.forName("com.mysql.jdbc.Driver"); 和連接資料庫Connection conn=DriverManager.getConnection("jdbc:mysql://localhost:3306/sw_datab ...
  • ...
  • 1、cookie和session cookie可以單獨工作 cookie也可以和session配合來用 每一個瀏覽器都會有一個cookie:{} 瀏覽器第一次訪問伺服器的時候cookie是空的 伺服器需要讓客戶端保存一些數據cookie {"sessionID":"隨機字元串"},當下次請求的時候就 ...
  • 這個是我對面向對象的理解,理解有誤請噴我吧!菜鳥一枚! 用最簡單的方式,去辦最複雜的是,看字面意思理解面向對象,就是先要面向找到需要面向的東西,把所要面向的東西抽象出來,封裝在一個盒子中組成一個對象。而這個東西可以是對象的屬性,對象的行為特征等。所以面向對象在我看來就是將所要表示的具有相同對象的屬性 ...
  • 其實在平常的一些佈局中也經常有要實現元素的垂直居中和水平居中的的需要,下麵來寫幾種css/css3實現的未知寬高元素的水平和垂直居中的寫法 ps:不考慮相容問題(下次會寫js實現元素的水平and垂直居中 ) 第一種 css3的transform 第二種 flex盒子佈局 第三種 display的ta ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...