es8 --- 新特性
ES8尚未发布(2017年1月),下面是它已经完成起草的一些特性:
- Object.values()
- Object.entries()
- padStart()
- padEnd()
- Object.getOwnPropertyDescriptors()
- 函数参数列表结尾允许逗号
- Async/Await
Object.values()
不使用ES8
使用Object.keys()遍历对象的属性值,需要通过属性名key去获取属性值:
let obj = {a: , b: , c: }; Object.keys(obj).forEach((key) =>
{
console.log(obj[key]); // 输出1, 2, 3
});
使用ES8
使用Object.values()遍历对象的属性值,无需使用使用属性名:
let obj = {a: , b: , c: }
Object.values(obj).forEach(value =>
{
console.log(value); // 输出1, 2, 3
});
Object.entries()
不使用ES8
使用Object.keys()遍历对象的属性名和属性值:
let obj = {a: , b: , c: }; Object.keys(obj).forEach((key) =>
{
console.log(key + ": " + obj[key]); // 输出a: 1, b: 2, c: 3
})
使用ES8
使用Object.entries()遍历对象的属性名和属性值:
let obj = {a: , b: , c: }; Object.entries(obj).forEach(([key, value]) =>
{
console.log(key + ": " + value); // 输出a: 1, b: 2, c: 3
})
padStart()
不使用ES8
console.log('0.00')
console.log('10,000.00')
console.log('250,000.00')
输出结果如下:
0.00
,000.00
,000.00
使用ES8
使用padStart()可以在字符串前面填充指定的字符串:
console.log('0.00'.padStart())
console.log('10,000.00'.padStart())
console.log('250,000.00'.padStart())
输出结果如下:
0.00
,000.00
,000.00
padEnd()
不使用ES8
console.log('0.00 ' + '0.00' )
console.log('10,000.00 ' + '10,000.00' )
console.log('250,000.00 ' + '250,000.00')
输出如下:
0.00 0.00
,000.00 ,000.00
,000.00 ,000.00
使用ES8
使用padEnd()可以在字符串后面填充指定的字符串:
console.log('0.00'.padEnd() + '0.00' )
console.log('10,000.00'.padEnd() + '10,000.00' )
console.log('250,000.00'.padEnd() + '250,000.00')
输出如下:
0.00 0.00
,000.00 ,000.00
,000.00 ,000.00
Object.getOwnPropertyDescriptors()
azatsBooks对象的定义如下:
let azatsBooks = {
books: ['React Quickly'],
get latest()
{
let numberOfBooks = this.books.length;
if (numberOfBooks == ) return undefined;
return this.books[numberOfBooks - ];
}
};
不使用ES8
使用Object.getOwnPropertyDescriptor()获取单个属性的属性描述符。
获取azatsBooks对象的books属性的属性描述符:
console.log(Object.getOwnPropertyDescriptor(azatsBooks, 'books')); /** 输出books属性的属性描述
[object Object] {
configurable: true,
enumerable: true,
value: ["React Quickly"],
writable: true
}
**/
获取azatsBooks对象的lastest方法的属性描述符:
console.log(Object.getOwnPropertyDescriptor(azatsBooks, 'latest')); /** 输出lastest方法的属性描述
[object Object] {
configurable: true,
enumerable: true,
get: function get latest() {
let numberOfBooks = this.books.length
if (numberOfBooks == 0) return undefined
return this.books[numberOfBooks - 1]
},
set: undefined
}
**/
使用ES8
Object.getOwnPropertyDescriptors()相当于Object.getOwnPropertyDescriptor()的复数形式,可以获取对象的所有自身属性的描述符:
console.log(Object.getOwnPropertyDescriptors(azatsBooks)) /** 输出azatsBooks对象所有自身属性的属性描述
[object Object] {
books: [object Object] {
configurable: true,
enumerable: true,
value: ["React Quickly"],
writable: true
},
latest: [object Object] {
configurable: true,
enumerable: true,
get: function get latest() {
let numberOfBooks = this.books.length
if (numberOfBooks == 0) return undefined
return this.books[numberOfBooks - 1]
},
set: undefined
}
}
**/
函数参数列表结尾允许逗号
不使用ES8
var f = function(a,
b,
c,
d // d之后不能带逗号
) {
console.log(d)
}
使用ES8
var f = function(a,
b,
c,
d, // d之后允许带逗号
) {
console.log(d)
}
允许逗号之后,可以避免一些不必要的报错。(如果你希望实时监控JavaScript应用的错误,欢迎免费使用Fundebug)
Async/Await
使用Promise
使用Promise写异步代码,会比较麻烦:
axios.get(`/q?query=${query}`)
.then(response => response.data)
.then(data =>
{
this.props.processfetchedData(data);
})
.catch(error => console.log(error));
使用Async/Await
Async/Await使得异步代码看起来像同步代码,这正是它的魔力所在:
async fetchData(query) =>
{
try
{
const response = await axios.get(`/q?query=${query}`);
const data = response.data;
return data;
}
catch (error)
{
console.log(error)
}
} fetchData(query).then(data =>
{
this.props.processfetchedData(data)
})
Async/Await是写异步代码的新方式,以前的方法有回调函数和Promise。相比于Promise,它更加简洁,并且处理错误、条件语句、中间值都更加方便,因此有望替代Promise,成为新一代的一步代码编写方式。对细节感兴趣的话,可以查看Fundebug翻译的《Async/Await替代Promise的6个理由》。
es8 --- 新特性的更多相关文章
- ECMAScript 2017(ES8)新特性简介
目录 简介 Async函数 共享内存和原子操作 Object的新方法 String的新方法 逗号可以添加到函数的参数列表后面了 简介 ES8是ECMA协会在2017年6月发行的一个版本,因为是ECMA ...
- ES6/ES7/ES8新特性
ES6 变量的改变 let const 2. 字符串新增方法 let str = 'react'; str.includes('re') // true str.repeat(3) // reactr ...
- ES8新特性——ES8 was Released and here are its Main New Features
原文: https://hackernoon.com/es8-was-released-and-here-are-its-main-new-features-ee9c394adf66 -------- ...
- ES8新特性
Object.values/Object.entries Object.values和 Object.entries是在ES2017规格中,它和Object.keys类似,返回数组类型,其序号和Obj ...
- es6/es7/es8常用新特性总结(超实用)
本文标题有误导性,因为我其实想写node8的新特性,说实话一下子从node v1.x跳跃到node 8.x+ 真有点受宠若惊的感觉.一直觉得node 数组. 对象.序列等的处理没有python方便,因 ...
- 细解JavaScript ES7 ES8 ES9 新特性
题记:本文提供了一个在线PPT版本,方便您浏览 细解JAVASCRIPT ES7 ES8 ES9 新特性 在线PPT ver 本文的大部分内容译自作者Axel Rauschmayer博士的网站,想了解 ...
- ES6、ES7、ES8、ES9、ES10新特性
ES6新特性(2015) ES6的特性比较多,在 ES5 发布近 6 年(2009-11 至 2015-6)之后才将其标准化.两个发布版本之间时间跨度很大,所以ES6中的特性比较多. 在这里列举几个常 ...
- ES7/8新特性学习随笔
随着每年EcmaScript都会为js带来一些新特性,带来更多美化的编程体验,今天就走进一下es2016/2017所带来的新特性 ES7新特性 includes() 指数操作符 ES8新特性 asyn ...
- ES6、7、8常用新特性总结(超实用)
ES6常用新特性 1. let && const let 命令也用于变量声明,但是作用域为局部 { let a = 10; var b = 1; } 在函数外部可以获取到b,获取不到a ...
随机推荐
- OpenGL编程逐步深入(七)旋转变换
准备知识 这一节我们来看一下旋转变换.旋转变换指的是给我们一个指点的点和角度,我们需要绕着过该点的轴线將对象旋转对应的角度.这里我们只改变X/Y/Z中的两个分量,第三个分量保持不变.这意味着我们的图形 ...
- Chromium Graphics: Video Playback and Compositor
Video Playback and Compositor Authors: jamesr@chromium.org, danakj@chromium.org The Chromium composi ...
- CF620E New Year Tree(线段树+二进制)
题解 弱智题,二进制表示位数.合并时用| 就是被1<<x卡了好久. 要写成1ll<<x才行 #include<iostream> #include<cstri ...
- 装了ubuntu后笔记本电脑的无线网卡用不了,怎么设置?
百度经验的一篇文章 http://jingyan.baidu.com/article/ca2d939dd4f1b4eb6c31ce09.html 点击右上角的齿轮,选择“系统设置” 点击“软件和更 ...
- 监控mysqld服务
#!/bin/bash #监控mysqld服务 #telnet 192.168.122.171 3306 | grep Connected | wc -l #远程检查 #num=`netstat -n ...
- Gradle编译spring3.x报错找不到itextpdf4.2.2解决方案
google搜到一篇文章:http://www.bdtool.net/blog_356.html 试了文章里的两个方法,方法一不行,方法二有点搞头,但是还有些错.试着试着,突然成功了~ 我是这么做的 ...
- Windows安装两个mysql数据库步骤
因为新旧项目数据库版本号差距太大.编码格式不同.引擎也不同,所以仅仅好装两个数据库. 本次安装两个mysql数据库.版本号各自是4.0.18,5.5.36.都是可运行文件直接安装. 本机上之前已经安装 ...
- 《AndroidStudio每日一贴》11. 重构之提炼为常量
提炼为常量是从暂时变量高速提炼出静态常量,这也是我们经常使用的重构手段. 很多其它有用技巧请查看<AndroidStudio有用指南> 操作步骤: ➤ 菜单条: Refactor -> ...
- Android入门篇(一)Androidproject的搭建,导入与导出,图标的改动
先说一些题外话吧.这是小珂同学的处女作.可能写的不好,请各位读者见谅.我先讲讲我为什么要写博文,那应该也是机缘巧合,有一次.我问学长一个问题,学长发了一个连接给我,里面是一篇博客.那时我仅仅是看 ...
- 开源项目 AllJoyn 基础服务
AllJoyn 基础服务主要包含 Onboarding,Notification 和 Control Panel三个大项. 这三个也是编写App的最基础的,最经常使用的部分. Onboarding 提 ...