此鏈接的ES6箭頭功能是什么？

Question

我正在使用React，Redux創建一個應用程序。

其中，我正在制作Redux中間件，

有一部分我不理解。

這是代碼：

const loggerMiddleware = store => next => action => {

    console.log('currentState', store.getState());

    console.log('action', action);

    const result = next(action);

    console.log(', store.getState());
    console.log('\n'); 

    return result;
}

export default loggerMiddleware; 

什么是箭頭功能=> => => ？ 箭頭功能繼續沒有意義。

這意味着什么？

Answer 1

下面的代碼：

const loggerMiddleware = store => next => action => { 
    var result = /* .. */
    return result;
}

等價於：

const loggerMiddleware =  function(store) { 
    return function(next) {
        return function(action) {
            return result;
        }
    }
}

Answer 2

這是一種技術（稱為“ currying”），它取代了一個帶有多個自變量的函數，每個函數都帶有一部分自變量，例如：

  const f1 = (x, b) => x + b; const f2 = x => b => x + b; const f1Result = f1(1, 2); // we can construct f2's result in multiple steps if we want because it returns a function, this can be helpful. let f2Result = f2(1); f2Result = f2Result(2); console.log('f1Result', f1Result); console.log('f2Result', f2Result); 

您也可以閱讀以下內容，以更深入地了解此決策的原理，主要是：

有時我們想將某些本地狀態與store和next相關聯

Answer 3

Javascript箭頭函數替代了8個字符的“函數”關鍵字。 使用箭頭功能時，無需在函數內編寫return。

根據Javascript的最佳做法，嘗試在進行服務調用時使用。 用作功能關鍵字的簡寫。

有關更多信息，請參見此鏈接上的一個很好的示例https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions