88539


引数の括弧が3つある下記のような関数を見かけたのですが、これはどのような時に使用されるのでしょうか。  
なぜ通常の `const hoge =(h1, h2) => {}` という書き方との違いはなんでしょうか。  
何も出力されないです。

[code]

    const hoge = (h1) => (h2) => () => {
        console.log(h1);
        console.log(h2);
    }
    
    hoge('わたしは')('さるだ')
    
    // 実行結果
    
    
[/code]


CC BY-SA 4.0
2022-04-27T16:11:21.497
88533
2022-04-28T02:44:02.223
22565
question
javascript typescript
TypeScriptで引数のかっこが3つある関数


アロー関数が３つ並んでいるので関数が３つ定義されているだけです。

ES5に適用させると以下のようになります

[code]

    var hoge = function hoge(h1) {
      return function (h2) {
        return function () {
          console.log(h1);
          console.log(h2);
        };
      };
    };
    
[/code]

もとのソースコードはわからないですが、何らかの関数を連続して呼び出して処理したいのでしょう。

アロー関数がわからなければ、  
babelのオンライン変換を用いて、ES5に変換して確認してみるとよいでしょう。  
<https://babeljs.io/repl/>


CC BY-SA 4.0
2022-04-28T01:41:20.360
88536
2022-04-28T01:41:20.360
22665
88533
answer


`const hoge = (h1, h2) => { ほにゃらら }` では「引数を 2 つ受け取って実行結果を返す関数」が定義されますが、`const
hoge = (h1) => (h2) => { ほにゃらら }` では「引数を 1 つ受け取って、『引数を 1
つ受け取って実行結果を返す関数』を返す関数」が定義されます。

たとえば `h1` を固定した上で `h2` を色々変化させて実行したくなったときにはこのような実装にしたくなる場合があります。つまり `const
fuga = hoge('わたしは')` と代入してしまって `fuga('さるだ')` とか `fuga('ひとだ')`
とか実行する場合です。`hoge` がとても抽象的な関数になっている場合で分かりやすさを得られることがあります。`h2`
まで含めて関数呼び出ししないと「ほにゃらら」部分が評価されない（実行されない）という性質をうまく使っています。

また、今回の質問に載っている関数は、更にもう 1 つネストして `const hoge = (h1) => (h2) => () => { ほにゃらら }`
という形になっています。このため関数呼び出しを 3 回やらないと「ほにゃらら」部分は評価されません。このため `hoge('わたしは')('さるだ')`
だけではコンソールログに出力されなくて、`hoge('わたしは')('さるだ')()` までやらないといけません。


CC BY-SA 4.0
2022-04-28T02:44:02.223
88539
2022-04-28T02:44:02.223
19110
88533
answer