ES7新特性

求幂运算符

Math.pow(3, 2) === 3 ** 2    // 9

        

          
        
        
        

          

          AI 代码解读
        
      
      

数组的includes方法

[1, 2, NaN].includes(NaN)     // true
[1, 2, NaN].indexOf(NaN)  // -1

        

          
        
        
        

          

          AI 代码解读
        
      
      

如果仅仅查找数据是否在数组中，建议使用includes，如果是查找数据的索引位置，建议使用indexOf更好一些

ES8新特性

async和await

async 函数，使得异步操作变得更加方便。

• 更好的语义。
• 返回值是 Promise。

async function test(){
   

}
test()

        

          
        
        
        

          

          AI 代码解读
        
      
      

await命令后面是一个 Promise 对象，返回该对象的结果。如果不是 Promise 对象，就直接返回对应的值。

async function test(){
   
    var res1 =  await ajax("http://localhost:3000/news1")
    var res2 =  await ajax("http://localhost:3000/news2")
    return res2
}

test().then(res=>{
   
    console.log("返回结果",res)
}).catch(err=>{
   
    console.log("err",err)
})

        

          
        
        
        

          

          AI 代码解读
        
      
      

错误处理

try{
   
    var res1 =  await ajax("http://localhost:3000/news1")
    var res2 =  await ajax("http://localhost:3000/news2")
}catch(err){
   
    console.log("err",err)
}

        

          
        
        
        

          

          AI 代码解读
        
      
      

对象方法扩展

let obj = {
   
    name:"xxx",
    age:100
}
console.log(Object.values(obj))

        

          
        
        
        

          

          AI 代码解读
        
      
      

let obj = {
   
    name:"xxx",
    age:100
}
console.log(Object.entries(obj))

        

          
        
        
        

          

          AI 代码解读
        
      
      

克隆对象

let obj1 = {
   
    name:"xxx",
    age:100,
    location:{
   
        provice:"beijing",
        city:"haidian"
    },
    //只设置city，防止破坏province
    get city(){
   
        return this.location.city
    },
    set city(value){
   
        this.location.city = value
    },
    set nameset(value){
   
        this.name = value.substring(0,1).toUpperCase()+value.substring(1)
    },
    get nameset(){
   
        return this.name
    }
}
console.log(Object.getOwnPropertyDescriptors(obj1))
var obj2=  {
   }

//Object.assign(obj2,obj1)//无法克隆 get set方法
Object.defineProperties(obj2,Object.getOwnPropertyDescriptors(obj1))

        

          
        
        
        

          

          AI 代码解读
        
      
      

字符串填充

padStart()、padEnd()方法可以使得字符串达到固定长度，有两个参数，字符串目标长度和填充内容。

let str= "xxx"

console.log(str.padStart(10,"x"));//xxxxkerwin
console.log(str.padEnd(10,"x"));//kerwinxxxx
console.log(str.padStart(5,"x"))//kerwin
console.log(str.padEnd(5,"x"))//kerwin

        

          
        
        
        

          

          AI 代码解读
        
      
      

函数参数的末尾加逗号

function test(
 a,
 b,
 c,
){
   
    console.log(a,b)
}
test(
    1,
    2,
    3,
)

        

          
        
        
        

          

          AI 代码解读
        
      
      

『末尾逗号』在添加新的参数、属性、元素时是有用的，你可以直接新加一行而不必给上一行再补充一个逗号，这样使版本控制工具的修改记录也更加整洁