您好,登錄后才能下訂單哦!
為什么停止使用JavaScript IIFE!,針對(duì)這個(gè)問(wèn)題,這篇文章詳細(xì)介紹了相對(duì)應(yīng)的分析和解答,希望可以幫助更多想解決這個(gè)問(wèn)題的小伙伴找到更簡(jiǎn)單易行的方法。
JavaScript語(yǔ)言中,IIFE代表立即調(diào)用函數(shù)表達(dá)式,它是一個(gè)定義后即刻執(zhí)行的函數(shù)。
為什么我說(shuō)別再在代碼中編寫(xiě)IIFE了?本文將給你答案。
可以在JavaScript中定義Block-Scoped 變量
以ES6作為標(biāo)準(zhǔn)發(fā)布,你可以使用let和const聲明塊級(jí)作用域的變量和常量。它還引入了獨(dú)立塊,可以將變量和常量隔離到外部無(wú)法使用的自身塊中。
例如,可以寫(xiě):
{ let x = 1;}
那么x對(duì)外不可用。
這要比以下代碼清晰許多:
(()=>{ let x = 1; })();
現(xiàn)如今,幾乎所有瀏覽器都支持ES6,停止使用IIFE能將變量從外部分離。
另一種隔離變量的方法是使用模塊,它也得到廣泛支持。只要不將其導(dǎo)出,其他模塊就無(wú)法使用。
不再需要閉包
閉包是返回另一個(gè)函數(shù)的函數(shù)。返回的函數(shù)能夠運(yùn)行在其外部的代碼,但內(nèi)部的代碼則由閉包函數(shù)運(yùn)行。
例如,它可能會(huì)產(chǎn)生:
const id = (() => { let count = 0; return () => { ++count; return `id_${count}`; }; })();
而既有了塊和模塊以隔離數(shù)據(jù),上述函數(shù)就變得更加復(fù)雜和不必要了。
可以將所有函數(shù)放入其自身模塊,這樣就不必?fù)?dān)心暴露數(shù)據(jù)了,但這也會(huì)產(chǎn)生副作用。由于不是純函數(shù),很難對(duì)其進(jìn)行測(cè)試。
在可以避免嵌套的時(shí)候,返回函數(shù)的函數(shù)也會(huì)引入嵌套,所以它比沒(méi)有返回函數(shù)的函數(shù)更易混淆。用模塊代替是最好的方法。使用模塊可以編寫(xiě):
let count = 0;export const id =() => { ++this.count; return `id_${count}` }
上面代碼中,有相同的count聲明且導(dǎo)出了id函數(shù),以供其他模塊使用。這像IIFE一樣,隱藏了count并暴露出我們想要的函數(shù),但是嵌套較少,不需要定義另一個(gè)函數(shù)來(lái)運(yùn)行它。
別名變量
同樣,寫(xiě)如下內(nèi)容:
window.$ = function foo() { // ... };(function($) { // ... })(jQuery);
使用模塊就可以編寫(xiě),為何還要僅為給變量創(chuàng)建別名而編寫(xiě)IIFE?利用模塊,可以導(dǎo)入不同名稱(chēng)的內(nèi)容。
你可以這樣為變量創(chuàng)建別名的編寫(xiě)方式:
import { $ as jQuery } from"jquery";const $ = () => {};
此外,不要給窗口對(duì)象添加新屬性,這會(huì)影響全局作用域。
捕捉全局對(duì)象
使用globalThis,就不必?fù)?dān)心不同作用域中全局對(duì)象的名稱(chēng)問(wèn)題,它正在成為一種標(biāo)準(zhǔn)。無(wú)需再使用IIFE以捕獲全局對(duì)象,你可以在區(qū)域頂級(jí)編寫(xiě)如下內(nèi)容:
(function(global) { // ... })(this);
甚至即使在“globalThis”之前,編寫(xiě)如下內(nèi)容設(shè)置全局對(duì)象也不太難:
const globalObj = self || window|| global;
或者如果想更精確,可以寫(xiě):
const getGlobal = () => { if (typeof self !== 'undefined') {return self; } if (typeof window !== 'undefined') {return window; } if (typeof global !== 'undefined') {return global; } throw new Error('unable to locateglobal object'); };
不必通過(guò)IIFE添加額外函數(shù)調(diào)用和引入嵌套。
優(yōu)化壓縮
應(yīng)用JavaScript模塊,就不必用IIFE隔離代碼,這可以適當(dāng)?shù)貕嚎s文件。
網(wǎng)絡(luò)包、瀏覽、包裹、匯總等(Webpack、Browserify、Parcel、Rollup等程序),都可以正確處理模塊,為何不用這些程序來(lái)創(chuàng)建更清晰的代碼。
在代碼中編寫(xiě)IIFE了已經(jīng)過(guò)時(shí)了,它還增加了額外的函數(shù)定義和嵌套。2020年,請(qǐng)選擇使用模塊和塊來(lái)分離代碼!
關(guān)于為什么停止使用JavaScript IIFE!問(wèn)題的解答就分享到這里了,希望以上內(nèi)容可以對(duì)大家有一定的幫助,如果你還有很多疑惑沒(méi)有解開(kāi),可以關(guān)注億速云行業(yè)資訊頻道了解更多相關(guān)知識(shí)。
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀(guān)點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。