箭头函数,生成器入门

Posted on   |   In   |  

箭头函数感觉是匿名函数的简写, 应该是为了绑定作用域,
不然感觉还不如传统写法的function好理解

生成器感觉也没什么用… 可能是出个规范用来简化异步回调的

箭头函数

匿名函数的简写

比如:

1
2
3
4
5
6
7
var add = (a, b) => {a + b}//单条return语句大括号可省略
// 相当于
// var add = function(a,b){
//   return a+b;
// }
console.log(typeof add); // "function"
add(3, 8) // 11

绑定作用域

1
2
3
4
//省略了闭包写法self, that, 或者强制apply(), bind()一类的
document.addEventListener('click', event => {
    console.log(event)
})

不让用arguments

1
2
3
//不知道为什么这么限制
var fun = (a) => {console.log(arguments)}
fun("arg")

Generators

这部分看了好几个介绍都是function*和yield相互解释…

其实感觉就是function* 里边用yield 代替return
但是yield并没有把函数彻底返回(仍然保存着现场),直到下一个next再yield,
借此实现异步的回调

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
function* simpleGenerator(){
  yield "first";
  yield "second";
  for (var i = 0; i < 3; i++){
    yield i;
  }
  yield "third";
}
var g = simpleGenerator();
//每一次调用next() 都会返回下一个yield,
//直到没得返回, done置成ture
console.log(g.next()); //{value: "first", done: false}
//console.log(g.return()); 如果提前return, 后边就都是undefined, done就是true了, 
console.log(g.next().value); //"second"
console.log(g.next().value); //0
console.log(g.next().value); //1
console.log(g.next().value); //2
console.log(g.next().value); //"third"
console.log(g.next()); //{value: undefined, done: true}

感觉没什么用啊… 可能是出个规范用来简化异步回调的,
promise不是挺好么… 可能浏览器内部有优化吧