5 mẹo sau đây sẽ giúp bạn sự dụng Javascript Promise hiệu quả hơn !

[Văn Anh Đào]

Promise là gì ? trong giới lập trình Javascript chúng ta không xa lạ gì với Promise , cho nên minh xin phép không cần dong dài định nghi nha ,,.. Trong bài viết này minh sẽ giới thiệu đến các bạn 5 mẹo sẽ giúp bạn sử dụng Promise JS hiệu quả hơn nhé , vào bài thôi !
Mẹo 1 : Cách để hủy một Fetch repuest
Một trong vấn đề khi sử dụng Promises ,đó là chúng ta không thể hủy chúng (cancel) .Dưới đây là một mẹo để chúng ta có thể cancel một promise :

*	const controller = new AbortController();
•	const { signal } = controller;
•	
•	fetch("http://localhost:8080", { signal }).then(response => {
•	console.log(`Request 1 is complete!`);
•	}).catch(e => {
•	console.warn(`Fetch 1 error: ${e.message}`);
•	});
•	
•	// Abort request
•	controller.abort( );

Tuy hơi phức tạp nhưng có vẫn hơn không nhỉ ,…
Mẹo 2 : Cách tạo một timeout với Promise
Dưới đây sẽ là cách tạo một timeOut với Promise để các bạn tham khảo nhé :

•	// Wait for milliseconds  
•	function waitForTime(ms) {
•	return new Promise(r => setTimeout(r, ms));
•	}
•	
•	// Usage 
•	await waitForTime(200);
•	
•	//  Wait Forever 
•	function waitForever() {
•	return new Promise(r => {});
•	}
•	
•	// Usage:
•     await waitForever();

Mẹo 3: Cách để chạy bất đồng bộ các hàm Array
Như các bạn đã biết với các hàm Array như map( ), forEach( ) ,some( ) ,… chúng đều là các hàm đồng bộ .Vậy muốn chạy chức năng không đồng bộ với các hàm trên thì ta sẽ làm như thế nào ? cụ thể như ta muốn cập nhật danh sách các models và đẩy thông tin đã thay đổi trở lại để cập nhập vào cơ sở dữ liệu. Hoặc request tới API để lấy thông tin dùng cho các bước tiếp theo trong use case. Và sau đây sẽ là cách để bạn chạy một asynchronous operation trong synchronous function.

•	async function fetchRepoInfos () { 
•	// load repository details for this array of repo URLs
•	const repos = [
•	{
•	url: 'https://api.github.com/repos/vntalking/ebook-reactjs-that-don-gian'
•	},
•	{
•	url: 'https://api.github.com/repos/vntalking/nodejs-express-mongodb-co-ban'
•	}
•	]
•	
•	// map through the repo list
•	const promises = repos.map(async repo => {
•	// request details from GitHub’s API with Axios
•	const response = await Axios({
•	method: 'GET',
•	url: repo.url,
•	headers: {
•	Accept: 'application/vnd.github.v3+json'
•	}
•	})
•	
•	return {
•	name: response.data.full_name,
•	description: response.data.description
•	}
•	})
•	
•	// wait until all promises resolve
•	await Promise.all(promises).then(results => {
•	console.log(results);
•	})
•	
•	// use the results
•	}
•	
•	fetchRepoInfos();

Mẹo 4 : Cách để biến một đối tượng bất kỳ thành Promise
Để biến một đối tượng thành Promise ? Đơn giản thôi , bạn chỉ cần them phương thức .then( ) vào đối tượng đó ! Chưa hiểu ư ? Dưới đây sẽ là ví dụ :

•	async function convertObjectToPromise() {
•	j = { then: resolve => fetch("/").then(resolve) }
•	
•	j.then(res => console.log(res));
•	// Response {type: "basic", url: "https://vntalking.com/", redirected: false, status: 200, ok: true, …}
•	
•	// ... or an await...
•	const response = await j;
•	// Response {type: "basic", url: "https://vntalking.com/", redirected: false, status: 200, ok: true, …}
•	
•	}

Mẹo 5 : Cách để detect một hàm Async
Sau đây sẽ là cách giúp bạn phát hiện hàm nào là bất đồng bộ , cách này tuy không phổ biến nhưng hiệu quả của nó đem lại là không hề nhỏ !

async function myFunction() {
	}
   const isAsync = myFunction.constructor.name === "AsyncFunction";

Sau bài viết này mình hy vọng nó giúp ích trong quá trình các bạn lập trình nhé , chúc các bạn thành công !