1. First we need to understand the callback and callback hell
(1) callback function: When you run a function to achieve a certain function, passing a function as an argument, when something occurs, it will execute this function
Asynchronous operation is complete before an asynchronous operation to wait, whether it is a callback function events or otherwise, will continue to fall into nested callback asynchronous operation by an asynchronous operation to wait for the results of his other operations: (2) callback hell , the complexity of the process, this makes the code associated sharp increase (the simplest scenario is that we bind the stand-alone event, if our first stand-alone event this nested inside a second stand-alone event and so on, to the last and output, then we must turn to the back of the last point before they can trigger a) [this is very troublesome, it is a solution]
We call a callback, it is certainly no doubt that the matter asynchronous
es official examined a number of asynchronous scene, summed up a common set of asynchronous model, this model can cover almost all of the asynchronous scenarios
When a certain thing asynchronous operation can happen, we divided into two stages:
Unsettled pending stage
settled has decided to stage
es6 program divided into three parts: pending resolved rejected
pending: pending (waiting) is pending stage, said that the situation is still in pending, the final result did not come out
resolved: results have never been treated in stages, the results indicate the whole thing has occurred, and can proceed according to the normal logic
rejected: results have been rejected in the decision stage, the results indicate the whole thing has occurred, and is unable to proceed in accordance with a normal logic
2. resolve callback hell there are several ways Promise async / await
promise:
(. 1) is a constructor Promise, Promise be new new () to get a Promise instance;
(2) on the Promise, there are two functions, named resolve (after the success callback function) and reject (after the failure callback function)
His writing:
new Promise ((resolve,reject)=>{
Pending stage
It has decided to push the stage resolve the status by calling the function resolve Promise
Pushed to reject the state has decided to reject stage by calling the function Promise
Note: resolve and reject the use of only one, if the use of multiple, only the first useful
})
Pro new new Promise = const ((Resolve, Reject) => {
Resolve (success)
Reject (failure) // throw failure effect are the same as push
})
all method: This method will return a new Promise objects, all of which if successful will trigger Promise objects, if they fail to defeat the object is a Promise
success:
let fun1 = () => {
return new Promise((resolve, reject) => {
resolve({
data: '1'
})
})
}
let fun2 = () => {
return new Promise((resolve, reject) => {
resolve({
data: '2'
})
})
}
Promise.all([fun1(), fun2()]).then(([res1, res2]) => {
console.log(`res1:${res1.data},res2:${res2.data}`)
})
failure:
let fun1 = () => {
return new Promise((resolve, reject) => {
resolve({
data: '1'
})
})
}
let fun2 = () => {
return new Promise((resolve, reject) => {
reject({
data: '2'
})
})
}
Promise.all([fun1(), fun2()]).then(([res1, res2]) => {
console.log(`res1:${res1.data},res2:${res2.data}`)
})
() race: a promise when any object parameter is completed, when you go back for complete use of the
results promise object, regardless of the result of the success or failure
3. async / await keywords are both new in the ES2016
async: simplify the creation of Promise
async function f() { return 1 }
await: wait await keyword must appear in the async function
async function f() {
let promise = new Promise((resolve, reject) => {
setTimeout(() => resolve('你好'), 1000)
})
let result = await promise
alert(result)
}
f()
About right play, if not to await keyword in async function will report this error
