Days23 Es6

2018-08-24  本文已影响0人  biu丶biubiu

1.默认参数

默认参数,可以直接在传值的地方写不需要 || 了 (es5在  || 后面写默认值,当默认为0时,有bug)

var link = function(height = 50, color = 'red', url = 'http://azat.co') { }

2.模板对象${  }

es5中需要拼接字符串,多了就容易出错 var name = 'Your name is ' + first + ' ' + last + '.';

es6中新的语法$ {NAME},并把它放在反引号里:var name = `Your name is ${first} ${last}. `;

3.多行字符串

es5中需要' ' +' ' + ' '

es6直接在反引号中即可 :  `  `

参考csdn:es5和es6对比

4.解构赋值 添加属性

es5

var data = $('body').data();

var house = data.house,

var mouse = data.mouse;

es6

var { house ,mouse } = $( 'body' ).data( )

解构赋值

let{foo,bar}={foo:"aaa",bar:"bbb"};对象不在意顺序,属性同名就行

5.增强的对象字面量

6.箭头函数

函数名(形参)=>  { }

以前我们使用闭包,this总是预期之外地产生改变,而箭头函数的迷人之处在于,现在你的this可以按照你的预期使用了,身处箭头函数里面,this还是原来的this

es5

var ids = ['5632953c4e345e145fdf2df8', '563295464e345e145fdf2df9'];

var messages = ids.map(function (value, index, list) {

  return 'ID of ' + index + ' element is ' + value + ' ';

});

es6

var ids = ['5632953c4e345e145fdf2df8','563295464e345e145fdf2df9']

var messages = ids.map((value, index, list) => `ID of ${index} element is ${value} `);

7.Promise

Promise,简单说就是一个容器,里面保存着某个未来才会结束的事件(通常是一个异步操作)的结果。从语法上说,Promise 是一个对象,从它可以获取异步操作的消息。Promise 提供统一的 API,各种异步操作都可以用同样的方法进行处理。

es5 es6

8.Let & Const

在ES6中,我们用let限制块级作用域。而var是限制函数作用域。

let不允许在相同作用域内,重复声明同一个变量。

const,它就是一个不变量,也是块级作用域就像let一样。

9.Classes 类

ES6没有用函数, 而是使用原型实现类

class AccountModel extends baseModel

10.模块化

module.js

export var port = 3000;

export function getAccounts(url) { }

main.js

import {port, getAccounts} from 'module';

11.Symbol

Symbol,表示独一无二的值。它是 JavaScript 语言的第七种数据类型,前六种是:undefined、null、布尔值(Boolean)、字符串(String)、数值(Number)、对象(Object)。

let   s=Symbol();

12.set  &  map

ES6 提供了新的数据结构 Set。它类似于数组,但是成员的值都是唯一的,没有重复的值。

// 去除数组的重复成员[...newSet(array)]

JavaScript 的对象(Object),本质上是键值对的集合(Hash 结构),但是传统上只能用字符串当作键

ES6 提供了 Map 数据结构。它类似于对象,也是键值对的集合,但是“键”的范围不限于字符串,各种类型的值(包括对象)都可以当作键。

map
上一篇 下一篇

猜你喜欢

热点阅读