JavaScriptでAPI呼び出しが成功した後にコードを実行する方法【3つのアプローチ】（async await Promiseの使用含む）
方法1：.thenで処理を実行
この方法はAPI呼び出し後に固定された処理を実行する際に適しています。
getList() {
this.$http({
method: 'get',
url: 'http://127.0.0.1:4523/mock/430173/user/list',
params: params
}).then((response) => {
this.dataList = response.data.list;
console.log('データ検索成功！');
});
}
デメリット
処 ...
5月22日 02:04 投稿
Promiseの概要と使い方
Promise
コールバックのネスト問題
複数層のコールバック関数が入れ子になっている状態を「コールバック地獄」と呼びます。以下のコードはその例です。
setTimeout(() => { // 第1層のコールバック
console.log('1秒後に出力');
setTimeout(() => { // 第2層のコールバック
console.log('さらに2秒後に出力');
setTimeout(() => { // 第3層のコールバ ...
5月19日 18:12 投稿
AJAXにおける非同期処理の基本概念と応用
同期処理と非同期処理
同期処理はコードを順次実行し、結果を待ってから次の処理に進みます。非同期処理は実行後に結果を待たず、後続のコードを継続実行し、将来完了時にコールバック関数で結果を返します。
const total = 5 + 3;
console.log(total); // 8
setTimeout(() => {
console.log('非同期処理完了');
}, 1000);
document.querySelector('#submit').addEvent ...
5月16日 21:50 投稿
async/awaitの高度な活用方法
async/awaitと高階関数
配列内の要素に対して非同期処理を実行する必要がある場合、async/awaitとmapやfilterなどの高階関数を組み合わせることで、効率的な実装が可能になります。
// 非同期フィルター関数
async function asyncFilter(collection, predicate) {
const results = await Promise.all(collection.map(predicate));
return collection.filter((_item ...
5月13日 15:29 投稿