标签: es6 javascript


箭头函数

ES6为了书写方便引入了函数的全新简写方式-箭头函数

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
</head>
<body>
<script>
//es5完法
var show0 = function(str){
console.log(str);
}
//es6写法
let show1 = (str)=>{
console.log(str);
}
show0('这是测试0!');
show1('这是测试1!');
</script>
</body>
</html>

测试地址

箭头函数的一些特性

  • 当只有一个参数的时候可以省略括号
  • 当只有一个return语句的时候,大括号和return可以省略
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
</head>
<body>
<script>
let show0 = (str)=>{
console.log(str);
}
//省略括号
let show1 = str=>{
console.log(str);
}
let show2 = (str)=>{
return str
}
//省略括号与中括号和return语句
let show3 = str=>str;
show0('测试0!');
show1('测试1!');
console.log(show2('测试2!'));
console.log(show3('测试3!'));
</script>
</body>
</html>

测试地址

参数的变化

-参数的扩展/数组展开(...)

-默认参数

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>函数参数变化</title>
</head>
<body>
<script>
//收集余下参数并展开使用,...args必须放么最后,收集余下的所有可能的参数
function show(a,b,...args){
console.log(a,b,...args);
}
show(1,2,5,6);
//展开数组
let arr0=[1,2,3];
let arr1=[4,5,6];
let arr =[...arr0,...arr1];
console.log(arr);
//默认参数,当b/c没有传入值时取默认值,如果有传入则取传入值
function show0(a,b=1,c=2){
console.log(a,b,c);
}
show0(0);
</script>
</body>
</html>

测试地址

粗看ES6之函数的更多相关文章

  1. 粗看ES6之数组

    标签: javascript es6 数组新增方法 map(可以理解为是映射,以一定规则修改数组每一项并返回全新数组) reduce(可以理解为是汇总,一堆出来一个) filter(可以理解为过滤,筛 ...

  2. 粗看ES6之变量

    标签: javascript var定义变量面临的问题 可以重复定义 无法限制变量不可修改 无块级作用域 ES6变量定义升级 新增let定义变量 新增const定义常量 let特性 有块级作用域 不可 ...

  3. 粗看ES6之面向对象写法

    标签: es6 在es6以前,js没有类的概念,虽然有构造函数原型的方式用来做面向对向开发,但是对于书法并不是十分友好,而且对于继承实现也不是十分友好. es6引入class constructor ...

  4. 粗看ES6之JSON

    标签: es6 ES6新增JSON特性不是特别多,只是针对JSON某些情况下的写法上有一些优化: 当key值和value值对应变量名相同时 json对像中的方法书写 示例代码如下: <!DOCT ...

  5. 粗看ES6之字符串

    标签: javascript es6 字符串新增特性 新增二个方法 - startsWith/endsWith 字符串模板 - 反单引号的应用 startsWith 判断字符串以是否以某某开头,返回一 ...

  6. 粗看ES6之解构赋值

    标签: javascript es6 什么是解构赋值? 示例如下: <!DOCTYPE html> <html> <head> <meta charset=& ...

  7. 新手必看ES6基础

    ES6 基础 一.新的变量声明方式 let/const 与var不同,新的变量声明方式带来了一些不一样的特性,其中最重要的两个特性就是提供了块级作用域与不再具备变量提升. 通过2个简单的例子来说明这两 ...

  8. ES6 — 箭头函数

    一 为什么要有箭头函数 我们在日常开发中,可能会需要写类似下面的代码 const Person = { 'name': 'little bear', 'age': 18, 'sayHello': fu ...

  9. 前端分享----JS异步编程+ES6箭头函数

    前端分享----JS异步编程+ES6箭头函数 ##概述Javascript语言的执行环境是"单线程"(single thread).所谓"单线程",就是指一次只 ...

随机推荐

  1. dede地图显示最新文章的解决方法

    以DEDECMS5.6为例:sitemap.htm 在/templets/plus/目录里,就算添加了织梦相关标签调用,但却不能显示文章. 这是因为makehtml_map.php不能解析织梦的相关调 ...

  2. C语言数据结构-循环队列的实现-初始化、销毁、清空、长度、队列头元素、插入、删除、显示操作

    1.数据结构-循环队列的实现-C语言 #define MAXSIZE 100 //循环队列的存储结构 typedef struct { int* base; //基地址 int _front; //头 ...

  3. Unity---编辑器扩展---更新中

    目录 1.Unity编辑器扩展介绍 2.具体功能 2.1.在菜单栏中添加扩展 2.2.为扩展事件添加快捷键 2.3.Hierarchy,Project视图中右键添加扩展 2.4.使用Selection ...

  4. 线段树 SP1716 GSS3 - Can you answer these queries III

    SP1716 GSS3 - Can you answer these queries III 题意翻译 n 个数,q 次操作 操作0 x y把A_xAx 修改为yy 操作1 l r询问区间[l, r] ...

  5. java经典学习路线

    恩,做开发的工作已经三年多了,说起来实在是惭愧,自己的知识树还像一棵小草一样,工作中使用到了许多的知识和技术,不过系统性不够.根基不牢.并且不够深入!当然,慢慢的我也更加的清楚,我需要学习一些什么样的 ...

  6. Winscp使用密钥登录

    Winscp使用密钥登录 背景:通常我们使用winscp通过密码认证去连接服务器进行文件的ftp操作,但是为了安全,我们服务器上经常会禁止使用密码连接,而改用密钥认证.而且服务器上经常会禁止root用 ...

  7. vue js 实现 树形菜单

    添加一个模板.<template id="menu-template"> <li v-if="model.nodes!=undefined"& ...

  8. C++_静态类成员

    在C++中,静态成员是属于整个类的而不是某个对象. 静态成员变量只存储一份供所有对象共用,所以在所有对象中都可以共享它. 使用静态成员变量实现多个对象之间的数据共享不会破坏隐藏的原则,保证了安全性还可 ...

  9. C语言文件I/O和标准I/O函数

    读取/写入  相对于文件而言 输入/输出 相对于程序/内存而言 一切皆文件,键盘.显示屏也是文件,只不过是特殊的标准文件: 标准文件:标准输入.标准输出.标准错误:---->对应的文件指针:st ...

  10. rent bike问题(二分+贪心)

    题目描述: A group of n schoolboys decided to ride bikes. As nobody of them has a bike, the boys need to ...