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

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

目录
相关文章
|
1月前
|
存储 JavaScript 前端开发
ES6
ES6
22 1
|
1月前
ES6常用知识小结
ES6常用知识小结
17 0
|
9月前
|
JavaScript 前端开发 索引
ES9,ES10
ES9,ES10
50 0
|
9月前
ES6(二)
es6相关知识
40 0
|
9月前
|
网络架构 索引
ES6(一)
- 使用let,声明的变量仅在块级作用域内有效 - var命令声明的,在全局范围内都有效 - const声明一个只读的常量。一旦声明,常量的值就不能改变。 - const的作用域与let命令相同:只在声明所在的块级作用域内有效。 - let命令改变了语法行为,它所声明的变量一定要在声明后使用,否则报错。 - let不允许在相同作用域内,重复声明同一个变量。 - 什么时候用 let,什么使用用 const——如果不知道用什么的时候,就用 const
37 0
|
10月前
|
前端开发 容器
ES6 Day04
ES6 Day04
59 0
|
JavaScript 前端开发 Java
【ES6】初识
【ES6】初识
|
JavaScript 前端开发 Java
浅析-ES6
后端项目搭建完毕,接下来就是前端页面了。不过在这之前需要一些准备工作。我们需要学习ES6的语法标准。
浅析-ES6
|
JSON JavaScript 前端开发
ES5和ES6的介绍
《前端基础》
336 0
|
JavaScript
浅谈一下ES6的提升
es6的提升 在es6之前,我们定义定义变量的时候,只能使用var关键字来定变量,这样有一个问题,var定义的变量会成为全局变量。

热门文章

最新文章