ES2016(ES7)新增:

Array.prototype.includes

Exponentiation Operator 求冥运算

ES2017 (ES8)新增:

ECMAScript® 2017 Language Specification (ECMA-262, 8th edition, June 2017)任意门

1、TypeArray:

一个TypedArray 对象描述一个底层的二进制数据缓存区的一个类似数组(array-like)视图。事实上,没有名为 TypedArray的全局对象,也没有一个名为的 TypedArray构造函数。相反,有许多不同的全局对象,下面会列出这些针对特定元素类型的类型化数组的构造函数。

语法:

 new TypedArray(length);
new TypedArray(typedArray);
new TypedArray(object);
new TypedArray(buffer [, byteOffset [, length]]);
Int8Array();
Uint8Array();
Uint8ClampedArray();
Int16Array();
Uint16Array();
Int32Array();
Uint32Array();
Float32Array();
Float64Array();

2、字符串填充 String.padStart 、String.padEnd

  语法:str.padStart(targetLength [, padString])  返回值:填充后形成的新字符串

  targetLength 当前字符串需要填充到的目标长度。如果它小于当前字符串的长度,则返回当前字符串本身。

  padString 要填充的字符串,如果长度超过了 targetLength 则,只保留左侧部分,其他部分被阶段。缺省值,为 " "

  示例:

'abc'.padStart(10); // "       abc"
'abc'.padStart(10, 'foo'); // "foofoofabc"
'abc'.padStart(4, '12345'); // "1abc"
'abc'.padStart(1); // "abc"

  兼容性支持:

  String.prototype.padStart()

if (!String.prototype.padStart) {
String.prototype.padStart = function padStart(targetLength,padString) {
targetLength = targetLength>>0; //floor if number or convert non-number to 0;
padString = String(padString || ' ');
if (this.length > targetLength) {
return String(this);
}
else {
targetLength = targetLength-this.length;
if (targetLength > padString.length) {
padString += padString.repeat(targetLength/padString.length); //append to original to ensure we are longer than needed
}
return padString.slice(0,targetLength) + String(this);
}
};
}

  str.padEnd 与 str.padStart 用法相同,只是 padEnd 是在当前字符串后面添加内容。

  兼容性支持:

 if (!String.prototype.padEnd) {
String.prototype.padEnd = function padEnd(targetLength,padString) {
targetLength = targetLength>>0; //floor if number or convert non-number to 0;
padString = String(padString || ' ');
if (this.length > targetLength) {
return String(this);
}
else {
targetLength = targetLength-this.length;
if (targetLength > padString.length) {
padString += padString.repeat(targetLength/padString.length); //append to original to ensure we are longer than needed
}
return String(this) + padString.slice(0,targetLength);
}
};
}

  作用:

  • 以等宽字体显示平整的数据。
  • 在文件名或URL中添加计数或ID:’001.txt’。
  • 对齐控制台输出: ‘Test 001: ’。
  • 打印具有固定位数的十六进制或二进制数字:’0x00FF’

3、async 和 await 目前还是实验性质的方法,实战项目中慎用哦~

  AsyncFunction 构造函数。用来创建新的 异步函数 对象

    语法:new Asyncfunction( [arg1 [, arg2 [, ... argN] ] ,] fucntionBody )

    argN: 函数的参数名

    functionBody: 字符串格式的函数体

  async function 关键字。用来在表达式中定义异步函数

    语法:async function [name] (param1 [ param1 [, param1 [, ..., paramM] ] ] ) { statements }

    name: 此异步函数的名称,可以是匿名函数,该名称仅可在本函数中使用。

    paramN: 传入函数的参数的名称。

    statements: 函数体

  await 操作符。用来等待一个 Promise 对象。它只能在异步函数 async function 中使用。

    表达式: 一个 Promise 对象,或者任何要等待的值。 [return_value] = await expression;

    返回值:返回 Promise 对象的处理结果。如果等待的不是 Promise 对象,则返回该值本身。

 function resolveAfter2Seconds(x) {
return new Promise(resolve => {
setTimeout(() => {
resolve(x);
}, 2000);
});
} // 构造函数的方式
var a = new AsyncFunction('a', 'b', 'return await resolveAfter2Seconds(a) + await resolveAfter2Seconds(b);'; a(10,20).then( v => {
console.log(v); // 4 秒后打印 30
}); //async 关键字的方式
var add1 = async function(x) {
var a = await resolveAfter2Seconds(20);
var b= await resolveAfter2Seconds(30);
return x + a + b;
}
add1(10).then( v => {
console.log(v); // 4 秒后打印 60
});
// 注意 ⚠️ await 位置不同的差异
(async function(x) {
var p_a = resolveAfter2Seconds(20);
var p_b = resolveAfter2Seconds(30);
return x + await p_a + await p_b;
})(10).then(v => {
console.log(v); // 2 秒后打印 60
});

4、获得对象上自身某属性的描述符:Object.getPropertyDescriptor() 。它解决了 Object.assign() 无法正确拷贝 get 和 set 属性的问题

  语法: Object.getpropertyDescriptor(obj, prop)

  obj: 要查找的目标对象

  prop:要查找的目标对象的属性

  返回值:若存在该属性,则返回其属性描述,否则返回 undefined

 var o, d;

 o = { get foo() { return 17; } };
d = Object.getOwnPropertyDescriptor(o, "foo"); //结果
// d {
// configurable: true, // 指定对象的属性描述可以被改变或者属性可以被删除时,为 true
// enumerable: true, // 该属性可以被枚举时为 true
// get: /*the getter function*/, // 该属性的访问器函数
// set: undefined // 该属性的设置器函数
// } o = { bar: 42 };
d = Object.getOwnPropertyDescriptor(o, "bar");
// d {
// configurable: true,
// enumerable: true,
// value: 42, // 该属性的值
// writable: true //该属性值可被修改时为 true
// } o = {};
//定义属性描述的方法用 defineProperty
Object.defineProperty(o, "baz", {
value: 8675309,
writable: false,
enumerable: false
});

ES2018 (ES9)新增:

1、Regular正则表达式命名捕获组 ?<name>

 const
reDate = /([0-9]{4})-([0-9]{2})-([0-9]{2})/,
match = reDate.exec('2018-04-30'),
year = match[1], //
month = match[2], //
day = match[3]; // const
reDate = /(?<year>[0-9]{4})-(?<month>[0-9]{2})-(?<day>[0-9]{2})/,
match = reDate.exec('2018-04-30'),
year = match.groups.year, //
month = match.groups.month, //
day = match.groups.day; //
const
reDate = /(?<year>[0-9]{4})-(?<month>[0-9]{2})-(?<day>[0-9]{2})/,
d = '2018-04-30',
usDate = d.replace(reDate, '$<month>-$<day>-$<year>');

2、反向肯定查找  (?<=X)Y 匹配的是 Y,但是Y前面必须有X

 反向否定查找 (?<!X)Y 匹配的是Y,但是Y的前面不能有X

 正向肯定查找 X(?=Y) 匹配的是X,但是 X的后面必须有Y

正向否定查找 X(?!Y) 匹配的是X,但是 X的后面不能跟Y

// 反向肯定查找
const reg1 = /(?<=a)b/;
reg1.exec('ab')[0]; // b
reg1.exec('abc')[0]; // b
reg1.exec('cb'); // null
// 反向否定查找
const reg2 = /(?<!a)b/;
reg2.exec('ab'); //null
reg2.exec('cb')[0]; // b
reg2.exec('cdb')[0]; // b
// 正向肯定查找
const reg3 = /a(?=b)/;
reg3.exec('ab')[0]; //a
reg3.exec('abc')[0]; //a
reg3.exec('ac'); //null
// 正向否定查找
const reg4 = /a(?!b)/
reg4.exec('ab'); //null
reg4.exec('ac'); //a
reg4.exec('acd'); //a

3、正则表达式标志 s 。允许 . 匹配换行符

  原本 . 小数点是匹配除换行符以外的任何字符,使用 s 后 . 也可以匹配换行符

/abc.abc/.test('abc\nabc'); // false
/abc.abc/s.test('abc\nabc'); //true

有空继续更...

ES 2016+的更多相关文章

  1. ECMAScript 7 (ES 2016 /ES7 ) Ecma-262 7Edition

    Standard ECMA-262 ECMAScript 2016 Language Specification 7th edition (June 2016) http://www.ecma-int ...

  2. 实用的几个JS新特性(es 2016)

    在Chrome 55下测试,可用. 1.箭头函数(arrow function) 以前写的匿名函数是这样的 function(){}, 现在可以简单写成这样()=>{} 如果直接return,没 ...

  3. Linux安装sonarQube

    安装sonarQube之前,需要先安装JDK和mysql 服务器/home/azrlnx04/下创建三个文件夹,/java ./mysql. /sonar 一:安装JDK (1)打开http://ww ...

  4. Angular 2的12个经典面试问题汇总(文末附带Angular测试)

    Angular作为目前最为流行的前端框架,受到了前端开发者的普遍欢迎.不论是初学Angular的新手,还是有一定Angular开发经验的开发者,了解本文中的12个经典面试问题,都将会是一个深入了解和学 ...

  5. Angular的12个经典问题,看看你能答对几个?(文末附带Angular测试)

    Angular作为目前最为流行的前端框架,受到了前端开发者的普遍欢迎.不论是初学Angular的新手,还是有一定Angular开发经验的开发者,了解本文中的12个经典面试问题,都将会是一个深入了解和学 ...

  6. JavaScript 中回调地狱的今生前世

    1. 讲个笑话 JavaScript 是一门编程语言 2. 异步编程 JavaScript 由于某种原因是被设计为单线程的,同时由于 JavaScript 在设计之初是用于浏览器的 GUI 编程,这也 ...

  7. Angular 2的12个经典面试问题汇总(文末附带Angular測试)

    Angular作为眼下最为流行的前端框架,受到了前端开发者的普遍欢迎.不论是初学Angular的新手.还是有一定Angular开发经验的开发者,了解本文中的12个经典面试问题,都将会是一个深入了解和学 ...

  8. 前端ES6 特性兼容查询

    ES6 http://kangax.github.io/compat-table/es6/ ES5 http://kangax.github.io/compat-table/es5/ ES 2016+ ...

  9. elk系列8之logstash+redis+es的架构来收集apache的日志

    preface logstash--> redis --> logstash --> es这套架构在讲究松耦合关系里面是最简单的, 架构图如下: 解释下这个架构图的流程 首先前端lo ...

随机推荐

  1. 安卓app测试之流量监控

    一.查看PID 通过ps命令查看:ps | grep packageName 案例:adb shell "ps | grep tv.danmaku.bili" adb shell ...

  2. 梦想MxWeb3D协同设计平台 2019.02.28更新

    梦想MxWeb3D协同设计平台 2019.02.28更新 SDK开发包下载地址: http://www.mxdraw.com/ndetail_10130.html 在线演示网址: http://www ...

  3. 日常开发需要掌握的Git命令

    本人待的两家公司,一直都是用的SVN,Git我只是自己私下学习和开发小项目的时候用过,工作一直没有使用过,但还是要学的... Git是最好的分布式版本控制系统 工作流程 SVN和Git的区别 SVN是 ...

  4. Redis系列(四)--持久化

    持久化就是将数据的更新异步的保存到磁盘中 持久化方式: 1.快照:某个时间点数据的备份 MySQL dump.Redis RDB 2.写日志:MySQL BinLog.HBASE Hlog.Redis ...

  5. js统计图表插件 Echarts

    Echarts 用于制作数据统计图表,一个纯 Javascript 的图表库,快捷简便的生成统计图表. 官网:https://www.echartsjs.com/ 效果 html <!DOCTY ...

  6. 小程序接口越过域名和https限制方法

    都知道小程序上线接口需要域名,还需要https,就算是体验版的都是需要的,这样就筛选掉一大批开发者,像我这样只有学生轻量级服务器的学生要开发自己的小程序就很为难,但今天确惊奇的在小程序社区里面找到了用 ...

  7. 移动端响应式rem

    (function (doc, win) { var docEl = doc.documentElement, resizeEvt = 'orientationchange' in window ? ...

  8. CCF201612-2 工资计算 java(100分)

    试题编号: 201612-2 试题名称: 工资计算 时间限制: 1.0s 内存限制: 256.0MB 问题描述: 问题描述 小明的公司每个月给小明发工资,而小明拿到的工资为交完个人所得税之后的工资.假 ...

  9. 解决window 10 安装软件2503 2502错误

    1.首先打开任务管理器,可以通过右键点击桌面上的任务栏打开任务管理器,也可以通过同时按下键盘上的Ctrl+Alt+Delete键打开任务管理器. 2.打开任务管理器后,切换到“详细信息”选项卡,找到e ...

  10. python3中post请求里带list报错

    这个post请求的数据太长,一般data=,json=就够了. 但是今天这个一直报错,用json吧,报缺少参数,用data吧,报多余[. 后来改成data=,并把数据中的[] 用引号括起来," ...