1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

JavascriptでCurry化したときの非同期処理

Last updated at Posted at 2020-05-10

ちょっとハマったのでqiitaに書いて、同じところでハマった人の一助になれれば幸いです。
表題のとおり、関数をcurry化させてそのなかで非同期処理を書いたときの内容です。

下記の通り、curry化の2つ目の関数に非同期処理を書いた場合は、問題なく実装できました。

const hoge = (bar) => {
  return async (foo) => {
    const fuga = await new Promise((resolve, reject) => {
      setTimeout(() => {
        resolve(foo)
      }, 1000);
    })
    console.log(fuga)
  }
}
hoge('ichiro')('matsui')

この書き方で1つ目の関数で非同期処理がある場合、こう書けばいいと思ったのがエラーになってしまいます。

const hoge = async (bar) => {
  const fuga = await new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve(bar)
    }, 1000);
  });
  console.log(fuga)
  return (foo) => {
    console.log(foo)
  }
}
hoge('ichiro')('matsui')
エラー内容
Uncaught TypeError: hoge(...) is not a function 

どうしたものかとハマってしまいました。

こう書こう

const player = async () => {
  const hoge = async (bar) => {
    const fuga = await new Promise((resolve, reject) => {
      setTimeout(() => {
        resolve(bar)
      }, 1000);
    });
    console.log(fuga)
    return (foo) => {
      console.log(foo)
    }
  }
  const piyo = await hoge('ichiro')
  piyo('matsui') 
}

player()

このように非同期処理した結果を変数で受け取ってから2つ目の関数を書く。
これでエラーなく実装できました。

1
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?