獲取JavaScript非同步函式的返回值
今天研究一個小問題： 怎麼拿到JavaScript非同步函式的返回值？
1.錯誤嘗試
當年未入行時，我的最初嘗試：
?| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
<script>
function getSomething() {
var r = 0;
setTimeout(function() {
r = 2;
}, 10);
return r;
}
function compute() {
var x = getSomething();
alert(x * 2);}
compute();
</script>
|
2.回撥函式
彈出的不是4，而是0，後來知道這是非同步的問題，
要用回撥技術來做：
?| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
<script>
function getSomething(cb) {
var r = 0;
setTimeout(function() {
r = 2;
cb(r);
}, 10);
}
function compute(x) {
alert(x * 2);}
getSomething(compute);
</script>
|
3.promise
回撥函式真是個好東西，然後一直這麼寫程式碼寫了很久。遇到非同步就傳函式！！後來我知道有promise這一個東西，專門解決由於回撥函式引起的問題，又學會了promise：
?| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
<script>
function getSomething() {
var r = 0;
return new Promise(function(resolve) {
setTimeout(function() {
r = 2;
resolve(r);
}, 10);
});
}
function compute(x) {
alert(x * 2);
}
getSomething().then(compute);
</script>
|
promise仍然沒有放棄回撥，只是回撥的位置發生了改變。
4.generator
再後來我又學會了generator，知道其有中斷函式執行的能力，又做了新的嘗試：
?| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
<script>
function getSomething() {
var r = 0;
setTimeout(function() {
r = 2;
it.next(r);
}, 10);
}
function *compute(it) {
var x = yield getSomething();
alert(x * 2);
}
var it = compute();
it.next();
</script>
|
同步的寫法，能實現非同步的邏輯，感覺高大上了很多。
5.promise + generator
後來又聽說promise加generator，才是非同步的完美方式，趕緊用高射炮打蚊子（這個例子，還不足以說出二者在一起用的好處）：
?| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
<script>
function getSomething() {
var r = 0;
return new Promise(function(resolve) {
setTimeout(function() {
r = 2;
resolve(r);
}, 10);
});
}
function *compute() {
var x = yield getSomething();
alert(x * 2);
}
var it = compute();
it.next().value.then(function(value) {
it.next(value);
});
</script>
|
6.async
心想這算是夠屌的吧，後來又聽說es7給出了終極方案:async。
作為愛學習的少年，心想自己不能被落下：
?| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
<script>
function getSomething() {
var r = 0;
return new Promise(function(resolve) {
setTimeout(function() {
r = 2;
resolve(r);
}, 10);
});
}
async function compute() {
var x = await getSomething();
alert(x * 2);
}
compute();
</script>
|
到這裡終於長出了一口氣。
後記：
上面所有的例子，在最新chrome上都可以執行。一個個小例子，點了點幾個名詞。
當然也只是“點”而已，如果能提供讀者深入學習相關知識點的一個trigger，那麼老姚就心滿意足了。
以上就是老姚童鞋給我們分享的全部內容了，希望對大家理解JavaScript非同步函式能夠有所幫助
原文連結：http://www.qdfuns.com/notes/17398/8a2084587fbd3f6c170c1bb8a79045c6.html
相關推薦
獲取JavaScript非同步函式的返回值
今天研究一個小問題： 怎麼拿到JavaScript非同步函式的返回值？ 1.錯誤嘗試 當年未入行時，我的最初嘗試： ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 <script> func
js中一個函式獲取另一個函式返回值問題
//此種為非同步，還不等ajax賦完值，函式就return了。 function getCaseInfoForMap(){ var formInfo=$("#firstForm").serialize(); var dd; $.ajax({
如何獲取js非同步請求返回值
使用定時函式模擬非同步請求 回撥函式 function doSomething(callback){ setTimeout(function(){ console.log(
拿JS非同步函式返回值的幾種方式
在我們的編碼過程中，為了滿足業務需求，經常需要獲取JS非同步函式的返回值。今天就來彙總一下拿值的幾種方式。 1，通過回撥函式的方式來拿返回值，這個想必大家不會陌生 function getSomething(cb) { var r = 0;
js 獲取函式返回值
return 語句會終止函式的執行並返回函式的值。 但是隻會執行當前函式，如果巢狀多層函式，每一層都需要return才可以 比如： function test(){ return 1; } console.log(test()); // 1 function
C#Process.Start獲取main函式返回值，以及控制檯輸出重定向到文字框
1、Process.Start()返回啟動程序main函式的返回值 private void button1_Click(object sender, EventArgs e) { Process da = new Process
【shell】獲取函式返回值的兩種方法
方法一: 使用全域性變數 g_result="" function testFunc() { g_result='local value' } testFunc echo $g_resu
獲取$.post $.get回撥函式返回值問題
專案中用Jquery操作，肯定避免不了向伺服器傳送請求，所以就會用到上面的兩個函式。完整的函式格式如下： ?$.get(URL,callback); ?$.post(URL,data,callback); 而某些時候我們要用callback回撥函式處理完以後的返回值
用谷歌的AsyncHttpClient簡單模仿安卓的AsyncHttpClient，實現非同步請求回撥函式返回值
實現思路 既然要呼叫Future.get() 才能激發訪問，那麼就想到了使用一個執行緒去訪問。我們就不需要等待阻塞了。 模仿安卓的AsyncHttpClient回撥。根據狀態回撥不同的函式。 實現的效果 執行程式碼...
c#獲取url請求的返回值
web c# new mar string htm http class dto /// <summary> /// 獲取url的返回值 /// </summary> /// <param name="url">eg:htt
Python小白學習之路（十）—【函式】【函式返回值】【函式引數】
寫在前面： 昨天早睡之後，感覺今天已經恢復了百分之八十的樣子 又是活力滿滿的小夥郭 今日份雞湯： 我始終相信，在這個世界上，一定有另一個自己，在做著我不敢做的事，在過著我想過的生活。-------宮崎駿 函式 一、函數出現的背景 在學習函式之前，一直遵循：面向過程程式設計，即：根據業務邏輯從上到
recv函式返回值總結
函式原型：int recv( SOCKET s, char *buf, int len, int flags) 功能：不論是客戶還是伺服器應用程式都用recv函式從TCP連線的另一端接收資料。 引數一：指定接收端套接字描述符； 引數二：指明一個緩衝區，該緩衝區用來存放recv
C# socket 程式設計之 accept() 函式返回值解析
accept() 函式會返回一個新的套接字，這個新的套接字在伺服器端與客戶端進行通訊。 伺服器端的繫結監聽是一個套接字，與客戶端通訊的是另一個套接字（accept函式返回的套接字，注意這裡不是返回客戶端的套接字，返回的套接字是新建立在伺服器上的，與客戶端收發訊息用的） 下面這段程式碼，是
獲取vuex store.dispatch返回值的問題
在需要dispatch的函式裡,新增return Promise.resolve(返回值) // 使用者名稱登入 LoginByUsername({ commit }, userInfo) { const username = userInfo.username.trim()
recv函式返回值說明
分享一下我老師大神的人工智慧教程！零基礎，通俗易懂！http://blog.csdn.net/jiangjunshow 也歡迎大家轉載本篇文章。分享知識，造福人民，實現我們中華民族偉大復興！
opencv之type()函式返回值對應表
opencv之type()函式返回值對應表 cv::Mat 類的物件有一個成員函式 type() 用來返回矩陣元素的資料型別，返回值是 int 型別，不同的返回值代表不同的型別。 int Mat::type() const 返回值與具體型別對應關係表： | |C1| C2| C3| C4| --|--|
Python建立多執行緒任務並獲取每個執行緒返回值
轉自：https://www.cnblogs.com/bethansy/p/7965820.html 1.程序和執行緒 （1）程序是一個執行中的程式。每個程序都擁有自己的地址空間、記憶體、資料棧以及其他用於跟蹤執行的輔助資料。程序也可以派生新的程序來執行其他任務，
建構函式返回值
建構函式返回值 For purposes other than simple initialization, classes can have constructors. Constructors are blocks of statements that can be used to in
按鍵精靈Q語言-怎麼使用自定義函式返回值
按鍵精靈怎麼使用自定義函式返回值？ a i MessageBox i Function a(i) i=100 End Function 就是想彈出100 aiMessageBoxiFunctiona(i)i=100EndFunction就是想讓它彈出的是100怎麼獲得自定義函式中的值呢？...展
風火程式設計--flask檢視函式返回值
flask檢視函式返回json資料 原始模式 data_json = json.dumps({"errcode": "0", "errms": "成功", "data": data}) return data_json, 200, {"Contant-Type": "Applic