ES6语法

一、变量的声明

变量声明：全局变量var、块级变量let、常量const。

• var：全局变量，会有变量提升
• let：块级变量，作用域在块内
• const：常量，不可以重新赋值，但是对于对象内部的值可以改变

二、变量的解构赋值

1、数组的解构赋值

下面看例子：

let [a,b,c] = [1,2,3];
console.log(a,b,c);
结果：1 2 3

let [a,b,c] = [,1,]
console.log(a,b,c);
结果：undefined 1 undefined

#给默认值
let [a=111,b,c] = [,2,];
console.log(a,b,c);
结果：111 2 undefined

2、对象的解构赋值

看例子：

#等号后面的foo和bar位置没要求，根据名字来决定
let {foo,bar} = {foo : 'aaa',bar : 'bbb'}
console.log(foo,bar)
结果：aaa bbb

#给变量重命名，后面都需要使用命名后的变量名
let {foo:rename,bar} = {foo : 'aaa',bar : 'bbb'}
console.log(rename,bar)
结果：aaa bbb

#对象的默认值
let {foo:rename="default",bar} = { bar : 'bbb'}
let {foo="default",bar} = { bar : 'bbb'}
console.log(rename,bar)
结果为： default bbb

#关于内置对象
let {cos,sin,random} = Math; //Math是内置函数
cos  sin  random就是Math里面的属性

3、字符串的解构赋值

看例子：

let [a,b,c,d,e] = "hello"
console.log(a,b,c,d,e)
结果：h e l l o
如果不对应，例如：
let [a,b] = "hello"
则结果是：h e

如果需要字符串长度，应该像下面的写法：

let {length} = "hello"
console.log(length)
结果为：5

三、模板字符串

let obj = {
  username:'aaa',
  password:'aaa'
}

let result = `
  <div>
      <span>${obj.username}</span>
      <span>${obj.password}</span>
  </div>
`;
就是下面这种：
let result = `${obj.username}`

四、函数扩展

1、参数默认值

看例子：

function foo(param='hello'){}

2、参数的解构赋值

看例子：

function foo({username,password}){}
    这种在函数调用的时候必须要传参数，否则会报错，可以通过下面的方式解决：
function foo({username,password}={}){}
    调用时可以直接foo()，不用传参，相当于上面的写法使用foo({})调用
function foo({username='aaa',password}){}
    这种是设置默认值

3、rest参数

也就是 ...param 这种写法：

function foo(a,...param){
  console.log(a,"---",param)
}
foo(1,2,3)
结果是：1 [2,3]

function foo(a,b,c){console.log(a,b,c)}
let arr = [1,2,3]
foo(...arr)
结果为：1 2 3

合并数组：

let arr1 = [1,2,3]
let arr2 = [4,5,6]
let arr3 = [...arr1,...arr2]
console.log(arr3)
结果为：[1,2,3,4,5,6]

五、箭头函数

就是形如 let foo = () => {}，下面看例子：

function foo(){}

上面的相当于：
  let foo = () => {}

一个参数，函数体一行时，可以如下面的写法：
  let foo = param = console.log(param);
  let foo = param = param;
  let result = foo(111);
  console.log(result);
  结果是：111
  也就是，当一个参数的时候可以将()省略，当方法体内一行可以省略{}

多个参数时，方法体内多行时：
  let foo = (a,b) => {
    console.log(a)
    console.log(b)
  }
  多个参数()不可以省略，方法体多行时{}不可省略

1、箭头函数中的this

箭头函数中的this指向取决于定义（可以理解为定义时所处的位置），而不是取决于是调用者。

2、箭头函数不可以new

let foo = () => {}
new foo()
使用new则会报错。

3、箭头函数不可以使用arguments获取参数列表，可以使用rest参数代替

let foo = (a,b) => {
  console.log(a,b)  //可以获取到a,b的值
  console.log(arguments)  //获取不到arguments的值
}
foo(1,2)
这种打印arguments获取不到函数传入的参数值，即1,2

let foo = (...param) => {
  console.log(param)  //这种可以获取到函数传进来的参数
}
foo(1,2)
结果：[1,2]
这种才可以获取到函数传入的值，而上面的例子无法获取到

---

写在最后：

• 如果文章中有错误或是表达不准确的地方，欢迎大家评论中指正，以便我完善。
• 文章我也会根据所学到新的知识不断更新。