一、ES6

二、ES7

三、ES8

四、ES9

一、ES6

点击跳转

二、ES7

1.Includes方法：检测数组是否包含某个元素，返回布尔值

const mingzhu = ['西游记', '红楼梦', '三国演义', '水浒传'];
console.log(mingzhu.includes('西游记')); // true
console.log(mingzhu.includes('金瓶梅')); // false

2.指数操作符用** 来实现幂运算，与Math.pow结果一样

// **
console.log(2 ** 10); // 1024
// Math.pow()
console.log(Math.pow(2, 10)); // 1024

三、ES8

1.async和await: 这两种语法结合可以让异步代码像同步代码一样

2.promise函数

1)、async函数的返回值为promise对象

2)、promise对象的结果由async函数返回值决定

async function fn() {// 1.返回一个不是promise类型的对象，  return出去的都是一个成功的promise对象// return '返回成功的状态'// 2.抛出错误， return出去的是一个失败的promisethrow new Error('出错了')// 3.返回的结果如果是一个promise对象return new Promise((resolve, reject) => {resolve('我成功返回的就是一个成功的promise');reject('我失败返回的就是一个失败的promise');})
}
const result = fn();
console.log(result);

通过then、catch获取到的不是promise 而是promise的值

// 调用resolve返回成功的promise
async function fn() {return new Promise((resolve, reject) => {resolve('我成功返回的就是一个成功的promise');reject('我失败返回的就是一个失败的promise');})
}
const result = fn();
// 调用 then 方法
result.then(res => {console.log(res) // 直接打印出primice对象的值 我成功返回的就是一个成功的promise
}).catch(err => {console.log(err) // 直接打印出primice对象的值 我失败返回的就是一个失败的promise
})

3.await表达式

// 创建promise 对象
const p = new Promise((resolve, reject) => {resolve('成功啦');reject('失败啦')
})// await 要放在async函数中
async function main() {try {let result = await p; // await p 是获取成功的返回值console.log(result); // 成功啦} chtch(e) { // e为失败的返回值console.log(e); // 失败啦}
}// 上面的try其实你可以理解为then和catch方法一样记

4.async和await的结合使用把异步变同步

const fn1 = () => console.log("fn1")
const fn2 = () => console.log("fn1")
const fn3 = () => console.log("fn1")// 声明一个async函数
async function main() {let fun1 = await fn1();let fun2 = await fn2();let fun3 = await fn3();console.log(fun1);console.log(fun2);console.log(fun3);
}main();
// 分别打印出:
// fn1
// fn2
// fn3
// 从上到下跟同步一样按顺序执行  因为有一个await关键字  只有上一个await执行完毕了才会执行下一个await

5.Object.keys()和Object.values()

const school = {name: '尚硅谷',cities: ['上海', '上海', '深圳'],xueke: ['前端', 'java'],
};
// 获取对象的所有键
console.log(Object.keys(school)); // ['name', 'cities', 'xueke']
// 获取对象的所有值
console.log(Object.values(school)); // ['尚硅谷', ['上海', '上海', '深圳'], ['前端', 'java']]

6.entres

const school = {name: '尚硅谷',cities: '啊啊啊',xueke: '哦哦哦',
};console.log(Object.entries(school)); // [["name", "尚硅谷"], ["cities", "啊啊啊"], ["xueke", "xueke"]]

四、ES9

1.对象的rest参数

function connect({host, prot, ...user}) {console.log(host); // 127.0.0.1console.log(port); // 3306console.log(user); // {username: "root", password: "root", type: "mater"}
}connect({host: '127.0.0.1',port: 3306,username: 'root',password: 'root',type: 'mater'
})

2.对象的扩展运算符

const skillOne = {q: '天音波'
}
console.log(...skillOne); // q: '天音波'
const skillTwo = {W: '金钟罩'
}
const skillThree = {e: '天雷破'
}
const mangseng = {...skillOne, ...skillTwo, ...skillThree};
console.log(mangseng); // {q: '天音波', W: '金钟罩', e: '天雷破'}

3.正则扩展-命名捕获分组

通过下标捕获分组

// 声明一个字符串
let str = '<a href="http:// www.atguigu.com">尚硅谷</a>';
// 提取 url 与 尚硅谷文本
const reg = /<a href="(.*)">(.*)<\/a>/;
// 执行
const result = reg.exec(str); // [0: <a href="http:// www.atguigu.com">尚硅谷</a>, 1: http:// www.atguigu.com, 2: 尚硅谷];
// 获取第一个分组的(.*)的内容
console.log(result[1]); // http:// www.atguigu.com
// 获取第二个分组的(.*)的内容
console.log(result[1]);  // 尚硅谷

通过命名捕获分组

// 声明一个字符串
let str = '<a href="http:// www.atguigu.com">尚硅谷</a>';
// 提取 url 与 尚硅谷文本
const reg = /<a href="(?<url>.*)">(?<text>.*)<\/a>/;
// 执行
const result = reg.exec(str);
// 获取命名为url的内容
console.log(result.groups.url); // http:// www.atguigu.com
// 获取命名为text的内容
console.log(result.groups.text);  // 尚硅谷

3.正则扩展 - 正向断言

// 声明字符串
let str = 'JS5211314你知道么555啦啦啦';
// 正向断言
const reg = /\d+(?=啦)/;
const result = reg.exec(str);
console.log(result[0]); // 555

4.正则扩展 - 反向断言

// 声明字符串
let str = 'JS5211314你知道么555啦啦啦';
// 反向断言
const reg = /(?<=么)\d+/;
const result = reg.exec(str);
console.log(result[0]); // 555

其他的不写了感觉用不上浪费时间

ES6、ES7、ES8、ES9、ES10、ES11相关推荐

ES6，ES7，ES8，ES9，ES10新特性一览
ECMA规范最终由TC39敲定.TC39由包括浏览器厂商在内的各方组成,他们开会推动JavaScript提案沿着一条严格的发展道路前进. 从提案到入选ECMA规范主要有以下几个阶段: Stage 0: ...
ES6和ES7及ES8新特性最新规范知识详细总结
一.ECMASript 相关介绍 ECMA概述 [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-hWfWai55-1637595380774)(images/微信截图_2 ...
ES6、ES7、ES8、ES9、ES10新特性一览
ES全称ECMAScript,ECMAScript是ECMA制定的标准化脚本语言.目前JavaScript使用的ECMAScript版本为ECMA-417.关于ECMA的最新资讯可以浏览 ECMA n ...
【 javascript】JS语法 ES6、ES7、ES8、ES9、ES10、ES11、ES12新特性
JS语法 ES6.ES7.ES8.ES9.ES10.ES11.ES12新特性前言 ES6(2015) 1. 类(class) 2. 模块化(ES Module) 3. 箭头函数 4. 函数参数默认值 ...
常用ES6、ES7、ES8、ES9、ES10、ES11、ES12新特性归纳
ES6.ES7.ES8.ES9.ES10.ES11.ES12新特性 ES全称ECMAScript,ECMAScript是ECMA制定的标准化脚本语言.目前JavaScript使用的ECMAScript ...
JavaScript语法 ES6、ES7、ES8、ES9、ES10、ES11、ES12新特性汇总
本文汇总了 ES6 至 ES11 使用十分常用的特性,包括正在规划的 ES12,仅涵盖了全部的 ES 特性.详细介绍将使用到 ES6 至 ES11 最新版的可用特性. 新特性ES6(2015) 1.类 ...
JavaScript的ES6、ES7、ES8、ES9、ES10新特性
ES6.ES7.ES8.ES9.ES10新特性 ES全称ECMAScript,ECMAScript是ECMA制定的标准化脚本语言.目前JavaScript使用的ECMAScript版本为ECMA-41 ...
ES6、ES7、ES8、ES9、ES10、ES11、ES12知识点总结
前言:ES6大家已经在工作中用的炉火纯青了,那么ES6的知识点就不再详细介绍了,一起学习一下ES7 --- ES12 的知识点吧!为了年后的金三银四冲.冲.冲!!! 目录一.ES6 二.ES201 ...
ES7、ES8、ES9、ES10、ES11 新特性总结
目录 ES7新特性一.Array.prototype.includes 二.指数操作符 ES8新特性一.async 和 await 1.async 函数 2.await 表达式 async和awa ...

ES6、ES7、ES8、ES9、ES10、ES11

一、ES6

二、ES7

三、ES8

四、ES9

其他的不写了感觉用不上浪费时间

ES6、ES7、ES8、ES9、ES10、ES11相关推荐

最新文章

热门文章

ES6、ES7、ES8、ES9、ES10、ES11

一、ES6

二、ES7

三、ES8

四、ES9

其他的不写了 感觉用不上浪费时间

ES6、ES7、ES8、ES9、ES10、ES11相关推荐

最新文章

热门文章

其他的不写了感觉用不上浪费时间