88520191 2020-01-30
async 是“异步”的简写,而 await 可以认为是 async wait 的简写。所以应该很好理解 async 用于申明一个 function 是异步的,而 await 用于等待一个异步方法执行完成。
简单理解:
async 是让方法变成异步。
在终端里用 node 执行这段代码,你会发现输出了 Promise {‘Hello async’ },这时候会发现它返回的是 Promise。
async function testAsync(){ return ‘Hello async‘;
}
const result = testAsync(); console.log(result);await 是等待异步方法执行完成。
其实 await 等待的只是一个表达式,这个表达式在官方 文档里说的是 Promise 对象,但是它也可以接受普通值。 注意:await 必须在 async 方法中 才可以使用因为 await 访问本身就会造成程序停止堵塞,所以必须在异步方法中才可以使用。
function getData(){
return ‘zhangsan‘;
}
async function testAsync(){
return ‘Hello async‘;
}
async function test(){
const v1=await getData(); const v2=await testAsync(); console.log(v1,v2);
} test();async/await 同时使用
async 会将其后的函数(函数表达式或 Lambda)的返回值封装成一个 Promise 对象,而 await 会等待这个 Promise 完成,并将其 resolve 的结果返回出来。
function findData() {
return new Promise(resolve => {
setTimeout(() => resolve("long_time_value"), 1000); });
}
async function test() {
const v = await findData(); console.log(v);
} test();案例:
/*和var是一样的
let a=123;
* */
/*
是一个块作用域
if(true){
let a=123;
}
console.log(a);
* */
/*常量
const PI=3.14159;
PI=3;
console.log(PI);
*/
/*模板字符串
var name=‘张三‘;
var age=20;
console.log(name+‘的年龄是‘+age);
var name=‘张三‘;
var age=20;
console.log(`${name}的年龄是${age}`);
*/
/*方法的简写 属性的简写
var name=‘zhangsan‘;
var app={
name:name
}
console.log(app.name);
属性的简写
var name=‘zhangsan‘;
var app={
name
}
console.log(app.name);
方法的简写
var name=‘zhangsan‘;
var app={
name,
run(){
console.log(`${this.name}在跑步`);
}
}
app.run();
*/
/*
箭头函数 this指向上下文
setTimeout(function (){
console.log(‘执行‘);
},1000)
setTimeout(()=>{
console.log(‘执行‘);
},1000)
* */
/*回调函数 获取异步方法里面的数据
function getData(callbck){
//ajax
setTimeout(function(){
var name=‘张三‘;
callbck(name);
},1000);
}
//外部获取异步方法里面的数据
getData(function(data){
console.log(data+‘111‘);
})
* */
/*Promise来处理异步
resolve 成功的回调韩红素
reject失败的回调函数
var p=new Promise(function(resolve,reject){
//ajax
setTimeout(function(){
var name=‘张三‘;
if(Math.random()<0.7){
resolve(name);
}else{
reject(‘失败‘);
}
},1000);
})
p.then((data)=>{
console.log(data);
})
* */
function getData(resolve,reject){
//ajax
setTimeout(function(){
var name=‘张三‘;
resolve(name);
},1000);
}
var p=new Promise(getData);
p.then((data)=>{
console.log(data);
})//async 是让方法变成异步
/*
普通方法
function getData(){
return ‘这是一个数据‘;
}
console.log(getData()); //这是一个数据
* */
/*
async 是让方法变成异步
async function getData(){
return ‘这是一个数据‘;
}
console.log(getData()); //Promise { ‘这是一个数据‘ }
* */
/*如何获取async 异步方法里面的数据的第一种方法
async function getData(){
return ‘这是一个数据‘;
}
var p=getData();
p.then((data)=>{
console.log(data);
})
* */
//await 是等待异步方法执行完成,可以获取异步方法里面的数据,但是必须得用在异步方法里面
/*await 错误的用法
async function getData(){
return ‘这是一个数据‘;
}
var d=await getData();
console.log(d); //await is only valid in async function
* */
//await 是等待异步方法执行完成,可以获取异步方法里面的数据,但是必须得用在异步方法里面
/*
async function getData(){
return ‘这是一个数据‘;
}
async function test(){
var d=await getData();
console.log(d);
}
test();
* */
//await 阻塞的功能 ,把异步改成一个同步
//async function getData(){
// console.log(2);
// return ‘这是一个数据‘;
//}
//async function test(){
//
// console.log(1);
// var d=await getData();
// console.log(d);
// console.log(3);
//}
//test(); //1 2 3
//async 定义的方法返回的是 Promise对象。
/*
function getData(){
return new Promise((resolve,reject)=>{
setTimeout(()=>{
var username=‘张三‘;
resolve(username);
},1000)
})
}
var p=getData();
p.then(function(d){
console.log(d);
})
* */
function getData(){
return new Promise((resolve,reject)=>{
setTimeout(()=>{
var username=‘张三‘;
resolve(username);
},1000)
})
}
async function test(){
var data=await getData();
console.log(data);
}
test();