匿名函數的基本形式為(function(){...})();
前面的括號包含函數體,後面的括號就是給匿名函數傳遞參數並立即執行之
匿名函數的作用是避免全局變量的汙染以及函數名的沖突
無論妳在什麽時候讀代碼,您都必須註意到匿名函數。有時它們被稱為 lambda,有時是匿名函數,不管怎樣,我認為他們是不好使用的。
如果妳不知道匿名函數是什麽,這裏有壹個引語:
匿名函數是壹種在運行時動態聲明的函數。它們之所以被稱為匿名函數是因為不同於普通函數,它們並沒有函數名 。 — Helen Emerson, Helephant.com
匿名函數形式如下:
function () { ... code ... }
OR
(args) => { ... code .. }我今天嘗試讓大家理解通常情況下只有在絕對需要的情況下才使用匿名函數的想法。匿名函數不應該是首選,而且應該知道原因情況下使用。當理解這種想法之後,妳的代碼會變得更簡潔,更容易維護,並且更容易跟蹤bug。先從避免使用匿名函數的三個理由開始:
妳寫代碼的時候, 無論妳多麽擅長敲代碼, 總是會碰到錯誤。有時候,這些錯誤很容易被查出,有時候並不容易。
如果妳知道這些錯誤來自哪裏,那麽錯誤很容易會被查出來。為了查出錯誤,我們使用這個被叫做堆棧軌跡的工具。如果妳不了解 堆棧軌跡 ,goole給出了很棒的介紹。
假設現在有壹個非常簡單的工程:
function start () {
(function middle () {
(function end () {
console.lg('test');
})()
})()
}上面代碼裏面有壹個非常愚蠢的錯誤,拼寫錯誤(console.log)。在小工程裏面,這個拼寫錯誤不是什麽大問題。 如果這是壹個有非常多模塊非常大的工程的壹小段,問題就大了。假設這個愚蠢的錯誤不是妳犯的,那麽新來的初級工程師將會在他休假之前把這個錯誤提交到代碼庫!
現在,我們必須追查。 使用我們精心命名的函數, 我們得到如下的堆棧跟蹤:
謝謝妳命名妳的函數 ,初級開發者們! 現在我們可以輕松地追蹤到這個bug。
但是..壹旦我們解決了這個問題, 就會發現 還有另壹個bug。 這次是壹位更資深的開發人員介紹的。這個人知道 lambdas
結果他們偶然發現了壹個bug,我們的工作就是追蹤它。
下面是代碼:
(function () {
(function () {
(function () {
console.lg('test');
})();
})();
})();吃不吃驚,這名開發者也忘記了如何拼寫console.log了!這也太巧合了吧!令人感到遺憾的是,他們都沒有命名他們的函數。
那麽控制臺會輸出什麽呢?
好吧,我們至少還有行號,對吧?在這個例子中,看起來我們有大約7行代碼。如果我們處理壹大段代碼會如何呢?比如壹萬行代碼?行號的跨度如此之大該怎麽辦呢?如果代碼被折疊後有沒有壹個代碼地圖文件,那麽對行號的渲染是不是根本就是沒有什麽用了呢?
我想對這些問題的回答相當簡單,答案就是:想這些會讓妳壹整天都會過的相當糟心。
可讀性
咦,我聽說妳還不信。妳仍舊對妳的匿名函數戀戀不舍,並且還從未發生過bug。那麽我得向妳道歉,妳認為妳的代碼是完美的。讓我們看看這個!
看看下面兩段代碼:
function initiate (arguments) {
return new Promise((resolve, reject) => {
try {
if (arguments) {
return resolve(true);
}
return resolve(false);
} catch (e) {
reject(e);
}
});
}
initiate(true)
.then(res => {
if (res) {
doSomethingElse();
} else {
doSomething();
}
).catch(e => {
logError(e.message);
restartApp();
}
);這是壹個非常不正常的例子,但是我相信妳已經明白我要說什麽 了。我們的方法返回了壹個promise,我們用這個promise對象/方法處理不同可能的 響應。
妳也許會認為幾段代碼讀起來並不難,但我認為它們可以變得更好!
如果我們去掉所有的匿名函數會怎樣呢?
function initiate (arguments) {
return new Promise(checkForArguments);
}
function checkForArguments (resolve, reject) {
try {
if (arguments) {
return resolve(true);
}
return resolve(false);
} catch (e) {
reject(e);
}
}
function evaluateRes (res) {
if (res) {
doSomethingElse();
} else {
doSomething();
}
}
function handleError (e) {
logError(e.message);
restartApp();
}
initiate(true)
.then(evaluateRes)
.catch(handleError);好,先講清楚:這部分代碼更長,但我認為其不僅僅是有更多的可讀性!我們精心命名的函數與匿名函數不壹樣,只要我們壹看到它們的名字就知道它們的功能是什麽。這避免了在評估代碼時的障礙。
這也有助於分清楚其中的關系。與創建壹個方法、將其傳遞、然後運行邏輯不同,在第二個例子中的參數被給到了then,catch只是指向了發生所有事情的函數。
關於更具有可讀性,我沒有什麽再能說服妳的了。但是也許妳還沒被說服的話,我可以試壹下最後的論據。