ES6新特性总结

ES6， 全称 ECMAScript 6.0 ，是 JavaScript 的下一个版本标准，Node.js 是运行在服务端的 JavaScript，webpack 是一个现代 JavaScript 应用程序的静态模块打包器 (module bundler) 

新特性：

变量声明：var test
变量初始化：var test = 'hello man'
变量提升：ES6之前，无论var声明在何处，都会被视为声明在函数的最顶部，只提升声明部分而不提升初始化部分。函数和变量声明都会被提升，但函数会首先被提升，然后才是变量声明。
即当js遇到script标签开始预解析，在函数执行之前也会进行预解析，如括号包裹的包含多条语句的立即执行函数，先将变量声明和函数声明提升，但此时并不会执行函数，其他语句顺序不变，然后按照上下文执行，上下文执行还是执行预解析操作，直到没有ver和function
而let的作用域是在当前的代码块，不会被提升到当前函数的最顶部
const用来声明常量，声明的常量必须提供一个值
如果const是一个对象，那么对象所包含的值是可以修改的
let或const会将声明关进一个TDZ（暂时性死区），只有执行到变量这句语句时，变量才会从小黑屋被放出来，才能被使用

 

字符串拼接：在反引号中使用${}来拼接字符串；通过反引号来拼接多行字符串

// 1.includes：判断是否包含然后直接返回布尔值
const str = 'hahay'
console.log(str.includes('y')) // true

// 2.repeat: 获取字符串重复n次
const str = 'he'
console.log(str.repeat(3)) // 'hehehe'
//如果你带入小数, Math.floor(num) 来处理
// s.repeat(3.1) 或者 s.repeat(3.9) 都当做成 s.repeat(3) 来处理

// 3. startsWith 和 endsWith 判断是否以 给定文本 开始或者结束
const str = 'hello world!'
console.log(str.startsWith('hello')) // true
console.log(str.endsWith('!')) // true

// 4. padStart 和 padEnd 填充字符串，应用场景：时分秒
setInterval(() => {
const now = new Date()
const hours = now.getHours().toString()
const minutes = now.getMinutes().toString()
const seconds = now.getSeconds().toString()
console.log(`${hours.padStart(2, 0)}:${minutes.padStart(2, 0)}:${seconds.padStart(2, 0)}`)
}, 1000)

箭头函数：
//例如：
[1,2,3].map(x => x + 1)

//等同于：
[1,2,3].map((function(x){
return x + 1
}).bind(this))

即省略function关键字、省略return关键字、继承上下文的this关键字
当你的函数有且仅有一个参数的时候，是可以省略掉括号的。当你函数返回有且仅有一个表达式的时候可以省略{} 和 return；例如:
var people = name => 'hello' + name
//参数name就没有括号
var people = (name, age) => {
const fullName = 'hello' + name
return fullName
}
//如果缺少()或者{}就会报错

三等号："==" 只要求值相等，两边值类型不一样时，先进行类型转换再比较;   "===" 要求值和类型都相等，两边类型不一致时，不进行类型转换；

!=返回同类型值比较结果,比较时，若类型不同，会尝试转换类型。!== 不同类型不比较，且无结果，同类型才比较

展开运算符（...）：组装对象或数组：
//数组
const color = ['red', 'yellow']
const colorful = [...color, 'green', 'pink']
console.log(colorful) //[red, yellow, green, pink]

//对象
const alp = { fist: 'a', second: 'b'}
const alphabets = { ...alp, third: 'c' }
console.log(alphabets) //{ "fist": "a", "second": "b", "third": "c"
}
有时候我们想获取数组或者对象除了前几项或者除了某几项的其他项
//数组
const number = [1,2,3,4,5]
const [first, ...rest] = number
console.log(rest) //2,3,4,5
//对象
const user = {
username: 'lux',
gender: 'female',
age: 19,
address: 'peking'
}
const { username, ...rest } = user
console.log(rest) //{"address": "peking", "age": 19, "gender": "female"
}
对于 Object 而言，还可以用于组合成新的 Object 。(ES2017 stage-2 proposal) 当然如果有重复的属性名，右边覆盖左边：
const first = {
a: 1,
b: 2,
c: 6,
}
const second = {
c: 3,
d: 4
}
const total = { ...first, ...second }
console.log(total) // { a: 1, b: 2, c: 3, d: 4 }
浅拷贝只是拷贝一层，更深层次的对象级别的只拷贝引用，这意味着当引用被改变时，原来数据中的这个对象也会发生改变。

深拷贝拷贝多层，每一级别的数据都会拷贝，通过递归函数。数组在前，因为数组也属于对象

浅拷贝方法：Object.assign(待拷贝对象，用该对象作为拷贝数据源)；

解构赋值：https://www.runoob.com/w3cnote/deconstruction-assignment.html

当解构模式有匹配结果，且匹配结果是 undefined 时，会触发默认值作为返回结果。