ES6 之箭头函数
标签 (空格分隔): 未分类
返回值
单行函数体默认返回改行计算结果, 多行需要指定返回值
- let c = (a,b)=>a+b;
- console.log(c(1,12));
- ES5
- "use strict";
- var c = function c(a, b) {
- return a + b;
- };
- console.log(c(1, 12));
- let c = (a,b)=>{a = a+b;a--}
- console.log(c(1,12));//undefined
- let c = (a,b)=>{a = a+b;return a--};
返回对象时写法 (否则报错)
- let c = (a,b)=>({
- a:a
- });
- or
- let d = (a,b)=>{
- return {
- a:a
- }
- }
this 指向
绑定外层函数 this(简化一个常见用法,_this = this)
在箭头函数出现之前, 每个新定义的函数都有其自己的 this 值 (例如, 构造函数的 this 指向了一个新的对象; 严格模式下的函数的 this 值为 undefined; 如果函数是作为对象的方法被调用的, 则其 this 指向了那个调用它的对象).//MDN
- ES5
- function Person(age) {
- var _this = this;
- this.age = age;
- setTimeout(function growUp() {
- console.log(this);
- _this.age++;
- }, 1000);
- }
- var p = new Person(26);
- ES6
- function Person(age) {
- this.age = age;
- setTimeout(()=> {
- console.log(this);
- this.age++;
- }, 1000);
- console.log(this.age);
- }
- var p = new Person(26);
使用 call 或 apply 调用
由于 this 已经在词法层面完成了绑定, 通过 call() 或 apply() 方法调用一个函数时, 只是传入了参数而已, 对 this 并没有什么影响.
arguments
箭头函数不会在其内部暴露出参数 (arguments ): arguments.length, arguments[0], 等等, 都不会指向箭头函数的 arguments, 而是指向了箭头函数所在作用域的一个名为 arguments 的值 (如果有的话, 否则, 就是 undefined.-- 译者注).
这种情况下, ES6 REST 参数可以替代
- function foo(n) {
- var f = (...args) => args[0]+args.length;
- return f(n);
- }
- foo(1); // 1
来源: http://www.bubuko.com/infodetail-3387431.html