deep-in-es6(六)
箭头函数 Arrow Functions
箭头函数在JavaScript诞生是就存在,JavaScript建议在HTML注释内包裹行内脚本,这样可以避免不支持JS代码的浏览器将JS显示为文本。
<script>
<!--
obj.style.height = "100px";//高度
//-->
</script>
老式浏览器将会代码解析成为两个不支持的标签和一条注释,只有新式浏览器才能识别出其中的JS代码。为了支持这种奇怪的hack方式,浏览器中的JavaScript引擎将<!-- 这四个字符解析为单行注释的起始部分,在node中也是。这种注释在ES6中背标中化了,但是在新标准中箭头函数被用来做其他的事情。
箭头序列-->同样是单行注释的一部分。古怪的是在HTML中-->之前的字符是注释的一部分,在在JS中-->之后的才是注释。但只有当箭头在行首时才会注释当前行,这是因为在其他上下文中-->是一个JS运算符:“趋向于”运算符!
function countdown(n) {
while(n --> 0) {//n趋向于0
console.log(n);
}
blastoff();
}
JavaScript中有一个有趣的特性,无论何时你需要一个函数时,可以想在添加的地方输入这个函数。
$("body").click(function() {
alert(0);
alert(2);
});
es6引入了一种编写函数的新语法:
es5:
var selected = allJobd.filter(function(job) {
return job.isSelected();
});
es6:
var selected = allJobs.filter(job => job.isSelect() );
当只有一个参数的简单函数时,可以使用新标准中的箭头函数:标识符=>表达式,无需输入function和return,一些大括号,小括号以及分号也可以省略。
如果有多个参数(没有参数,不定参数,默认参数,参数解构)的函数,需要用小括号包裹参数list。
es5:
function square(a,b) {
return a + b;
}
vae func = forEarch(add(a,b));
es6:
var func = foEach((a,b) => a+b,0);
出表达式外,箭头函数还可以包含一个块语句。
//es5
$("body").click(function(event) {
alert(0);
alert(12);
});
//es6:
$("body").click(event => {
alert(0);
alert(12);
});
注意:使用了箭头函数不会自动返回值,需要使用return语句将所需值返回。当时用箭头函数创建普通对象时,总是需要将对象包裹在小括号中。
var chewToys = pupies.map(pupy => {});//会报错
var chewToys = pupies.mao(pupy => ( {} ));//不会报错用小括号包裹空对象就可以。
箭头函数中的普通对象和代码块:
es6的规则是紧随箭头的{被解析为快的开始,而非对象的开始。所以如果使用箭头函数创建普通对象时要用小括号包裹起来。
箭头函数的this
箭头函数没有自己的this值,箭头函数内的this值继承自外围作用域。
{
addAll: function addAll(pieces) {
var self = this;
_.each(pieces,function(piece) {
this.add(piece);//this指代的是window或者undefined
self.add(piece);//子函数的self通过this传值解决
});
}
}
es6中就不必解决这种传值的方式
{
addAll: function(pieces) {
_.each(pieces,piece => this.add(piece));//他继承了外部addAllde this
}
}
箭头函数中没有arguments对象,可以使用不定参数,默认参数等。
deep-in-es6(六)的更多相关文章
- 转载 Deep learning:六(regularized logistic回归练习)
前言: 在上一讲Deep learning:五(regularized线性回归练习)中已经介绍了regularization项在线性回归问题中的应用,这节主要是练习regularization项在lo ...
- ES6(六) --- Symbol
概述: ES5 中属性名都是字符串,这容易就造成命名的冲突,特别是在混入模式(mixin模式)下.为解决这个问题ES6 引入了Symbol, Symbol是一种新的基本数据类型,表示独一无二的值! ...
- deep learning (六)logistic(逻辑斯蒂)回归中L2范数的应用
zaish上一节讲了线性回归中L2范数的应用,这里继续logistic回归L2范数的应用. 先说一下问题:有一堆二维数据点,这些点的标记有的是1,有的是0.我们的任务就是制作一个分界面区分出来这些点. ...
- [UFLDL] Basic Concept
博客内容取材于:http://www.cnblogs.com/tornadomeet/archive/2012/06/24/2560261.html 参考资料: UFLDL wiki UFLDL St ...
- [UFLDL] Linear Regression & Classification
博客内容取材于:http://www.cnblogs.com/tornadomeet/archive/2012/06/24/2560261.html Deep learning:六(regulariz ...
- 从ReadImage到ML- 一个不错的博客
实在对不起原作者,为了不把文章淹没在 转载的海洋里.... 原文链接: http://www.cnblogs.com/tornadomeet/archive/2012/09/26/270404 ...
- 六个漂亮的 ES6 技巧
六个漂亮的 ES6 技巧 转载 原文:2ality 译文:众成翻译 链接:http://www.zcfy.cc/article/346 在这篇文章里,我将演示 6 种 ES6 新特性的使用技巧.在每个 ...
- Deep Learning(深度学习)学习笔记整理系列之(六)
Deep Learning(深度学习)学习笔记整理系列 zouxy09@qq.com http://blog.csdn.net/zouxy09 作者:Zouxy version 1.0 2013-04 ...
- Deep Learning论文笔记之(六)Multi-Stage多级架构分析
Deep Learning论文笔记之(六)Multi-Stage多级架构分析 zouxy09@qq.com http://blog.csdn.net/zouxy09 自己平时看了一些 ...
- 从壹开始前后端分离 [ Vue2.0+.NET Core2.1] 十六 ║Vue基础:ES6初体验 & 模块化编程
缘起 昨天说到了<从壹开始前后端分离 [ Vue2.0+.NET Core2.1] 十五 ║ Vue前篇:JS对象&字面量&this>,通过总体来看,好像大家对这一块不是很 ...
随机推荐
- UI Framework-1: Aura Multi-desktop
Multi-desktop Aura now makes it possible for the same browser process to render to multiple desktops ...
- Javascript中正则的 match、test、exec使用方法和区别
总结: match 是str调用 test和exec是正则表达式调用 test只返回true或false, exec和match的结果是相同的,返回结果比较复杂
- springMVC+request.session实现用户登录和访问权限控制
用springmvc mybatis实现用户登录登出功能,使用session保持登录状态,并实现禁止未登录的用户访问.感谢谷歌资源,在这里做个学习记录加深自己的印象. 原文在我的https://my. ...
- Java基础学习总结(19)——Java环境变量配置
前言 学习java的第一步就要搭建java的学习环境,首先是要安装JDK,JDK安装好之后,还需要在电脑上配置"JAVA_HOME"."path"." ...
- JSTL标准标签库具体解释
JSTL标签库的使用是为类弥补html表的不足.规范自己定义标签的使用而诞生的. 在告别modle1模式开发应用程序后.人们開始注重软件的分层设计,不希望在jsp页面中出现java逻辑代码,同一时候也 ...
- 用react native 做的一个推酷client
用react native 做的一个推酷client 仅供大家參考.仅仅为抛砖引玉.希望大家能以此来了解react.并编写出很多其它的优质的开源库,为程序猿做出贡献. 用的的组件: Navigator ...
- CSS3 实现RSS图标
<html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>CSS3 实现RSS图标&l ...
- CodeForces 570B Simple Game 概率
原题: http://codeforces.com/contest/570/problem/B 题目: Simple Game time limit per test1 second memory l ...
- Android中App可分配内存的大小
现在真实测试结果: 1,为了搞清楚每个应用程序在Android系统中最多可分配多少内存空间,我们使用了真机进行测试,测试机型为魅族MX4 Pro,3G内存. 测试方法是直接申请一块较大的内存空间,看应 ...
- Select 选择算法 - 编程珠玑(续) 笔记
Select 算法 I 编程珠玑(续)介绍的 Quickselect 算法 选择 N 个元素中的第 K 小(大)值,是日常场景中常见的问题,也是经典的算法问题. 选取 N 个元素的数组的中的第 K 小 ...