1. 程式人生 > >【JavaScript】 使用Async 和 Promise 完美解決回調地獄

【JavaScript】 使用Async 和 Promise 完美解決回調地獄

get 不用 操作 調用 地獄 edi div null 多重

很久以前就學習過Async和Promise,但總是一知半解的。

今天在寫NodeJS的時候,發現好多第三方庫使用回調,這樣在實際操作中會出現多重回調,這就是傳說中的JS回調地獄。

舉個例子

有一個方法調用redis,訪問一個Hash對象表,獲取到返回值後,將返回值插入到redis的另外一個Hash對象表中。

testCallbackAction(){
	let redis = RedisClient();

	let key = ‘xx‘;
	redis.hget(redisTable1,key, (err,data)=>{
		err&&think.logger.error(err);

		redis.hset(redisTable2,key,data,(err,data)=>{
			console.log(err);
			console.log(data);
		});
	})
}

在上面這個方法中,可以看見它嵌套了2個回調函數。隨著業務的復雜,必然導致回調函數的無限嵌套。

這時候就可以使用Async和Promise來解決這個問題。

首先要了解一個Promise和Async的概念。

Promise可以看作是一個異步容器。它可以將一個異步調用方法放到一個容器中,在異步處理時,不會直接跳到下一步,而是阻塞,直到異步處理結束並返回一個resolve()方法。

而Ansyc、await 是Promise天生一對的搭檔。

在執行Promise時,使用Ansyc將Promise指定為異步方法,然後使用await等待Promise返回resolve方法。

通過這個方式,我們可以對上面的代碼進行簡化,具體如下:

async testCallbackAction(){
	let redis = RedisClient();

	let key = ‘xx‘;
	let rt = null;
	await new Promise((resolve, reject)=>{
		redis.hget(redisTable1,key, (err,data)=>{
			err&&think.logger.error(err);
			rt = data;
			resolve();
		})
	})

	await new Promise((resolve, reject)=>{
		redis.hset(redisTable2,key,rt,(err)=>{
			console.log(err);
			resolve();
		});
	})
}

  

通過上面這個方法,可以將回調函數拆開,依次等待回調結束後再執行下一步,而不用將回調嵌套,大大提高了代碼的可閱讀性。

【JavaScript】 使用Async 和 Promise 完美解決回調地獄