ES7,ES8

简介: ES7,ES8

ES7新特性

求幂运算符

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

数组的includes方法

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

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

ES8新特性

async和await

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

  • 更好的语义。
  • 返回值是 Promise。
async function test(){
   

}
test()

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)
})

错误处理

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

对象方法扩展

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

克隆对象

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))

字符串填充

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

函数参数的末尾加逗号

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

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

目录
相关文章
|
7月前
|
前端开发 JavaScript 网络架构
|
JavaScript 前端开发 索引
ES9,ES10
ES9,ES10
75 0
ES6(二)
es6相关知识
74 0
|
前端开发 容器
ES6 Day04
ES6 Day04
80 0
初学es6
初学es6
79 0
|
存储 JSON 自然语言处理
ES
ES
532 0
|
JavaScript 前端开发 Java
ES6+
ES6+
165 0
|
前端开发 JavaScript 网络架构
一篇文章带你学会整个ES6
ES 全称 EcmaScript,是脚本语言的 规范 ,而平时经常编写的 JavaScript ,是 EcmsScript 的 一种实现 ,所以 ES 新特性其实是指 JavaScript 的新特性 。
105 0
|
JavaScript 前端开发 Java
你知道 ES6~ES12等叫法是怎么来的吗?
你知道 ES6~ES12等叫法是怎么来的吗?
108 0
你知道 ES6~ES12等叫法是怎么来的吗?
|
存储 前端开发 JavaScript
es6相关总结
es6相关总结
121 0