2025年に追加されたJavaScriptのPromise.try機能：エラー処理をもっと簡単に！

最近はES2025の文法を色々と見ているものです。
JSが今後目指してることと、どこに活用できるのか考えることで色々と勉強になりますね~

↓前回の記事

今回はPromise.tryという新しい機能についてみていきます。同期と非同期のエラー処理を統一する画期的な機能です！

従来の面倒なエラー処理

これまで、JavaScriptでエラー処理を書く時は同期処理と非同期処理で異なる方法を使う必要がありました。

同期処理のエラー処理

// データをパースする同期処理
try {
  const data = JSON.parse(jsonText);
  console.log(data);
} catch (error) {
  console.error('パースエラー:', error);
}

非同期処理のエラー処理

// APIからデータを取得する非同期処理
fetch('/api/data')
  .then(response => response.json())
  .then(data => console.log(data))
  .catch(error => console.error('取得エラー:', error));

「この関数、同期？非同期？」問題

実際の開発では、関数が同期的に動くか非同期的に動くかわからないケースがよくあります。
違ったやり方を取ろうとも、判断ができないときは困りますよね。

例えば、キャッシュ機能を持つデータ取得関数のことを考えてみましょう。

function getUserData(userId) {
  // キャッシュにあれば即座に返す（同期的）
  if (cache.has(userId)) {
    return cache.get(userId);
  }
  
  // キャッシュになければAPIから取得（非同期的）
  return fetch(`/api/users/${userId}`)
    .then((res) =>  {
      return res.json();
    });
}

この関数を使う際、毎回「try/catchで囲むべき？それともthen/catchを使うべき？」と悩む必要がありました。

これまでの解決策は、以下のように常にPromiseを返すように統一することでした。

function getUserData(userId) {
  if (cache.has(userId)) {
    // 同期的な値もPromiseでラップ
    return Promise.resolve(cache.get(userId));
  }
  
  return fetch(`/api/users/${userId}`)
    .then((res) =>  {
      return res.json();
    });
}

Promise.tryはシンプル

Promise.tryを使えば、この問題が解決できます。

Promise.try(() => getUserData(123))
  .then(data => {
    console.log('ユーザーデータ:', data);
  })
  .catch(error => {
    console.error('エラー発生:', error);
  });

Promise.tryの便利な点は、

• 関数が同期でも非同期でも、常にPromiseとして扱える
• エラー処理が.catchに統一される
• コードの見通しが良くなる

読みやすすぎる！

実践的な使用例

設定ファイルの読み込み

// 同期的な読み込みかもしれないし、非同期的な読み込みかもしれない
Promise.try(() => loadConfig())
  .then(config => {
    // 設定を使用
    initializeApp(config);
  })
  .catch(error => {
    console.error('設定の読み込みに失敗:', error);
    // デフォルト設定を使用
    initializeApp(defaultConfig);
  });

フォームの送信処理

// バリデーションは同期的、APIコールは非同期的
Promise.try(() => {
  validateForm(formData);  // エラーを投げる可能性がある同期処理
  return submitToAPI(formData);  // 非同期処理
})
.then(result => {
  showSuccessMessage('送信成功');
})
.catch(error => {
  showErrorMessage('エラー: ' + error.message);
});

Promiseを普段使わない人にも

「Promiseは難しそう」と思っている方も、Promise.tryは気軽に使えます。

以下のような「try/catchのPromise版」として捉えてみてください！

// これまでのtry/catch
try {
  const result = someFunction();
  // 成功時の処理
} catch (error) {
  // エラー時の処理
}

// Promise.tryを使った場合
Promise.try(() => someFunction())
  .then(result => {
    // 成功時の処理
  })
  .catch(error => {
    // エラー時の処理
  });

まとめ

私も普段あまりPromiseを頻繁に使っているわけではありませんでしたが、Promise.tryは気軽に使えるのでES2025が安定したらどんどん使っていきたいですね！