鍍金池/ 問答/網(wǎng)絡(luò)安全  HTML/ 看Vue源碼，有兩段代碼寫法不知是何意思，求指教~

看Vue源碼，有兩段代碼寫法不知是何意思，求指教~

最近在看Vue源碼，大多數(shù)代碼查查都能看懂，以下幾段代碼有點(diǎn)不知所措，求大神指導(dǎo)批評~

第一段

這是在 stateMixin 方法中的，以下代碼被大括號包裹。

{
    dataDef.set = function (newData) {
      warn(
        'Avoid replacing instance root $data. ' +
        'Use nested data properties instead.',
        this
      );
    };
    propsDef.set = function () {
      warn("$props is readonly.", this);
    };
}

第二段

就是Vue開頭的那段代碼，括號套的我都快暈了。(function(){ ... })的作用是什么呢，而在function(){ ... }之后直接傳入?yún)?shù)(this, (function ...))是為何呢？

(function (global, factory) {
    typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
    typeof define === 'function' && define.amd ? define(factory) :
    (global.Vue = factory());
}(this, (function () { 'use strict';

})))

不止是Vue源碼，其他源碼的開頭好像也都是這么寫的，這是一種什么樣的寫法呢？

回答
編輯回答
忘了我
  1. 一般是為了隔離作用域，或者是給代碼劃分出明顯的邊界，提示代碼讀者“這里是一整塊”。
  2. 這是用來封裝模塊的。兼容三種模式：exports(CommonJS)、define(AMD)、global(全局)，依次判斷當(dāng)前引用是哪種方式，用適當(dāng)?shù)姆绞綄?dǎo)出當(dāng)前模塊。
2017年1月18日 08:53
編輯回答
我不懂

第一個(gè)問題：

你看的代碼是編譯后的，一個(gè)if條件判斷在編譯過程中被去掉了，源碼是這樣的：

編譯前的代碼

第二個(gè)問題：

就是IIFE（立即執(zhí)行函數(shù)）啦。

如果你想要聲明一個(gè)函數(shù)并且立即執(zhí)行，使用function(){/*do something*/}()這種形式是不行的，因?yàn)榇罄ㄌ柎碚Z句塊的結(jié)束，后面的圓括號會被認(rèn)為是下一行的內(nèi)容，需要使用(function(){})()或者(function(){}())的形式。

至于為什么要使用IIFE而不是直接寫代碼呢？是因?yàn)檫^去前端沒有模塊系統(tǒng)，使用script標(biāo)簽引入的js腳本共享同一個(gè)作用域，如果不把代碼包起來，很容易產(chǎn)生作用域污染、變量沖突的問題。

傳this而不是直接使用window是出于兼容的考慮，因?yàn)閖s不僅僅在瀏覽器中運(yùn)行，所以全局變量不一定是window，所以通過傳入全局作用域中的this來適應(yīng)不同的全局變量。

回答的很簡略、很粗糙，沒什么參考價(jià)值，想要了解更多最好去看標(biāo)準(zhǔn)。

2018年5月9日 22:57
編輯回答
枕頭人

第一段，關(guān)鍵字 塊級作用域 ,不過去github 上看了，應(yīng)該沒有特別的作用，只是用來分隔下代碼
第二段，關(guān)鍵字 立即執(zhí)行 函數(shù)

2018年7月8日 01:52