fetch解決異步嵌套問(wèn)題

cnTomato 發(fā)布于2019-08-20 18:11 / 1657人閱讀

摘要：和解決異步嵌套問(wèn)題姓名年齡解決異步嵌套問(wèn)題姓名年齡這兩段代碼比起來(lái)，是不是下面的要比上面的簡(jiǎn)單的多得多，像我這不愛(ài)敲代碼的肯定選擇下面的，哈哈

fetch

async和await解決異步嵌套問(wèn)題：

 function ajax(url){
        return new Promise(function(resolve,refused){
                let xmlHttp=new XMLHttpRequest();
                xmlHttp.open("get",url,true);
                xmlHttp.onreadystatechange=function(){
                    if(xmlHttp.readyState==4&&xmlHttp.status==200){
                        let data= JSON.parse(xmlHttp.responseText);
                        resolve(data);
                       }
                   }
                xmlHttp.send(null);
        });
    }

    let uldom=document.getElementById("students");
    let url="http://localhost:3000/student.json";
 

    async function main(){
        let data=await ajax(url);
        let students=data;
        let html=``;
        for(let i=0,l=students.length;i姓名${name},年齡${age}
            `
        }
        uldom.innerHTML=html;
    }
    main();

fetch解決異步嵌套問(wèn)題：

let url="http://localhost:3000/student.json";
    let uldom=document.getElementById("students");
    async function main(){
        let respone = await fetch(url);
        let students = await respone.json();
            
        let html=``;
        for(let i=0,l=students.length;i姓名${name},年齡${age}
           `
        }
        
        uldom.innerHTML=html;
        
    }
    main();

這兩段代碼比起來(lái)，是不是下面的要比上面的簡(jiǎn)單的多得多，像我這不愛(ài)敲代碼的肯定選擇下面的，哈哈！

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://www.ezyhdfw.cn/yun/84174.html

相關(guān)文章

es7 fetch解決異步嵌套問(wèn)題

摘要：解決異步嵌套問(wèn)題我們昨天學(xué)習(xí)了和，知道他是為了解決瀏覽器異步獲取的的但是我們用的話方法會(huì)更加的簡(jiǎn)單和解決異步嵌套姓名年齡我們需要?jiǎng)?chuàng)建函數(shù)來(lái)進(jìn)行操作，如果我們用解決的話，會(huì)更加的方便姓名年齡不用創(chuàng)建，直接調(diào)用是不是比上邊更加的簡(jiǎn)單結(jié)合處理異步 fetch API解決異步嵌套問(wèn)題我們昨天學(xué)習(xí)了async和await，知道他是為了解決瀏覽器異步獲取的的！但是我們用fetch api的話方法...

xiaoqibTn 2019-08-20 18:12 評(píng)論0 收藏0
JavaScript 異步進(jìn)化史

摘要：簽訂協(xié)議的兩方分別是異步接口和。在異步函數(shù)中，使用異常捕獲的方案，代替了的異常捕獲的方案。需要注意的是，在異步函數(shù)中使異步函數(shù)用時(shí)要使用，不然異步函會(huì)被同步執(zhí)行。同步與異步通常，代碼是由上往下依次執(zhí)行的。如果有多個(gè)任務(wù)，就必需排隊(duì)，前一個(gè)任務(wù)完成，后一個(gè)任務(wù)才會(huì)執(zhí)行。這種執(zhí)行模式稱之為：同步（synchronous）。新手容易把計(jì)算機(jī)用語(yǔ)中的同步，和日常用語(yǔ)中的同步弄混淆。如，...

luzhuqun 2019-08-22 10:34 評(píng)論0 收藏0
What? 你還不知道Kotlin Coroutine?

摘要：例如，在方面它主要能夠幫助你解決以下兩個(gè)問(wèn)題在主線程中執(zhí)行耗時(shí)任務(wù)導(dǎo)致的主線程阻塞，從而使發(fā)生。提供主線程安全，同時(shí)對(duì)來(lái)自于主線程的網(wǎng)絡(luò)回調(diào)磁盤操提供保障。在線程通過(guò)從數(shù)據(jù)庫(kù)取數(shù)據(jù)，一旦數(shù)據(jù)返回，在主線程進(jìn)行處理。 showImg(https://segmentfault.com/img/bVbuqpM?w=800&h=320); 今天我們來(lái)聊聊Kotlin Coroutine，如果你...

yunhao 2019-08-16 18:25 評(píng)論0 收藏0
js基礎(chǔ)進(jìn)階--從ajax到fetch的理解

摘要：使用它可以讓頁(yè)面請(qǐng)求少量的數(shù)據(jù)，而不用刷新整個(gè)頁(yè)面。基于什么答它基于的是。的庫(kù)答基于上面的原因，各種庫(kù)引用而生，然而最有名的就是的中的。它的一個(gè)優(yōu)勢(shì)異步操作，但的異步操作是基于事件的異步模型，沒(méi)有那么友好。歡迎訪問(wèn)我的個(gè)人博客：http://www.xiaolongwu.cn 基本知識(shí) 1. Ajax是什么？答：Ajax是一種可以在瀏覽器和服務(wù)器之間使用異步數(shù)據(jù)傳輸（HTTP請(qǐng)求）...

SoapEye 2019-08-23 14:44 評(píng)論0 收藏0
傳統(tǒng) Ajax 已死，Fetch 永生

摘要：結(jié)果證明，對(duì)于以上瀏覽器，在生產(chǎn)環(huán)境使用是可行的。后面可以跟對(duì)象，表示等待才會(huì)繼續(xù)向下執(zhí)行，如果被或拋出異常則會(huì)被外面的捕獲。，，都是現(xiàn)在和未來(lái)解決異步的標(biāo)準(zhǔn)做法，可以完美搭配使用。這也是使用標(biāo)準(zhǔn)一大好處。只允許外部傳入成功或失敗后的回調(diào)。 showImg(https://cloud.githubusercontent.com/assets/948896/10188666/bc9a53...

fai1017 2019-08-21 10:41 評(píng)論0 收藏0