JavaScriptは同期して実行されます.
これは、ブート(リフト)からコードを順番に並べます.
つまり、同期して実行します.
Hoisting,varとは,宣言された関数をコードの上部に置く.
上昇は最初に定義されることを意味します.

Callback Function

Calback Functionとは、宣言された関数のことです
あと行

console.log('1');
setTimeout(function () {
	console.log('2');
}, 1000);
console.log('3');

上記のコードの結果値は1、3、2に出力されます.
関数名settimeout
APIのため、1000 ms後に実行されます.
settimeoutのパラメータとして渡される関数は
settimeoutは、アップグレードではなく実行後に実行されます.
この実行方式をcallback関数と呼ぶ.
非同期処理関数とも呼ばれます.
ただ、このcallback関数にも同期処理の方法があります.

function printImmediately(print) {
	print();
}
printImmediately(() => console.log('Hello'));

このように書くと同期して処理できます.
各プログラミング言語でコールバック関数を処理する方法は異なります.

Callback Hell

コールバック関数を使いすぎると、
次の問題が発生する可能性があります.

毒性低下

メンテナンス困難

Promise

objectは非同期処理を簡素化するのに役立つ.
機能が正常に動作していると判断した場合は、成功した情報が表示されます.
処理された結果値を渡します.
機能が正常に機能しないと、エラーが発生します.
PromiseはJavaScriptのオブジェクトです.
非同期処理のために作成されます.

State

Promiseを作成し、指定した操作を実行している場合、
終盤に入る.
逆に、行動を成功させると、完成した状態になります.
実行できない場合やエラーが発生した場合は、拒否されます.

Producer

const promise = new Promise(resolve, reject) => {
	console.log('doing something...')
	resolve('pangho')
	// reject(new Error('no network'));
}

Promiseはクラスを作成し、作成時にコールバック関数を作成できます.
追加するには、2つのコールバック関数を受け入れます.

resolve

機能を正常に実行し、最後にデータを転送できる関数です.

reject

機能の実行中に問題が発生したときに呼び出される関数
主にErrorという名前のobjectを介してデータが伝達される.
どのようなエラーが発生した原因を明確に説明すべきである.
約束の中で、主にいくつかの重いことを処理します
主にネットワークからデータを受信します.
ファイルの読み込みは非同期で行うことが望ましい.
Promise作成時の注意事項

を生成しながらexecutorを実行
ネットワークと通信するPromiseなら
ページのロード時にネットワーク通信を開始
ユーザ要求によるネットワーク通信が必要な場合、
気をつけて.

Consumers

3つの値でデータを取得できます.

promise
	.then(value => {
		console.log(value);
	})
	.catch(error => {
		console.log(error);
	})
	.finally(() => {
		console.log('finally')
	});

then

Promiseの値が正常に実行された場合、
Promiseの解析データを受信し、指定したタスクを実行します.
機能が完了したら、Promiseに戻ります.

catch

Promiseの値が正常でない場合
Promiseが拒否したデータを受信し、指定した操作を実行します.
catchを使用しない場合、Uncautorエラーが出力されます.
このように出力されたエラーをキャプチャし、コンソールログに出力します.

finally

実行機能が成功するかどうかにかかわらず、最後にデータが出力されます.

Promise chaining

複数のPromiseを接続して書く方法です.

const fetchNumber = new Promise ((resolve, reject) => resolve(1));

fetchNumber
	.then(num => num * 2)
	.then(num => num * 3)
	.then(num => {
	return new Promise((resolve, reject) => resolve(num - 1));
	})
	.then(num => console.log(num));

そうですか.その後、データを作成してすぐに送信できます.
別の非同期Promiseを渡すこともできます.

Error Handling

const getHen = () =>
	new Promise ((resolve, reject) => {
		setTimeout(() => resoleve('🐔'), 1000;
	});
const gerEgg = () =>
	new Promise ((resolve, reject) => {
		setTimeout(() => reject(new Error(`error! ${hen} => 🥚`)), 1000;
	});
const cook = () =>
	new Promise ((resolve, reject) => {
	setTimeout(() => resoleve(`${egg} => 🍳`), 1000;
	});

getHen()
.then(getEgg)
.catch(error => {
	return '🦄';
})
.then(cook)
.then(console.log)
.catch(console.log);

エラー発生時にキャプチャされていない場合は、操作を実行できません.
うまく処理することが大切です.
上記のコードに示すように、途中でエラーが発生した場合は、置き換えてもよい.

Promise APIs

all

Promiseに渡されたデータを並列に収集できるAPIです.
作り方は以下の通り.

function delay(ms) {
	return new Promise(resolve => setTimeout(resolve, ms));
}

async function getApple() {
	await delay(1000);
	return '🍎';
}

async function getBanana() {
	await delay(1000);
	return '🍌';
}

function pickAllfruits() {
	return promise.all([getApple(), getBanana()])
	.then(fruits => fruits.join(' + '));
}

pickAllFruits().then(console.log);

リンゴとバナナがデータに送られたら
配列として受け取り、文字列に変更して出力します.

race

まずPromiseに送信したデータを出力します.

function delay(ms) {
	return new Promise(resolve => setTimeout(resolve, ms));
}

async function getApple() {
	await delay(2500);
	return '🍎';
}

async function getBanana() {
	await delay(1000);
	return '🍌';
}

function pickOnlyOne() {
	return promise.race([getApple(), getBanana()])
}

pickOnlyOne().then(console.log);

アップルとバナナはまず伝送されたデータ出力を受信する.

async, await

Promiseをより簡潔に作成します.
コードを同期して実行しているように見えます.

async function fetchUser() {
	return 'pangho';
}

const user = fetchUser();
user.then(console.log);
console.log(user)

関数にasyncを書き込む前にPromiseが自動的に生成されます.

function delay(ms) {
	return new Promise(resolve => setTimeout(resolve, ms));
}

async function getApple() {
	await delay(1000);
	return '🍎';
}

async function getBanana() {
	await delay(1000);
	return '🍌';
}

async function pickFruits() {
	const apple = await getApple();
	const banana = await getBanana();
	return `${apple} + ${banana}`;
}

pickFruits().then(console.log);

待っているコードは、ある行動が終わるまで待つことです.
return値のコードを出力します.