关于ECMAScript 2016, 2017, 和2018中新增功能(摘抄)
ECMAScript 2016
1. Array.prototype.includes
includes
是数组上的简单实例方法,并有助于轻松查找某个项是否在Array中(包括NaN
不像indexOf
)
const arr = [ 1, 2, 3, 4, NaN];
(注:想要命名的JavaScript规范
// es2016不使用
if(arr.indexOf(3) >= 0){
console.log(true);
}
//使用
if(arr.includes(3)){
console.log(true);
}
//ps: 注意 indexOf 是不支持查找NaN的
arr.includes(NaN) // true
arr.indexOf(NaN) // -1 (indexOf 不支持 NaN)contains
,但这显然已被Mootools使用,因此他们使用了includes
。)
2. 指数运算符
数学运算如加法和减法分别有 +
和 -
等运算符。与他们类似,**
运算符通常用于指数运算。在ECMAScript 2016中,引入了 **
而不是Math.pow。
// 不使用
Math.pow(7,2) //49
//使用
7**2 //49
ECMAScript 2017
1. Object.values()
Object.value()
是一个与Object.keys()
类似的新函数,但会返回Object自身属性的所有值,排除原型链中的任何值。
const cars = { 'BMW': 3, 'Tesla': 2, 'Toyota': 1 };
//ES2015
//ES2017 不使用
const vals = Object.keys(cars).map(key => cars[key]);
console.log(vals); //[3, 2, 1]
//ES2017 and 未来
//使用
const values = Object.values(cars);
console.log(values); // [3, 2, 1]
2. Object.entries()
Object.entries()
与Object.keys
相关,但不是仅返回keys,而是以数组方式返回keys和values。这使得像循环中使用对象或将对象转换为Maps这样的事情变得非常简单。
例 1:
const cars = { 'BMW': 3, 'Tesla': 2, 'Toyota': 1 };
// ES5.1
//而不是提取键然后再循环
Object.keys(cars).forEarch(function(key) {
console.log('key: ' + key + 'value: ' + cars[key]);
})
//ES2017 (ES8)
//使用 Object.entries
for(let [key value] of Object.entries(cars)) {
console.log(`key: ${key} value: ${value}`);
}
例 2:
const cars = { 'BMW': 3, 'Tesla': 2, 'Toyota': 1 };
//ES2015
//不使用
//获取对象键,然后添加每个项目以在循环中映射
const maps = new Map();
Object.keys(cars).forEarch(key => {
maps.set(key, cars[key]);
})
console.log(map1) // Map { 'BMW' => 3, 'Tesla' => 2, 'Toyota' => 1}
//ES2017 and 以后
//使用
const map = new Map(Object.entries(cars));
console.log(map) //Map { 'BMW' => 3, 'Tesla' => 2, 'Toyota' => 1}
ECMAScript 2018
1. 共享内存和原子 (Shared memory and atomics)
这是一个巨大的,非常先进的功能,是对JS引擎的核心增强。
主要思想是为JavaScript提供某种多线程功能,以便JS开发人员可以编写高性能,通过允许自己管理内存而不是让JS引擎管理内存来实现并发程序。
这是通过一种名为SharedArrayBuffer的新型全局对象来完成的,它基本上将数据存储在共享内存空间中.所以这个数据可以在主JS线程和网络工作者线程之间共享。
到现在为止,如果我们想要在主JS线程和Web工作者之间共享数据,我们必须复制数据并使用postMessage
将其发送到其他线程。就这样子!
您只需使用SharedArrayBuffer
,主线程和多个Web工作线程即可访问数据。
但在线程之间共享内存可能会导致竞争状况。为了避免竞争条件,引入了“Atomics”全局对象。当一个线程正在使用它的数据时,Atomics
提供了各种方法来锁定共享内存。它还提供了安全地更新共享内存中的数据的方法。
建议通过某个库使用此功能,但现在没有构建在此功能之上的库。
如果您有兴趣,推荐阅读:
From Workers to Shared Memory — lucasfcosta
A cartoon intro to SharedArrayBuffers — Lin Clark
Shared memory and atomics — Dr. Axel Rauschmayer
2. 标记模板字面限制已删除(模板字符串)
首先,我们需要澄清一下“Tagged Template literal”是什么,这样我们可以更好地理解这个特性。
在ES2015+中,有一项称为标记模板文字的功能,允许开发人员自定义如何插入字符串。例如,以标准方式插入字符串,如下所示
//标准字符串插值
const firstName = 'Raja';
const greetings = `Hello ${firstName}!`;
console.log(greetings); // "Hello Raja!"
在标记字面量中,可以编写一个函数来接收字符串文字的硬编码部分,例如['Hello','!']
和替换变量,例如['Raja']
,作为参数写入自定义函数(例如greet
),然后从该自定义函数中返回所需的任何内容。
下面的例子显示我们的自定义“Tag”函数greet
“Good Morning!”,“Good afternoon,”等日子的时间,依此类推,取决于字符串文字的一天中的时间,并返回一个自定义字符串。
// "标记”函数返回一个自定义字符串文字.
// 在这个例子中,greet调用timeGreet()来追加Good
// Morning/Afternoon/Evening 视当天的时间而定.
function greet(hardCodedPartsArray, ...replacementPartsArray) {
console.log(hardCodedPartsArray); //[ 'Hello ', '!' ]
console.log(replacementPartsArray); //[ 'Raja' ]
let str = '';
hardCodedPartsArray.forEach((string, i) => {
if (i < replacementPartsArray.length) {
str += `${string} ${replacementPartsArray[i] || ''}`;
} else {
str += `${string} ${timeGreet()}`; //<-- 插入 Good morning/afternoon/evening here
}
});
return str;
}
//用法
const firstName = 'Raja';
const greetings = greet`Hello ${firstName}!`; //
关于ECMAScript 2016, 2017, 和2018中新增功能(摘抄)的更多相关文章
- ECMAScript 2016,2017 和 2018 中所有新功能的示例
很难追踪 JavaScript(ECMAScript)中的新功能. 想找到有用的代码示例更加困难. 因此,在本文中,我将介绍 TC39 已完成 ES2016,ES2017 和 ES2018(最终草案) ...
- [转]ECMAScript 2016,2017 和 2018 中所有新功能的示例
很难追踪 JavaScript(ECMAScript)中的新功能. 想找到有用的代码示例更加困难. 因此,在本文中,我将介绍 TC39 已完成 ES2016,ES2017 和 ES2018(最终草案) ...
- CorelDRAW 2018新增功能介绍
2018年4月11日,CorelDRAW 2018正式对外发布,最新版设计软件包已经过全面更新,是近几年来发行的最强大版本,可协助绘图专业人士将创意转换为令人惊艳的专业视觉设计.CorelDRAW 2 ...
- ECMAScript 5中对Array中新增了9个方法
ECMAScript 5中对Array中新增了9个方法: 5个迭代方法(循环操作数组中的各个项):forEach(),map(),filter(),every()和some() 2个归并方法(迭代数组 ...
- 《2017年-2018年中国MES软件及服务市场研究报告》正式发布!
<2017年-2018年中国MES软件及服务市场研究报告>由e-works Research研究编写,报告深度分析了2017年及2018年中国MES市场发展状况,从市场规模.市场特点.需求 ...
- 【转】2016/2017 Web 开发者路线图
链接:知乎 [点击查看大图] 原图来自LearnCodeAcademy最火的视频,learncode是YouTube上最火的Web开发教学频道,介绍包括HTML/CSS/JavaScript/Subl ...
- PyCharm:2017.3版即将新增科学计算模式,预览版现在可以下载使用
编译:Lemon,原文作者:Ernst Haagsman 公众号:Python数据之道(ID:PyDataRoad) pycharm:2017.3版即将新增科学计算模式 在JetBrains将发布的新 ...
- 2017总结&2018展望
2017已逝2018已来,是时候放下包袱来好好回顾下2017做了什么,有什么收获,遗憾之处的原因是什么.2018应该怎么做才能让自己满意,才能少一些遗憾. 2017 工作 工作中所参与的项目是一个直播 ...
- Windows Server 2016-Hyper-V 2016新增功能
本文解释了Windows Server 2016和Microsoft Hyper-V Server 2016上Hyper-V的新增功能和变更功能. 与Connected Standby兼容(新) 在使 ...
随机推荐
- Lucene 4.4.0中常用的几个分词器
一.WhitespaceAnalyzer 以空格作为切词标准,不对语汇单元进行其他规范化处理.很明显这个实用英文,单词之间用空格. 二.SimpleAnalyzer 以非字母符来分割文本信息,并将语汇 ...
- java排序算法(二):直接选择排序
java排序算法(二) 直接选择排序 直接选择排序排序的基本操作就是每一趟从待排序的数据元素中选出最小的(或最大的)一个元素,顺序放在已排好序的数列的最后,直到全部待排序的数据元素排完,它需要经过n- ...
- 使用ADO.NET查询和访问数据库
使用ADO.NET查询和访问数据库步骤 使用ADO.NET查询和访问数据库 连接数据库操作: 1. 定义连接字符串: String connString = "Data Sour ...
- 【数据结构】赫夫曼树的实现和模拟压缩(C++)
赫夫曼(Huffman)树,由发明它的人物命名,又称最优树,是一类带权路径最短的二叉树,主要用于数据压缩传输. 赫夫曼树的构造过程相对比较简单,要理解赫夫曼数,要先了解赫夫曼编码. 对一组出现频率不同 ...
- KS检验统计量的扩展应用(CMap)
KS检验统计量的扩展应用 KS(Kolmogorov-Smirnov)检验是比较两个经验分布之间是否存在差异. 我们设X1, X2,-, Xm, Y1, Y2,-, Ym为两个独立随机样本,分别满足假 ...
- python web——Django架构
环境:windows/linux/OS 需要的软件:Firefox 浏览器(别的也可以 不过firfox和python的webdriver兼容性好) git版本控制系统(使用前要配置 用户 编辑器可以 ...
- Beta敏捷冲刺每日报告——Day3
1.情况简述 Beta阶段Scrum Meeting 敏捷开发起止时间 2017.11.4 00:00 -- 2017.11.5 00:00 讨论时间地点 2017.11.4 晚9:30,电话会议会议 ...
- nyoj 矩形个数
矩形的个数 时间限制:1000 ms | 内存限制:65535 KB 难度:1 描述 在一个3*2的矩形中,可以找到6个1*1的矩形,4个2*1的矩形3个1*2的矩形,2个2*2的矩形,2个3 ...
- php的调试工具xdebug
zend_extension = "D:/developsoftware/wamp/bin/php/php5.5.12/zend_ext/php_xdebug-2.2.5-5.5-vc11- ...
- js正则表达语法
/* *通过量词可以设置一个内容出现的次数 *量词只对它前边的一个内容起作用.所以在作用多个时需要用小括号()来向计算机说明这是一个整体. *-{n}代表正好出现n次. *-{m,n}出现了m-n次. ...