业务需要分10次请求10个接口,每个接口请求后等待2s再进行下一次请求,在不借助任何JavaScript框架或者库的前提下实现。
阿里前端面试原题
const apis = ["/api/1","/api/2","/api/3","/api/4","/api/5","/api/6","/api/7","/api/8","/api/9","/api/10"];
function request(url){
}
function sleep(time){
}
function run(){
}
run();
// 要求:每隔2s打印一个接口数据
答案1:
const apis = ["/api/1","/api/2","/api/3","/api/4","/api/5","/api/6","/api/7","/api/8","/api/9","/api/10"];
let i= 0;
function request(url){
// 模拟请求接口并打印数据
console.log(`请求接口:${
url}`);
}
function sleep(time){
const start = new Date().getTime();
while (new Date().getTime() - start < time) {
// 空循环等待
}
}
function run(){
if(i < apis.length){
request(apis[i]);
i++;
sleep(2000);
run();
}
}
run();
特点:因为使用了循环语句阻塞程序,比较浪费性能,体验不好
答案2:
const apis = ["/api/1","/api/2","/api/3","/api/4","/api/5","/api/6","/api/7","/api/8","/api/9","/api/10"];
let i = 0;
function request(url){
// 模拟请求接口并打印数据
console.log("请求了:" + url)
}
function sleep(time){
// 开启promise,2s后返回修改成功状态
return new Promise(resolve=>{
setTimeout(()=>{
resolve()
},time)
})
}
async function run(){
if(i < apis.length){
request(apis[i])
i++;
// 等待promise的成功
await sleep(2000);
run();
}
}
run();
特点:利用async和await阻塞程序,等待2s