Ներածություն JavaScript-ի պրոմիսներին

Դուք արդեն գիտեք, որ ասինխրոնության կոլբեք-մոդելի օգտագործումը հեշտությամբ հանգեցնում է callback hell իրավիճակի։ Ուստի JavaScript-ում ներդրվեց նոր մոդել՝ կոչված պրոմիսներ (promise)։ Եկեք ուսումնասիրենք այս մոդելը։

Պրոմիսը ներկայացնում է օբյեկտ, որին որպես պարամետր փոխանցվում է ֆունկցիա, որի ներսում պետք է տեղադրել մեր ասինխրոն կոդը։

let promise = new Promise(function() {
	// ասինխրոն կոդ
});

Ինչպես տեսնում եք, ես պրոմիսով օբյեկտը գրել եմ promise փոփոխականում։ Կոդի ինչ-որ այլ տեղում ես կարող եմ կիրառել այս փոփոխականի նկատմամբ then մեթոդը՝ փոխանցելով դրան ֆունկցիա այն կոդով, որը պետք է կատարվի տվյալ պրոմիսի ստեղծման ժամանակ գրված ասինխրոն կոդի ավարտից հետո։

promise.then(function() {
	// կկատարվի ասինխրոն կոդի ավարտից հետո
});

Հնչում է շփոթեցնող, ուստի եկեք նայենք օրինակին։ Ենթադրենք, ես ունեմ հետևյալ ասինխրոն կոդը։

setTimeout(function() {
	let result = [1, 2, 3, 4, 5];
}, 3000);

Ենթադրենք, ես ուզում եմ լուծել դրա համար ասինխրոնության մեր հիմնական խնդիրը՝ կատարել որոշակի կոդ թայմերի աշխատանքից հետո։ Այդ դեպքում ես չեմ ցանկանում տեղադրել այդ կոդը հենց թայմերի ներսում և ուզում եմ, որ այդ կոդին ինչ-որ կերպ հասնի result փոփոխականում գրած արդյունքս։ Ընդհանրապես, մենք այս խնդիրը լուծել ենք նախորդ դասերում կոլբեքների և բաժանորդագրությունների միջոցով։ Եկեք հիմա տեսնենք, թե ինչպես դա անել պրոմիսների միջոցով։

Սկզբում պետք է փաթաթել մեր ասինխրոն կոդը պրոմիսի մեջ։

let promise = new Promise(function() {
	setTimeout(function() {
		let result = [1, 2, 3, 4, 5];
	}, 3000);
});

Սա, սակայն, բավարար չէ։ Մենք պետք է պարզորոշ նշենք, որ մեր ասինխրոն կոդն ավարտվել է։ Դրանում մեզ կօգնի ավարտի հատուկ ֆունկցիան, որն ավտոմատ կերպով հայտնվում է ֆունկցիայի առաջին պարամետրում, եթե այն նշված է։

let promise = new Promise(function(resolve) { // նշում ենք պարամետրը
	setTimeout(function() {
		let result = [1, 2, 3, 4, 5];
	}, 3000);
});

Ավարտի ֆունկցիայի օգնությամբ մենք կարող ենք պարզորոշ նշել պրոմիսին, որ ասինխրոն կոդն ավարտվել է։ Դրա համար մենք պետք է կանչենք այդ ֆունկցիան մեզ անհրաժեշտ տեղում։

let promise = new Promise(function(resolve) {
	setTimeout(function() {
		let result = [1, 2, 3, 4, 5];
		resolve(); // ավարտում ենք պրոմիսը
	}, 3000);
});

Այդ դեպքում, եթե մենք ցանկանում ենք դուրս փոխանցել ասինխրոն կոդի ինչ-որ արդյունք, մենք կարող ենք այն փոխանցել որպես մեր ավարտի ֆունկցիայի պարամետր։

let promise = new Promise(function(resolve) {
	setTimeout(function() {
		let result = [1, 2, 3, 4, 5];
		resolve(result); // փոխանցում ենք արդյունքը
	}, 3000);
});

Իհարկե, կարելի է ազատվել միջանկյալ փոփոխականից։

let promise = new Promise(function(resolve) {
	setTimeout(function() {
		resolve([1, 2, 3, 4, 5]);
	}, 3000);
});

Հիմա մենք կարող ենք մեր պրոմիսի վրա կանչել then մեթոդը ցանկացած այլ տեղում։

promise.then(function() {
	// կգործի պրոմիսի ավարտից հետո
});

Պրոմիսի աշխատանքի արդյունքը կհայտնվի ֆունկցիայի առաջին պարամետրում, եթե մենք ցանկանանք այն նշել։

promise.then(function(result) {
	console.log(result); // կարտածի արդյունքով զանգվածը
});

Ստեղծեք պրոմիս, որի ներսում կլինի 5 վայրկյան տևողությամբ դադար, որից հետո պրոմիսը պետք է կատարվի՝ որպես արդյունք վերադարձնելով ինչ-որ տեքստ։ Արտածեք այդ տեքստը էկրանին։