ES6新特性-函数的简写(箭头函数)
通常函数的定义方法
var fn = function(...){
......
}
//例如:
var add = function(a,b){
return a+b;
}
//或者:
function fn(...){
......
}
//例如:
function add(a,b){
return a+b;
}
简写方法速记
将原函数的“function”关键字和函数名都删掉,并使用“=>”连接参数列表和函数体。
function add(a,b){
return a+b;
}
//简写为:
(a,b)=>{//删掉了function和函数名
return a+b;
}
var add = function(a,b){
return a+b;
}
//简写为:
var add = (a,b)=>{ //删掉了function
return a+b;
}
附加规则
- 当函数参数只有一个时,括号可以省略;但是没有参数时,括号不可以省略。
- 函数体(中括号)中有且只有一行return语句时,中括号及return 关键字可以省略。
新旧函数定义的对比
无参数函数
let fn = function(){
return 'helloWorld';
}
//简写为:
let fn = ()=>{//但是没有参数时,括号不可以省略
return 'helloWorld';
}
//根据规则二,简写为:
let fn = ()=>'helloWorld';
一个参数的函数
let fn = function(a){
return a;
}
//简写为:
let fn = (a)=>{
return a;
}
//根据规则一,还可以简写为:
let fn = a=>{
return a;
}
//根据规则二,还可以简写为:
let fn = a=>a;
多个参数的函数
let fn = function(a,b){
return a+b;
}
//简写为:
let fn = (a,b)=>{//多于一个参数,圆括号不可省略
return a+b;
}
//根据规则二,还可以简写为:
let fn = (a,b)=>a+b;
函数体代码多于一行
let fn = function(){
console.log('hello');
console.log('world');
return 'helloWorld';
}
//简写为:
let fn = ()=>{
console.log('hello');
console.log('world');
return 'helloWorld';
}
函数返回json对象时
let fn = function(){
return {"a":5};
}
//简写为:
//let fn = ()=>{"a":5};这是错误的
//应简写为:
let fn = ()=>({"a":5});//注意{}外的圆括号。
实例
//排序方法1
let arr = [3,6,2,1];
let arr2 = arr.sort(function(a,b){
return a-b;
});
alert(arr2); //排序方法2
let arr3 = [939,23,0,-1,94];
let arr4 = arr3.sort((a,b)=>a-b);
alert(arr4);
ES6新特性-函数的简写(箭头函数)的更多相关文章
- ES6新特性三: Generator(生成器)函数详解
本文实例讲述了ES6新特性三: Generator(生成器)函数.分享给大家供大家参考,具体如下: 1. 简介 ① 理解:可以把它理解成一个函数的内部状态的遍历器,每调用一次,函数的内部状态发生一次改 ...
- ES6新特性(函数默认参数,箭头函数)
ES6新特性之 函数参数的默认值写法 和 箭头函数. 1.函数参数的默认值 ES5中不能直接为函数的参数指定默认值,只能通过以下的变通方式: 从上面的代码可以看出存在一个问题,当传入的参数为0或者 ...
- ES6学习笔记<二>arrow functions 箭头函数、template string、destructuring
接着上一篇的说. arrow functions 箭头函数 => 更便捷的函数声明 document.getElementById("click_1").onclick = ...
- 【转】C++11 标准新特性:Defaulted 和 Deleted 函数
原文链接http://www.ibm.com/developerworks/cn/aix/library/1212_lufang_c11new/ 本文将介绍 C++11 标准的两个新特性:defaul ...
- ES6新特性简介
ES6新特性简介 环境安装 npm install -g babel npm install -g babel-node //提供基于node的REPL环境 //创建 .babelrc 文件 {&qu ...
- 前端学习笔记 --ES6新特性
前言 这篇博客是我在b站进行学习es6课程时的笔记总结与补充. 此处贴出up主的教程视频地址:深入解读ES6系列(全18讲) 1.ES6学习之路 1.1 ES6新特性 1. 变量 2. 函数 3. 数 ...
- ES6新特性概览
本文基于lukehoban/es6features ,同时参考了大量博客资料,具体见文末引用. ES6(ECMAScript 6)是即将到来的新版本JavaScript语言的标准,代号harmony( ...
- 必须掌握的ES6新特性
ES6(ECMAScript2015)的出现,让前端开发者收到一份惊喜,它简洁的新语法.强大的新特性,带给我们更便捷和顺畅的编码体验,赞! 以下是ES6排名前十的最佳特性列表(排名不分先后): 1.D ...
- 你不知道的JavaScript--Item24 ES6新特性概览
ES6新特性概览 本文基于lukehoban/es6features ,同时参考了大量博客资料,具体见文末引用. ES6(ECMAScript 6)是即将到来的新版本JavaScript语言的标准,代 ...
- 前端入门21-JavaScript的ES6新特性
声明 本篇内容全部摘自阮一峰的:ECMAScript 6 入门 阮一峰的这本书,我个人觉得写得挺好的,不管是描述方面,还是例子,都讲得挺通俗易懂,每个新特性基本都还会跟 ES5 旧标准做比较,说明为什 ...
随机推荐
- iOS开发多线程之GCD
Grand Central Dispatch(GCD)是异步执行任务的技术之一.一般将应用程序中记述的线程管理用的代码在系统级中实现.开发者只需要定义想执行的任务并追加到适当的Dispatch Que ...
- Android 杂谈---ListView 之BaseAdapter
前言 几种适配器里面相对来说比较简单的一种适配器,在使用时需要实现几个方法,并且也需要对convertView进行优化 此篇文章以使用listView与BaseAdapter来实现表格样式的布局举例( ...
- Golang 新手可能会踩的 50 个坑【转】
译文:https://github.com/wuYin/blog/blob/master/50-shades-of-golang-traps-gotchas-mistakes.md 原文:50 Sha ...
- CodeForces - 833B The Bakery
题解: 线段树经典应用 首先暴力$f[i][j]$表示考虑前i位分成j段的最大值 转移$f[k][j-1]+cost(k+1,i)$枚举k转移 不同数的经典套路就是从它到它前驱这一段 于是维护每个数前 ...
- mybatis查询语句的背后
转载请注明出处... 一.前言 在先了解mybatis查询之前,先大致了解下以下代码的为查询做了哪些铺垫,在这里我们要事先了解,myabtis会默认使用DefaultSqlSessionFactory ...
- css常用布局
1.一列布局 html: <div class="header"></div> <div class="body">< ...
- [Mongo]Linux上启动与关闭MongoDB
文档地址:https://docs.mongodb.com/v3.0/tutorial/install-mongodb-on-amazon/ 默认配置下,Mongo实例会将其数据文件存放在/var/l ...
- Python开发技术详解PDF
Python开发技术详解(高清版)PDF 百度网盘 链接:https://pan.baidu.com/s/1F5J9mFfHKgwhkC5KuPd0Pw 提取码:xxy3 复制这段内容后打开百度网盘手 ...
- Python 之map、filter、reduce
MAP 1.Python中的map().filter().reduce() 这三个是应用于序列的内置函数,这个序列包括list.tuple.str. 格式: 1>map(func,swq1[,s ...
- Java课程课后作业190309之连续最大子数组
老师在课堂是提出了这个问题,并且提出了时间复杂度是O(n)的要求,一开始我自己思想简单,在逻辑上出现了十分粗心的错误,后来同学们也在课堂上比较激烈地讨论了一番,也只是将时间复杂度降到了O(n*n),在 ...