0
0

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 1 year has passed since last update.

javascriptで既存の同期関数を非同期で実行させたい

Posted at

やりたいこと

関数A (重い)

関数B (軽い)

同期処理を上から順に実行していたが、ABに順序性はなくAは非同期でもいいと気づいた。

非同期の関数を作るとかではなく、いかにシンプルに非同期にできるかに重点を置いて考えてみた。

既存の処理例

main.js
// 重い処理
function heavy() {
  // ...
  console.log('heavy');
}

// 軽い処理
function light() {
  console.log('light');
}

// メイン
function main() {
  heavy();
  light();
}

// 実行
main();

実行結果は当たり前だが以下の通り

実行結果.
heavy
light

改善案

main.js
// 重い処理
function heavy() {
  // ...
  console.log('heavy');
}

// 軽い処理
function light() {
  console.log('light');
}

// メイン
function main() {
  Promise.resolve().then(heavy);
  light();
}

// 実行
main();

実行結果は以下の通り

実行結果.
light
heavy

改善案 重い処理に引数1つ

main.js
// 重い処理
function heavy(name) {
  // ...
  console.log('heavy:', name);
}

// 軽い処理
function light() {
  console.log('light');
}

// メイン
function main() {
  Promise.resolve("tanaka").then(heavy);
  light();
}

// 実行
main();

実行結果は以下の通り

実行結果.
light
heavy: tanaka

改善案 重い処理に引数複数

main.js
// 重い処理
function heavy(name, age) {
  // ...
  console.log('heavy:', name, age);
}

// 軽い処理
function light() {
  console.log('light');
}

// メイン
function main() {
  Promise.resolve(["tanaka", 20]).then(arg => heavy(...arg));
  light();
}

// 実行
main();

実行結果は以下の通り

実行結果.
light
heavy: tanaka 20

感想

もっといい方法、スマートな方法あれば教えてください。

0
0
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
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?