ES6介绍二 函数的增强
ES6对于函数的使用新增了很多实用的API,JS的函数跟很多后台语言PHP,ASP.NET开始看齐:
1. 参数默认值:
以前我们为了给函数创建默认值,必须用一种冗杂的语句,而且有歧义的语句。
//ES5
function myTest(name){
name = name || "default";
console.log(name);
}
//ES6
function myTest(name = "default"){
console.log(name);
}
在ES5中,如果name传入了布尔值false将会产生歧义,而且也不直观,ES6的语法明显简洁很多。
参数默认值通常写在尾部,以便可以省略赋值。
2. reset参数
reset参数是ES6中用于代替arguments对象的一个方法,arguments是类数组,不完全是数组,无法使用sort,slice等方法,而reset是真正的数组:
//ES5
function sortArray(){
var args = Array.prototype.slice.call(arguments);
args.sort();
}
//ES6
function sortArray(...args){
args.sort();
}
args同样也只能放在末尾
function print(name,city,...others){
var str = name + city;
for(var item of others){
str += item;
}
}
print("mic","shenzhen","male","married");
3. name属性
函数具有name属性返回函数名
function myFunc() {}
myFunc.name // "myFunc"
4. 箭头函数
箭头函数是ES6中简化函数代码的一个重要特性,可以简化代码
//es5
function myFunc(){
console.log("hello");
}
function myFunc(name){
console.log(name);
}
function add2(num){
return num+2;
}
function add2(num1,num2){
return num1+num2;
}
function myFunc(){
return {
res:true,
msg:""
}
} //es6
()=>console.log("hello"); name=>console.log(name); num=>num+2; (num1,num2)=>num1+num2; ()=>({res:true,msg:""})//返回对象需要括号括起来
在forEach场景比较常见,明显简洁很多:
//es5
var list = [1,2,3,4,5,6]; list.forEach(function(num){
return num + 1;
}); //es6
let list = [1,2,3,4,5,6];
list.forEach(num=>num+1);
箭头函数有一些特点:
(1) 本身没有this对象,引用this对象是指定义箭头函数的对象
//es5
{
addAll:function(pieces) {
var self = this;
pieces.forEach(function(piece){
self.add(piece);
});
},
}
//es6
{
addAll(pieces){
piece.forEach(piece=>this.add(piece));
}
}
有何不同,ES5中forEach函数的this对象默认不是外层函数的this对象,所以需要用一个变量来引用,而箭头函数里面this指的就是定义箭头函数的对象,所以就是当前对象。
(2) 不能作为构造函数
(3) 没有arguments对象,可以用rest替代
(4) 不能作为Generator函数
ES6介绍二 函数的增强的更多相关文章
- ES6里关于函数的拓展(二)
一.构造函数 Function构造函数是JS语法中很少被用到的一部分,通常我们用它来动态创建新的函数.这种构造函数接受字符串形式的参数,分别为函数参数及函数体 var add = new Functi ...
- C#构造方法(函数) C#方法重载 C#字段和属性 MUI实现上拉加载和下拉刷新 SVN常用功能介绍(二) SVN常用功能介绍(一) ASP.NET常用内置对象之——Server sql server——子查询 C#接口 字符串的本质 AJAX原生JavaScript写法
C#构造方法(函数) 一.概括 1.通常创建一个对象的方法如图: 通过 Student tom = new Student(); 创建tom对象,这种创建实例的形式被称为构造方法. 简述:用来初 ...
- ES6学习一 JS语言增强篇
一 背景 JavaScript经过二十来年年的发展,由最初简单的交互脚本语言,发展到今天的富客户端交互,后端服务器处理,跨平台(Native),以及小程序等等的应用.JS的角色越来越重要,处理场景越来 ...
- vue框架入门和ES6介绍
vue框架入门和ES6介绍 vue-mvvm模式,vue是一种轻量级的前端框架,主要为模板渲染,数据同步,组件化,模块化,路由等. https://cn.vuejs.org/ 源码:https://g ...
- 《前端之路》- TypeScript(二) 函数篇
目录 一.定义函数方法 二.定义函数传参 三.可选传参 四.默认传参 五.传递剩余参数 六.函数重载 七.箭头函数 八.总结 一.定义函数方法 在 es5 中定时函数的方法有 命名函数和函数表达式(匿 ...
- React和ES6(二)ES6的类和ES7的property initializer
React与ES6系列: React与ES6(一)开篇介绍 React和ES6(二)ES6的类和ES7的property initializer React与ES6(三)ES6类和方法绑定 React ...
- ES6 入门系列 - 函数的扩展
1函数参数的默认值 基本用法 在ES6之前,不能直接为函数的参数指定默认值,只能采用变通的方法. function log(x, y) { y = y || 'World'; console.log( ...
- ES6笔记② 箭头函数
特性介绍 箭头函数是ES6新增的特性之一,它为JS这门语言提供了一种全新的书写函数的语法. //ES5 function fun(x,y){ return x+y; } console.log(fun ...
- Lucene.Net 2.3.1开发介绍 —— 二、分词(五)
原文:Lucene.Net 2.3.1开发介绍 -- 二.分词(五) 2.1.3 二元分词 上一节通过变换查询表达式满足了需求,但是在实际应用中,如果那样查询,会出现另外一个问题,因为,那样搜索,是只 ...
随机推荐
- 小米范工具系列之一:小米范 web查找器
最新版本1.5,下载地址:http://pan.baidu.com/s/1c1NDSVe 文件名web finder,请使用java1.8运行 小米范 web查找器主要功能为快速端口扫描,并识别we ...
- 【Javascript】Windows下Node.js与npm的安装与配置
1:先下载Node.js,网站https://nodejs.org/en/,左侧为稳定版,右侧为最新版,推荐稳定版 2:Node.js安装,运行下载后的.msi文件,一路下一步就可以了,我选择的安 ...
- Atom预览markdown插件Markdown Preview Enhanced
atom 上目前最强的 markdown 插件Markdown Preview Enhanced 是一款为 ATOM 编辑器编写的超级强大的 Markdown 插件.这款插件意在让你拥有飘逸的 Mar ...
- eval(PHP 4, PHP 5)
eval — 把字符串作为PHP代码执行 说明 mixed eval ( string $code_str ) 把字符串 code_str 作为PHP代码执行. 除了其他,该函数能够执行储存于数据库文 ...
- AbstractQueuedSynchronizer,Lock,Synchronized
Lock和Synchronized的区别 Lock实现了与synchronized相同的互斥性和内存可见性. synchronized代码简单,并且与处理异常操作实现了很好的交互. synchroni ...
- [py][lc]python高阶函数(匿名/map/reduce/sorted)
匿名函数 - 传入列表 f = lambda x: x[2] print(f([1, 2, 3])) # x = [1,2,3] map使用 传入函数体 def f(x): return x*x r ...
- VS2010/MFC编程入门之二十三(常用控件:按钮控件的编程实例)
上一节VS2010/MFC编程入门教程中鸡啄米讲了按钮控件Button.Radio Button和Check Box的基本用法,本节就继续讲按钮控件的内容,通过一个实例让大家更清楚按钮控件在实际的软件 ...
- Python: 使用生成器创建新的迭代模式
使用一个生成器函数来定义一个函数模式. def frange(start, stop, increment): x = start while x < stop: yield x x += in ...
- springcloud8----feign-with-hystrix
Feign也可以使用Hystrix: package com.itmuch.cloud; import org.springframework.boot.SpringApplication; impo ...
- 使用Linux重定向解决nohup.out无写权限问题
■场景 执行nohup命令的时候,经常会出现下面这种没有写入权限的错误. nohup: ignoring input and appending output to `nohup.out'nohup: ...