---

---

【TypeScript】コールバックAPIの実装をPromiseで再定義

投稿日：2021年4月24日

この記事ではコールバックAPIの実装をPromiseでラップする方法について、実践のコードを交えて詳しく解説しています。

---

はじめに

この記事について

環境について

{
  "compilerOptions": {
    "target": "ES2015",
    "module": "ESNext",
    "lib": ["ES2018", "DOM"],
    "strict": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true
  }
}

---

Promise関数の作成

/**
 * 現在の位置を取得するブラウザAPIの呼び出し（ Promise ）
 */
const getCurrentPositionAsPromise = (): Promise<GeolocationPosition> => {
  const promise = new Promise<GeolocationPosition>((resolve, reject) => {
    navigator.geolocation.getCurrentPosition(
      (success) => {
        resolve(success);
      },
      (error) => {
        reject(error);
      }
    );
  });
  return promise;
};

// サンプル実行
getCurrentPositionAsPromise()
  .then((value) => {
    const latLng = {
      lat: value.coords.latitude,
      lng: value.coords.longitude,
    };
    console.log(latLng);
  })
  .catch((err) => {
    alert(err);
  });

---

---

---