CHEYNE CHEYNE
  • 分类
    • 技术
    • 游戏
    • 生活
  • 动态
  • 留言板
  • 链接
    • 社交媒体
    • 友情链接
    • 站点导航
  • CHEYNE 导航
  • 注册
  • 登录
首页 › 技术 › ECMAScript 新特性

ECMAScript 新特性

cheyne
3年前技术阅读 685

ES2019

Array.prototype.flat()


const letters = ['a', 'b', ['c', 'd', ['e', 'f']]];
// default depth of 1
letters.flat();
// ['a', 'b', 'c', 'd', ['e', 'f']]

// depth of 2
letters.flat(2);
// ['a', 'b', 'c', 'd', 'e', 'f']

// which is the same as executing flat with depth of 1 twice
letters.flat().flat();
// ['a', 'b', 'c', 'd', 'e', 'f']

// Flattens recursively until the array contains no nested arrays
letters.flat(Infinity)
// ['a', 'b', 'c', 'd', 'e', 'f']

Array.prototype.flatMap()

let greeting = ["Greetings from", " ", "Vietnam"];

// let's first try using a normal `map()` function
greeting.map(x => x.split(" "));
// ["Greetings", "from"]
// ["", ""]
// ["Vietnam"]


greeting.flatMap(x => x.split(" "))
// ["Greetings", "from", "", "", "Vietnam"]

Object.fromEntries()

const keyValueArray = [
  ['key1', 'value1'],
  ['key2', 'value2']
]

const obj = Object.fromEntries(keyValueArray)
// {key1: "value1", key2: "value2"}

Function​.prototype​.toString()

function sum(a, b) {
  return a + b;
}

console.log(sum.toString());
// function sum(a, b) {
//    return a + b;
//  }

String.prototype.trimStart() / .trimEnd()

let str = "    this string has a lot of whitespace   ";

str.length;
// 42

str = str.trimStart();
// "this string has a lot of whitespace   "
str.length;
// 38

str = str.trimEnd();
// "this string has a lot of whitespace"
str.length;
// 35

Symbol.prototype.description

const me = Symbol("Alberto");
me.description;
// "Alberto"

me.toString()
//  "Symbol(Alberto)"

ES2018

对象的 Rest / Spread 属性

let obj = {
  a: 1,
  b: 3,
  c: 5,
  d: 8,
};

let { a, b, ...z } = obj;
console.log(a); // 1
console.log(b); // 3
console.log(z); // { c: 5, d: 8 }

let clone = { ...obj };
console.log(clone); // { a: 1, b: 3, c: 5, d: 8 }

Lifting tagged template literals restrictions

const raw = String.raw`1\\2\\${1+2}`;

console.log(raw);           //1\\2\\3
console.log(raw.length);    //7

const x = `1\\2\\${1+2}`;
console.log(x);             //1\2\3
console.log(x.length);      //5

Asynchronous iteration

for await (const line of readLines(filePath)) {
  console.log(line);
}

Promise.prototype.finally()

fetch('your-url')
  .then(result => {
    // ...
  })
  .catch(error => {
    // ...
  })
  .finally(() => {
    // ...
  });

RegExp features

// flag for regular expressions
/foo.bar/.test('foo\nbar'); // false
/foo[^]bar/.test('foo\nbar'); // true
// RegExp named capture groups
let re = /(?<year>\d{4})-(?<month>\d{2})-(?<day>\d{2})/u;
let result = re.exec('2015-01-02');
// result[0]; // '2015-01-02'
// result[1]; // '2015'
// result[2]; // '01'
// result[3]; // '02'
// result.groups.year = '2015';
// result.groups.month = '01';
// result.groups.day = '02';

// RegExp lookbehind assertions
// make sure that a pattern is or isn't preceded by another

// Proposal Unicode Property Escapes
const regexGreekSymbol = /\p{Script=Greek}/u;
regexGreekSymbol.test('n'); // true

ES2017

padStart() & padEnd()

'hi'.padStart(10); // "        hi"
'hi'.padEnd(10); // "hi        "
// 不限于添加空格
'hello'.padEnd(11, ' world'); // "hello world"

Object.entries() & Object.values()

const core = {
  amd: 'yes',
  intel: 'no',
};
Object.entries(core); // [ [ 'amd', 'yes' ], [ 'intel', 'no' ] ]
Object.values(core); // [ 'yes', 'no' ]

Async & Await

function walk(amout) {
  return new Promise((resolve, reject) => {
    if (amout < 500) {
      reject('the value is too small');
    }
    setTimeout(() => resolve(`walked for ${amout}ms`), amout);
  });
}

async function go() {
  const res = await walk(500);
  console.log(res);
  const res2 = await walk(900);
  console.log(res2);
  const res3 = await walk(600);
  console.log(res3);
  const res4 = await walk(700);
  console.log(res4);
  const res5 = await walk(400);
  console.log(res5);
  console.log('finished');
}

go();
// walked for 500ms
// walked for 900ms
// walked for 600ms
// walked for 700ms
// uncaught exception: the value is too small

ES2016

Array.prototype.includes()

let array = [1, 3, 5, 7, 9, 11];
// 检查元素是否出现在 Array 中
array.includes(3); // true
array.includes(2); // false
// 添加索引作为第二个参数
array.includes(3, 1); // true
array.includes(5, 4); // false

Exponentiation Operator(求冥运算)

// before
Math.pow(2, 3); // 8
// now
2**3 // 8

JavaScript
赞(0) 收藏(0)
Git 清空 Commit 历史
上一篇
WordPress 禁止附件页面
下一篇
再想想
暂无评论
聚合文章
Git 设置保存用户名密码
Math.pow 封装
Valheim 英灵神殿 服务器搭建(待更新)
WordPress 提示需要访问您网页服务器的权限解决方法
标签
Chrome CSS Docker Git JavaScript Linux MacOS Nginx Steam Typecho Windows WordPress Yarn Youtrack
Git 设置保存用户名密码
2年前
547 0 0
Math.pow 封装
2年前
608 0 2
Valheim 英灵神殿 服务器搭建(待更新)
2年前
1,088 0 0
Typecho 开启 Gzip
3年前
1,033 1 0
  • 0
  • 0
关于

?Σ(゚д゚lll)前端工程师。

社交媒体
Bilibili Steam
导航
分类 技术 游戏 生活 动态 留言板 链接 社交媒体 友情链接 站点导航 CHEYNE 导航
Copyright © 2019-2023 CHEYNE. Designed by nicetheme. 苏ICP备16006033号
  • 分类
    • 技术
    • 游戏
    • 生活
  • 动态
  • 留言板
  • 链接
    • 社交媒体
    • 友情链接
    • 站点导航
  • CHEYNE 导航
# Youtrack # # Yarn # # Nginx # # CSS # # JavaScript #
cheyne
33
文章
3
评论
7
喜欢