javascript异步编程的4种方法

一、回调函数，这是异步编程最基本的方法s

function f1(callback){

　　setTimeout(function () {

　　 // f1的任务代码

　　　　callback();

　　}, 1000);

}

二、事件监听

f1.on('done', f2); 当f1发生done事件，就执行f2。

function f1(){

　　setTimeout(function () {

　　　　// f1的任务代码

　　　　f1.trigger('done');

　　}, 1000);

}

f1.trigger('done')表示，执行完成后，立即触发done事件，从而开始执行f2。

Promises对象

f1().then(f2);

function f1(){

　　var dfd = $.Deferred();

　　setTimeout(function () {

　　　　// f1的任务代码

　　　　dfd.resolve();

　　}, 500);

　　return dfd.promise;

}

f1().then(f2).then(f3); //指定多个回调函数

f1().then(f2).fail(f3); //指定发生错误时的回调函数

浏览器异步请求

callback

function getOneNews() {

$.ajax({

url: topicsUrl,

success: function(res) {

let id = res.data[0].id;

$.ajax({

url: topicOneUrl + id,

success: function(ress) {

console.log(ress);

render(ress.data);

},

});

},

});

}

promise

function getOneNews() {

axios

.get(topicsUrl)

.then(function(response) {

let id = response.data.data[0].id;

return axios.get(topicOneUrl + id);

})

.then((res) => {

render(res.data.data);

})

.catch(function(error) {

console.log(error);

});

}

async/await

async function getOneNews() {

let listData = await axios.get(topicsUrl);

let id = listData.data.data[0].id;

let data = await axios.get(topicOneUrl + id);

render(data.data.data);

}