ECMAScript 6 学习系列课程 (ES6 箭头函数的使用)
2016-07-12 14:46
211 查看
在ES6语法中,简化了对函数的书写,其实,最初并不适应这样的写法,感觉很奇怪,但是永久了,发现这种方式更加直观,如果有了解swift语法的一定对箭头函数不陌生。
下面我们来看一下这个箭头函数在ES6中是如何应用的:
odds = evens.map(v => v + 1) pairs = evens.map(v => ({ even: v, odd: v + 1 })) nums = evens.map((v, i) => v + i)
我们对比看一下如果用ES5该如何书写:
odds = evens.map(function (v) { return v + 1; }); pairs = evens.map(function (v) { return { even: v, odd: v + 1 }; }); nums = evens.map(function (v, i) { return v + i; });
上面ES6语法中v,i 即为返回的参数,可能有些同学已经发现了有时候我们会在=>后面加上{}, 但是有的确没有加,区别在哪里呢?
首先,没有{} , 即执行完 默认返回,(return 操作)。
如果有{} 默认执行完是不返回的。
如果要返回一个对象,我们需要在=> 后面加上({})。
再看一个foreach的用法:
nums.forEach(v => { if (v % 5 === 0) fives.push(v) })
在箭头函数中,我们同样可以使用this语法,关于this相信大家都有一定了解,不做过多介绍了。
看一下ES6语法使用:
this.nums.forEach((v) => { if (v % 5 === 0) this.fives.push(v) })
如果长书写ES5语法的同学发现,这种写法如果在ES5中会报错的,this. 不能被找到, 如果想用this,需要用bind 函数,或者定义self = this 例如:
// variant 1 var self = this; this.nums.forEach(function (v) { if (v % 5 === 0) self.fives.push(v); }); // variant 2 (since ECMAScript 5.1 only) this.nums.forEach(function (v) { if (v % 5 === 0) this.fives.push(v); }.bind(this));
怎么ES6箭头函数,不仅简要,而且特别实用吧!
相关文章推荐
- ES6 走马观花(ECMAScript2015 新特性)
- React and React with ES6
- fetch 设置 HTTP 注意事项
- Mootools 1.2教程 函数
- autoit InputBox 函数
- 文件遍历排序函数
- 关于C#中排序函数的总结
- Oracle 函数大全[字符串函数,数学函数,日期函数]第1/4页
- ASP下经常用的字符串等函数参考资料
- PostgreSQL教程(五):函数和操作符详解(1)
- DOS批处理 函数定义与用法
- asp Chr 函数 数字转字母的方法
- Lua中的函数精讲笔记
- Lua中的闭合函数、非全局函数与函数的尾调用详解
- Lua中调用C++函数示例
- Lua实现split函数
- Lua常用时间函数使用实例
- Lua函数与字符串处理简明总结
- Lua学习笔记之表和函数