es6 语法 (Generator)
{
// 长轮询
let ajax=function* (){
yield new Promise(function(resolve,reject){
setTimeout(function () {
resolve({code:0})
}, 200);
})
}
let pull=function(){
let genertaor=ajax();
let step=genertaor.next();
step.value.then(function(d){//step.value就是promise实例
if(d.code!=0){
setTimeout(function () {
console.info('wait');
pull()
}, 1000);
}else{
console.info(d);
}
})
}
pull();
}
Generator 函数是协程在 ES6 的实现,最大特点就是可以交出函数的执行权(即暂停执行)
参考链接:
http://www.ruanyifeng.com/blog/2015/04/generator.html
{
// genertaor基本定义 有一个星号有一个yield
let tell = function*() {
yield 'a';
yield 'b';
return 'c'
}; let k = tell(); console.log(k.next()); // {value: "a", done: false}
console.log(k.next()); // {value: "b", done: false}
console.log(k.next()); // {value: "c", done: false}
console.log(k.next()); // {value: undefined, done: true}
} {
let obj = {};
obj[Symbol.iterator] = function*() {
yield 1;
yield 2;
yield 3;
} for (let value of obj) {
console.log('value', value); // 1 2 3
}
} {
let state = function*() {
while (1) {
yield 'A';
yield 'B';
yield 'C';
}
}
let status = state();
console.log(status.next()); //{value: "A", done: false}
console.log(status.next()); //{value: "B", done: false}
console.log(status.next()); //{value: "C", done: false}
console.log(status.next()); //{value: "A", done: false}
console.log(status.next()); //{value: "B", done: false}
} // {
//需要一些插件才能实现,结果跟上面一样
// let state=async function (){
// while(1){
// await 'A';
// await 'B';
// await 'C';
// }
// }
// let status=state();
// console.log(status.next());
// console.log(status.next());
// console.log(status.next());
// console.log(status.next());
// console.log(status.next());
// } {
let draw = function(count) {
//具体抽奖逻辑
console.info(`剩余${count}次`)
}
let residue = function*(count) {
while (count > 0) {
count--;
yield draw(count);
}
}
let star = residue(5); //次数后台传
let btn = document.createElement('button');
btn.id = 'start';
btn.textContent = '抽奖';
document.body.appendChild(btn);
document.getElementById('start').addEventListener('click', function() {
star.next();
}, false)
}
es6 语法 (Generator)的更多相关文章
- WebStorm ES6 语法支持设置和ES6语法的JS文件编译为ES5语法文件
ECMAScript 6是JavaScript语言的下一代标准,已经在2015年6月正式发布了.Mozilla公司将在这个标准的基础上,推出JavaScript 2.0.ES6的目标,是使得JavaS ...
- es6语法重构react代码
1.使用React.Component创建组件,需要通过在constructor中调用super()将props传递给React.Component.另外react 0.13之后props必须是不可变 ...
- vue 2.0 无法编译ES6语法
# vue2.0 webpack 无法编译 ES6 语法 之前在使用 vue 1.x 时用 vue-loader@8.0.0 版本可以正常打包vue的代码,包括ES6语法也能正常转为ES5语法,但是当 ...
- 把JavaScript代码改成ES6语法不完全指南
目录 * 核心例子 * 修改成静态变量(const)或块级变量(let) * 开始修改 * 疑问解释(重复定义会发生什么) * 疑问解释(let的块级作用域是怎样的) * 疑问解释(const定义的变 ...
- 让intellij idea 14 支持ES6语法
用eclipse做前端开发,用到了webpack,结果各种依赖导致软件卡的一比,简直不能动!虽然在同事的帮忙下,修改了一下配置,但仍然卡的没脾气.改用intellij idea 14解决了卡的问题,但 ...
- .vue文件在webstorm中es6语法报错解决方法
1 语法支持es6设置 Preferences > Languages & Frameworks > JavaScript 把 Javascript Language versio ...
- webpack打包不识别es6语法的坑
今天Vue项目npm run build 后webpack,报错uglifyjs,自己研究了一下,翻译过来,意思是不识别项目中写的高级语法,这里要把项目里es6语法转es5让浏览器识别, 也就是web ...
- ES6语法的学习与实践
ES6是JavaScript语言的新一代标准,是ECMAScript的第六个版本,加入了很多新的功能和语法,在很多框架,如在使用Vue,React等框架的项目中一般都采用ES6语法来编写的,下面对经常 ...
- 如何让浏览器支持ES6语法,步骤详细到小学生都能看懂!
为什么ES6会有兼容性问题? 由于广大用户使用的浏览器版本在发布的时候也许早于ES6的定稿和发布,而到了今天,我们在编程中如果使用了ES6的新特性,浏览器若没有更新版本,或者新版本中没有对ES6的特性 ...
- Webstorm添加新建.vue文件功能并支持高亮vue语法和es6语法
转载:https://blog.csdn.net/qq_33008701/article/details/56486893 Webstorm 添加新建.vue文件功能并支持高亮vue语法和es6语法 ...
随机推荐
- HTML5与CSS3权威指南笔记案例1
第1章 <!DOCTYPE html> <meta charset = "UTF-8"> <title> Search </title&g ...
- 机器学习(Machine Learning)算法总结-K临近算法
一.算法详解 1.什么是K临近算法 Cover 和 Hart在1968年提出了最初的临近算法 属于分类(classification)算法 邻近算法,或者说K最近邻(kNN,k-NearestNeig ...
- [原创]K8 Jboss jmx-console getshell exploit
[原创]K8 Jboss jmx-console getshell exploit https://www.cnblogs.com/k8gege/p/10645858.html 0x00 前言 今天内 ...
- Lombok的@Data、@Setter、@Getter注解没反应问题解决
在用@Data注解时,没有生成setter/getter方法.百度了一堆都没解决方法,后来用Google查了一下解决了~~~ 使用IDEA需要安装Lombok插件,我这里已经下载好,如果没下载安装点击 ...
- 使用C# (.NET Core) 实现简单工厂(Simple Factory) 和工厂方法设计模式 (Factory Method Pattern)
本文源自深入浅出设计模式. 只不过我是使用C#/.NET Core实现的例子. 前言 当你看见new这个关键字的时候, 就应该想到它是具体的实现. 这就是一个具体的类, 为了更灵活, 我们应该使用的是 ...
- 解决SVN不显示绿色图标问题
今天是上班的第50天,发现项目上的svn绿色图标没有了,于是上网查了一下,然后很简单的就找到了解决办法: 修改注册表 Windows Explorer Shell支持Overlay Icon最多15个 ...
- sql server 性能调优之 资源等待 LCk
一. 概述 这次介绍实例级别资源等待LCK类型锁的等待时间,关于LCK锁的介绍可参考 “sql server 锁与事务拨云见日”.下面还是使用sys.dm_os_wait_stats 来查看,并找出 ...
- intellij idea maven project 无法显示dependencies
Intellj 自动载入Mave依赖是一个很人性化的功能,但不排除有时候会碰到问题,导致pom文件修改却没有触发自动重新载入的动作或者加载中途出现弱网的情况中断载入的,此时需要手动强制更新依赖. 如下 ...
- vue-08-axios-get-post-跨域
1, 安装 cnpm install axios --save 2, 在main.js中引入 import Axios from 'axios' // 挂在在Vue上Vue.prototype.$ax ...
- vue中使用refs定位dom出现undefined?
之前在公司做项目,一直感觉用ref来定位dom节点挺方便的.但是期间遇到了一个问题,就是在mounted(){}钩子里面使用this.$refs.xxx,打印出来的却是undefined? 于是我就对 ...