ES6新增属性
因为node用的大部分是ES6的语法,所以要先学习一下ES6新语法
let-变量声明
在ES5中的变量声明为var,而ES6新增变量声明let
区别 | var | let |
变量提升 | √ | × |
块级作用域 | ×(函数作用域) | √ |
重复声明 | √ | × |
重新赋值 | √ | √ |
const-常量声明
- 没有变量提升
- 新增块级作用域
- 不可重复声明
- 不可以重新赋值
- 必须初始化
对象的解构赋值
就是把一个对象的属性对应的值赋值给了一个或多个变量
- 写法:
- 期中左边的为对象的键对应的值,右边的是要被赋值的变量
let { name: name1, age: age1 } = {name: '名字',age: 18}
console.log(name1, age1)
- 简写:
- 如果对象的键和变量一个名就可以简写为:
let { name: name, age: age } = {name: '名字',age: 18}
//上面的简写
let { name, age } = obj
- 默认值:
- 如果对象的属性值为undefined时触发默认值
- 否者就算有默认值还会赋值为对象的属性值
let { name, age, favor = '打游戏' } = {name: '名字',age: 18}
数组的解构赋值
把数组的值依次赋值给变量
- 写法:
- 在一个中括号中写入要赋值的变量
let [num1, num2, num3] = [1, 2, 3]
- 默认值
- 如果数组的值为undefined时触发默认值
- 否者就算有默认值还会赋值为数组的值
let [nu1, nu2, nu3, nu4 = 100] = [1, 2, 3]
- 特殊写法:
- …变量(把后面的元素都装进一个数组中并赋值给变量)
- 不想赋值就写一个","就会略过对应元素
let [head, ...tail] = [1, 2, 3, 4];
console.log(x, tail)//1 [ 2, 3, 4 ]
let [x, , y] = [1, 2, 3];
console.log(x, y)//1 3
解构赋值配合函数声明
可以利用解构赋值来简化传参和可以设置默认值
function fun({ name, age, favor = '默认值' } = {}) {
console.log(name, age, favor)
}
//相当于:{ name, age, favor = '默认值' }={name: 'zjl',age: 20}
fun({
name: 'zjl',
age: 20
})
//相当于指向默认值{}
fun()
箭头函数
箭头函数就是匿名函数的一个简写
- 箭头函数的简写规律
//test 1
var f = name => console.log(name)
f('zjl')
//test 2
var fu = () => true
console.log(fu())
//test 3
var fun = (name, age) => {
console.log(name, age)
return false
}
console.log(fun('zjl', 18))
对象成员的简写
如果有变量和对象中的键的名称一样时,对象就可以进行简写
- 除了属性可以简写,方法也可以简写
let name = 'zjl';
let age = 18;
let obj = {
name,//name:name
age,//age:age
item: age,
sayMe() {//sayMe:function(){console.log('hello world!')}
console.log('hello world!')
}
}
展开运算符
展开运算符分为,对象展开和数组展开
- 对象展开
就是把一个对象的所有元素赋值到另一个对象中
let boy = {
name: '王刚',
age: 20
}
let favor = {
kill: '征服',
sayHi() {
console.log('滚!!')
}
}
let obj = {
...boy,//就相当于boy对象的所有元素
...favor,//就相当于favor对象的所有元素
name: 'zjl'//boy也有name属性,但是这个是后写的,所以要覆盖boy中的name属性
}
- 数组展开
把数组的每个值拎出来
/**
* 数组展开主要应用于:
* 数组拼接
* Math.min()和Math.max()
*/
//数组拼接
let list1 = [1, 2, 3]
let list2 = [...list1, 4, 5, 6]
console.log(...list1)//1,2,3
//数组最大值,最小值
//以前做法
console.log(Math.max.apply(Math, list2))//6
//数组展开做法
console.log(Math.max(...list2))//6
Set数据类型
- 用途:数组去重
- 返回值:Set类型的对象
var arr = [10, 20, 30, 40, 10, 20, 50]
//方式1
var arrSet = new Set(arr)
//因为是个Set类型的对象。要转回成数组
var newArr = [...arrSet]
//方式2(简写)
let newarr = [...new Set(arr)]
模板字符串
用``表示,会保留原样字符串格式,以及可以占位
- ${}表示引入变量,和调用函数并返回值的符号
var fn = () => '我很好'
console.log(`你好吗,${fn()}`)//你好吗,我很好
ES6转成浏览器兼容的ES5
网址—>https://www.babeljs.cn/