ES6新特性学习（一）

想要在浏览器端使用ES 2015最新语法，其实很简单，只需要一个转换器即可，Babel是ES 2015最流行的转换器之一，Babel加上各种插件和polyfill能基本上支持绝大部分新语法。

let和const

• let。let声明的变量拥有块级作用域，

for(let i = 0;i<5;i++){}console.log(i); // i is not definded

• const
  const则很直观，用来定义常量，即无法被更改值的变量。

箭头函数 =>

箭头函数通常比匿名函数还要简洁，以后会不会全部都用箭头函数呢？

• 语法，左边参数，右边内容

let fn = () => {    console.log('hello world');};

不过，使用时this的指向需要注意，比如绑定事件

$('#selector').on('click', () => {    $(this).addClass('new');});

会被翻译成

var _this = this;$('#selector').on('click', function() {    $(_this).addClass('new');});

this为全局变量

模板字符串/template strings

模板字符串使用反引号 (` `) 来代替普通字符串中的用双引号和单引号。模板字符串可以包含特定语法(${expression})的占位符。

• 使用表达式引用变量，非常有利于拼接html

let index = 1;console.log(`${index}`);

• 多行字符串

console.log(`string text line 1string text line 2`);// "string text line 1// string text line 2"

不定参数和默认参数

不定参数和默认用处非常大，从此再也不用写一大堆参数判断的代码了。

• 默认参数

let add = (a,b=1)=>(a+b);add(1);// 2

• 不定参数

/将所有参数相加的函数function add(...args){    console.log(args);     return args.reduce((m,n)=>m+n);}//传递任意个数的参数console.log(add(1,2,3));//输出：6console.log(add(1,2,3,4,5));//输出：15

还要注意，以前的arguments是类数组对象，ES6中这里的args就是真正的数组了

Symble

ES5 的对象属性名都是字符串，这容易造成属性名的冲突。
ES6引入了原始数据类型Symbol，表示独一无二的值。它是 JavaScript 语言的第七种数据类型，前六种是：

• undefined
• null
• Boolean
• String
• Number

• Object

  • 用法

let s = Symbol();typeof s// "symbol"

var s1 = Symbol('foo');var s2 = Symbol('bar');s1 // Symbol(foo)s2 // Symbol(bar)s1.toString() // "Symbol(foo)"s2.toString() // "Symbol(bar)"

for of 值遍历

for in 循环用于遍历数组，类数组或对象，ES6中新引入的for of循环功能相似，不同的是每次循环它提供的不是序号而是值。

var arr = [ "1", "2", "3" ];for (v of arr) {    console.log(v);//输出 1,2,3}