从async await 报错Unexpected identifier 谈谈对上下文的理解
原文首发地址:http://www.cnblogs.com/lonhon/p/7518231.html
先简单介绍下async await:
async/await是ES6推出的异步处理方案,目的也很明确:更好的实现异步编程。 详细见阮大神 ES6入门
现在说说实践中遇到的问题:使用await报错Unexpected identifier
先上代码:
var sleep = function (time) {
return new Promise(function (resolve, reject) {
setTimeout(function () {
resolve((''));
}, time);
})
};
let arr = [, , , , , , , , , ]
var start = async function(){
arr.forEach(()=>{
console.log( await sleep() )
})
}
start();
在循环中使用sleep方法,这时候报错:Unexpected identifier
原因:通过查资料发现一句话 await
必须在async函数的上下文中。(后面重点讲)通过个人理解的这句话就是
await只能在async函数中使用。
以上面的代码为例子,虽然最外层start函数是通过async声明的,在start函数体内部的箭头函数中使用了await,而该箭头函数是一个普通函数,所以await的上文是一个普通函数,最终导致报错。
解决办法,将箭头函数声明为async函数,代码如下:
var sleep = function (time) {
return new Promise(function (resolve, reject) {
setTimeout(function () {
resolve(console.log(''));
}, time);
})
};
let arr = [, , , , , , , , , ]
var start = function(){
arr.forEach(async ()=>{
await sleep()
})
}
start();
运行结果:
至此,问题解决。
a
wait
必须在async函数的上下文中。出处
上下文,英文context,其完整意思应当是concatenate-text,联系文本,编程中翻译为“引用池”或者“引用区”更加恰当
先举个例子:
③.小明说:重启试试
单从这句话我们不能知道重启什么、为什么小明要说这句话(可能你觉得是电脑)、对谁说的这句话
②.小红说对小明说她微信出来不了输入法
这就是小明为什么说这句话的上文(背景),这时候才能知道小明说的重启是微信程序or手机(真不是电脑)
①.小红和小明躺在床上玩手机
这句也是背景,但是却不能成为3的上文,因为“躺床上”并不是“重启试试”的原因(或者说背景)
函数调用会在内存形成一个"调用记录",又称"调用帧"(call frame),保存调用位置和内部变量等信息
个人理解:上文指出了环境、背景。
拿本文中的第一段错误代码来说,await的上文是一个普通箭头函数,所以使用await会报错,因为编译器在执行到await时,当前调用帧是箭头函数而不是外层的start,所以此时的await就像:小明和小红躺在床上 小明说“重启试试” ,是无意义(Unexpected identifier)的。
这时候谈谈下文,接上面的例子
④.小红重启了手机
这时候④就是③的下文
需要注意的是,上下文是一个整体,上面我把它分开只是为了理解,实际过程中,不存在单独的上文和下文,所以这是await 必须在async 的上下文 的具体意义。
从async await 报错Unexpected identifier 谈谈对上下文的理解的更多相关文章
- php Yii2 报错unexpected '}'
报错unexpected '}'一般是缺少":"导致的
- 记录微信小程序报错 Unexpected end of JSON input;at pages/flow/checkout page getOrderData function
微信小程序报错 Unexpected end of JSON input;at pages/flow/checkout page getOrderData function 这个报错是在将数组对象通过 ...
- 报错Unexpected token u
报错Unexpected token u,出错位置提示在index.html的第一行. 出现这个错误的原因是尝试JOSN.parse一个undefined的对象导致的,解决办法就是如果为undefin ...
- linux服务器启动报错UNEXPECTED INCONSISTENCY解决方法
内网的linux服务器给开发员用来测试以及共享文件使用,今天早上发现xshell连接不上该服务器,一开始进入系统显示reboot and select proper boot device or in ...
- node模拟后台返回json书写格式报错--Unexpected token ' in JSON at position 1
最近在学习Node的知识,就尝试写了一个注册登陆的简单功能,但是自己在模拟后台返回值的时候,总是报错Unexpected token ' in JSON at position 1,查找原因之后,是因 ...
- webpack打包报错Unexpected token
最近项目要上线,需要对项目进行打包部署到服务器上面,在打包过程中npm run build后出现以下报错Unexpected token: punc (() [./~/_element-ui@1.4. ...
- electron-vue 引入OpenLayer 报错 Unexpected token export
electron-vue 引入OpenLayer 报错 Unexpected token export 解决办法: 在 .electron-vue/webpack.renderer.config.js ...
- JavaScript在IE6,IE7下报错'expected identifier, string or number'
问题: 代码在Forefox和IE8下工作正常,但是在IE6下报错: expected identifier, string or number 假如变量options有多个选项,那么我们可以用逗号分 ...
- Vue打包报错Unexpected token: punc(()解决方案
(用vscode)vue项目打包时,报错,报错信息如下: ERROR in static/js/0.564c764efc3ecf31190c.js from UglifyJs Unexpected t ...
随机推荐
- [补档][COGS 426]血帆海盗
[COGS 426]血帆海盗 题目 传送门:http://cogs.pro/cogs/problem/problem.php?pid=426 随着资本的扩大,藏宝海湾贸易亲王在卡利姆多和东部王国大陆各 ...
- 初学django搭建一个通讯录应用
---恢复内容开始--- django搭建一个通讯录应用 一.环境介绍 window10 64位 Django-1.5.12 python 2.7 Sqlite3 二.基本安装 python2.7安装 ...
- vue指令v-cloak示例解析
v-cloak会隐藏未编译的 Mustache 标签,直至实例准备完毕: [v-cloak] { display: none; } <div v-cloak> {{ message }} ...
- 中国大学MOOC-陈越、何钦铭-数据结构-2015秋 01-复杂度2 Maximum Subsequence Sum (25分)
01-复杂度2 Maximum Subsequence Sum (25分) Given a sequence of K integers { N1,N2, ..., NK }. ...
- 蓝桥杯算法训练_2的次幂表示+前缀表达式+Anagrams问题+出现次数最多的整数
今天做了4个简单的题,题目虽然是简单,但是对于我这样的小白,还是有很多东西需要学习的. 2的次幂表示 上面就是题目,题目说的也很清晰了,接下来就是递归的实现: #include<iostream ...
- MySQL- 5.7 sys schema笔记
如果转载,请注明博文来源: www.cnblogs.com/xinysu/ ,版权归 博客园 苏家小萝卜 所有.望各位支持! performance_schema提供监 ...
- python爬虫url带中文解决方案之一
import urllib2 urllib2.quote("呵呵哒") #输出 '%BA%C7%BA%C7%DF%D5'
- php 单引号,双引号,反引号区别
PHP中单引号,双引号,反引号具有不同的含义,最大的几项区别如下: 一.单引号中,任何变量($var).特殊转义字符(如"\t \r \n"等)不会被解析,因此PHP的解析速度更快 ...
- CentOS 7 服务器配置--安装Java和Tomcat
一 安装 JAVA (jdk_8u121_linux_x64) #查看是否安装了OpenJDK #检查是否安装了JAVA java -version rpm -qa | grep java #卸载已安 ...
- css3中的动画效果
css3中的animation属性动画效果代码如下: <!DOCTYPE html> <html lang="en"> <head> <m ...