ES2015概述

ES2015的目标

-解决原有语法上的一些问题或者不足
-对原有语法进行增强
-全新的对象、全新的方法、全新的功能
-全新的数据类型和数据结构

ES2015 let与块级作用域

1.在这之前ES只有两种作用域,分别是全局作用域和函数作用域,在ES2015中新增了块级作用域。
2.使用let声明变量
3.var声明的是全局变量,例如

var elements = [{}, {}, {}]
for (var i = 0; i < elements.length; i++){
  elements[i].onclick = function () {
    console.log(i)  
  }
}
elements[2].onclick();
// 无论是哪个elements的数组成员调用onclick()打印结果是3

const 恒量/常量

-声明过后不允许修改
-不能改变内存指向,但是可以对其进行添加属性

数组的解构

const arr = [100, 200, 300]
const [first, second, third] = arr
const [, , four] = arr
const [f1, ...rest] = arr
const [f1, f2, f3, more] = arr
const [f1, f2, f3, defaultValue = 'default value'] = arr
console.log(first, second, third) // 100 200 300
console.log(four) // 300
console.log(rest) // [200 ,300]
console.log(more) // undefined
console.log(defaultValue ) // default value

对象的解构

const obj = {name: 'zce', age: 18}
const {name} = obj
console.log(name) // zce

避免名称重复进行重命名

const name = 'tom'
const {name : objName} = obj
console.log(objName) // zce

解构方法简化代码编写

const {log} = console
log('test')
log('test1')
log('test2')

模板字符串

-字符串换行直接回车即可无需使用\n转义字符

const str = `this is 
my word`

-通过插值表达式嵌入对应数值

const name = 'tom'
const msg = `Hey, ${name}`

-带标签模板字符串

const name = 'tom'
const gender = true
function myTagFunc(string) {
const sex = gender ? 'man' : 'woman'
  return string[0] + name + string[1] + sex + string[2]
}
const result = myTagFunc`hey, ${name} is a ${gender}.`
console.log(result) // hey, tom is a man.

-字符串扩展方法
include()、startsWith()、endsWith()

const message = 'Error: foo is not defined.'
console.log(message.startsWith('Error')) // true
console.log(message.endsWith('.')) // true
console.log(message.include('foo')) // true

你可能感兴趣的:(ES2015概述)