ES6笔记

ES6

let与const

let是变量，有块级作用域。const是常量

const注意事项：

1. 使用const不能为空，必须进行赋值
2. 一旦const修饰的标识符被赋值后，就不能在更改
3. 常量的定义是对象不能修改，但对象内部的属性可以更改

建议:
在ES6开发中,优先使用const, 只有需要改变某一个标识(zhi)符的时候才使用let.

字符串模板 ，反引号

Tab上面的点 ` ，来定义字符串，和普通的引号区别是可以换行

对象字面量增强写法

const name = 'vicer'
//我想把name赋值到下面的对象中去

//es5写法
const obj = {
    name:name
}
//es6写法
const obj = {
    name
}

对象的解构

当使用一个对象时，我们可以通过 如obj.name获取其中的属性

但我们还有一种方法，就是直接传入一个对象进去，
这样我们就可以直接使用对象

(function(name){
    console.log(name)
})({name:'vicer'})

数组的解构

当我们需要使用数组时，除了把数组for循环遍历出来，还有一种写法

let arr = [1,2,3,4]
console.log(...arr)

函数默认值

在我们定义函数传递参数的时候，可以给一个形参传递一个默认值

    function test(name,age=18){
        console.log(name,age)
    }
    test('vicer')
    //vicer 18
    

箭头函数

函数的三种方式：

1. 声明定义
   const a = function(){}
2. 对象字面量定义函数
   const b ={
   b2(){}
   }
3. 箭头函数
   const c = () => {}
   当需要函数作为参数传入到另一个函数时，使用箭头函数最多

箭头函数传参与返回值

1. 当传的参数只有一个时可省略括号()
   const d = n => {
   return n+n
   }
2. 当花括号{}内只有一行时可省略花括号
   const e = n => n+n
   注：省略花括号{}时无需再写return，系统会自动返回值

箭头函数的this使用

正常情况下this是谁调用我我指向谁。

问题：箭头函数中this是如何查找的？

答案：在外层作用域中，逐层查找，直到有this定义。也就是指向作用域中最近this

const obj = {
  a(){
    console.log(this);//obj  谁调用我指向谁
    setTimeout(function(){
      console.log(this)// window
      //因为这里call函数，传入一个window。所以指向this
    },100);
    setTimeout(() =>{
      console.log(this)//obj
      //在外层作用域中，逐层查找，直到有this定义。也就是指向作用域中最近this
    },100);
  }
}
obj.a();

promise异步编程

一般情况下有异步操作时，使用Promise对这个异步操作进行封装。

• Promise内部执行回调函数，在执行传入的回调函数时还会传入两个参数，resolve，reject。而这两参数本身又是函数

• 在请求成功时调用resolve，参数默认传入到then中处理。
  

• 在请求失败时调用reject，参数默认传入到catch中处理。

简而言之：Promise是一个优雅的函数，在内部判断成功或失败，成功调用then处理，失败调用catch处理。

两种写法

1. resolve调用then，reject调用catch
   

    new Promise((resolve, reject)=>{
        setTimeout(()=>{
          // resolve('hello word');
          reject('error message')
        },1000)
    }).then((data)=>{
        console.log(data);
    }).catch(err =>{
        console.log(err);
    })

1. 都写在then中

  new Promise((resolve, reject)=>{
    setTimeout(()=>{
      // resolve('hello word')
      reject('error message')
    },1000)
  }).then((data)=>{
    console.log(data);
  },(err)=>{
    console.log(err);
  })

promise的简写

当promise只有第一步进行异步操作，接下来操作不是异步时，可以进行代码简写

• 一般简写方式

      new Promise((resolve, reject)=>{
        setTimeout(()=>{
          resolve('hello word')
        },1000)
      }).then((data)=>{
        console.log(data);
        //成功回调简写
        // return Promise.resolve(data+111)  
        //失败回调简写
        return  Promise.reject('error message')
      }).then((data)=>{
        console.log(data)
      }).catch(err =>{
        console.log(err);
      })

• 超级简写方式

      new Promise((resolve, reject)=>{
        setTimeout(()=>{
          resolve('hello word')
        },1000)
      }).then((data)=>{
        console.log(data);
        //成功回调简写
        // return data+111
        //失败回调简写
        throw  'error message'
      }).then((data)=>{
        console.log(data)
      }).catch(err =>{
        console.log(err);
      })

promise.all的使用

当我们需要两个异步操作同时完成才能返回结果时，一般需要用到all方法。

all中放的是数组，如promise.all([])

  Promise.all([
    new Promise((resolve, reject) => {
      setTimeout(()=>{
        resolve({name:'vicer',age:18})
      },1000)
    }),
    new Promise((resolve, reject) => {
      setTimeout(()=>{
        resolve({name:'lily',age:19})
      },2000)
    })
  ]).then(results =>{
    console.log(results);
  })

ES6笔记

原文：https://www.cnblogs.com/lovecode3000/p/12324289.html