前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >ES10新特性(二)

ES10新特性(二)

作者头像
ConardLi
发布2019-05-23 22:35:27
5960
发布2019-05-23 22:35:27
举报
文章被收录于专栏:code秘密花园

ES10 还只是一个草案。但是除了 Object.fromEntries 之外,Chrome 的大多数功能都已经实现了,为什么不早点开始探索呢?当所有浏览器都开始支持它时,你将走在前面,这只是时间问题。

格式良好的 JSON.stringify()

此更新修复了字符 U+D800 到 U+DFFF 的处理,有时可以进入 JSON 字符串。 这可能是一个问题,因为 JSON.stringify 可能会将这些数字格式化为没有等效 UTF-8 字符的值, 但 JSON 格式需要 UTF-8 编码。

解析方法使用格式良好的JSON字符串,如:

代码语言:javascript
复制
'{ “prop1” : 1, "prop2" : 2 }'; // A well-formed JSON format string

注意,要创建正确 JSON 格式的字符串,绝对需要在属性名周围加上双引号。缺少或任何其他类型的引号都不会生成格式良好的JSON。

代码语言:javascript
复制
'{ “prop1” : 1, "meth" : () => {}}'; // Not JSON format string

JSON 字符串格式与 Object Literal 不同,后者看起来几乎一样,但可以使用任何类型的引号括住属性名,也可以包含方法(JSON格式不允许使用方法):

代码语言:javascript
复制
let object_literal = { property: 1, meth: () => {} };

不管怎样,一切似乎都很好。第一个示例看起来是兼容的。但它们也是简单的例子,大多数情况下都能顺利地工作!

稳定的 Array.prototype.sort()

V8 之前的实现对包含10个以上项的数组使用了一种不稳定的快速排序算法。

一个稳定的排序算法是当两个键值相等的对象在排序后的输出中出现的顺序与在未排序的输入中出现的顺序相同时。 但情况不再是这样了,ES10 提供了一个稳定的数组排序:

代码语言:javascript
复制
var fruit = [    { name: "Apple",      count: 13, },    { name: "Pear",       count: 12, },    { name: "Banana",     count: 12, },    { name: "Strawberry", count: 11, },    { name: "Cherry",     count: 11, },    { name: "Blackberry", count: 10, },    { name: "Pineapple",  count: 10, }];// 创建排序函数:let my_sort = (a, b) => a.count - b.count;// 执行稳定的ES10排序:let sorted = fruit.sort(my_sort);console.log(sorted);

新的F unction.toString()

函数是对象,并且每个对象都有一个 .toString() 方法,因为它最初存在于Object.prototype.toString() 上。 所有对象(包括函数)都是通过基于原型的类继承从它继承的。

这意味着我们以前已经有 funcion.toString() 方法了。

但是 ES10 进一步尝试标准化所有对象和内置函数的字符串表示。 以下是各种新案例:

典型的例子:

代码语言:javascript
复制
function () { console.log('Hello there.'); }.toString();

控制台输出(函数体的字符串格式:)

代码语言:javascript
复制
⇨ function () { console.log('Hello there.'); }

下面是剩下的例子:

直接在方法名 .toString()

代码语言:javascript
复制
Number.parseInt.toString();⇨ function parseInt() { [native code] }

绑定上下文:

代码语言:javascript
复制
function () { }.bind(0).toString();⇨ function () { [native code] }

内置可调用函数对象:

代码语言:javascript
复制
Symbol.toString();⇨ function Symbol() { [native code] }

动态生成的函数:

代码语言:javascript
复制
function* () { }.toString();⇨ function* () { }

prototype.toString

代码语言:javascript
复制
Function.prototype.toString.call({});⇨ Function.prototype.toString requires that 'this' be a Function"

可选的 Catch Binding

在过去,try/catch 语句中的 catch 语句需要一个变量。 try/catch 语句帮助捕获终端级别的错误:

代码语言:javascript
复制
try {    // Call a non-existing function undefined_Function    undefined_Function("I'm trying");}catch(error) {    // Display the error if statements inside try above fail    console.log( error ); // undefined_Function is undefined}

在某些情况下,所需的错误变量是未使用的:

代码语言:javascript
复制
try {    JSON.parse(text); // <--- this will fail with "text not defined"    return true; <--- exit without error even if there is one}catch (redundant_sometmes) <--- this makes error variable redundant{    return false;}

编写此代码的人通过尝试强制 true 退出 try 子句。但是,这并不是实际发生的情况

代码语言:javascript
复制
(() => {    try {        JSON.parse(text)        return true    } catch(err) {        return false    }})()=> false

在 ES10 中,捕获错误的变量是可选的 现在可以跳过错误变量:

代码语言:javascript
复制
try {    JSON.parse(text);    return true;}catch{    return false;}

目前还无法测试上一个示例中的 try 语句的结果,但一旦它出来,我将更新这部分。

标准化 globalThis 对象

这在ES10之前, globalThis 还没有标准化。

在产品代码中,你可以自己编写这个怪物,在多个平台上“标准化”它:

代码语言:javascript
复制
var getGlobal = function () {    if (typeof self !== 'undefined') { return self; }    if (typeof window !== 'undefined') { return window; }    if (typeof global !== 'undefined') { return global; }    throw new Error('unable to locate global object');};

但即使这样也不总是奏效。因此,ES10 添加了 globalThis 对象,从现在开始,该对象用于在任何平台上访问全局作用域:

代码语言:javascript
复制
// 访问全局数组构造函数globalThis.Array(0, 1, 2);⇨ [0, 1, 2]
// 类似于 ES5 之前的 window.v = { flag: true }globalThis.v = { flag: true };
console.log(globalThis.v);⇨ { flag: true }

Symbol.description

description 是一个只读属性,它返回 Symbol 对象的可选描述。

代码语言:javascript
复制
let mySymbol = 'My Symbol';let symObj = Symbol(mySymbol);symObj; // Symbol(My Symbol)symObj.description; // "My Symbol"

Hashbang 语法

也就是 unix 用户熟悉的 shebang。它指定一个解释器(什么将执行JavaScript文件?)。

ES10标准化,我不会对此进行详细介绍,因为从技术上讲,这并不是一个真正的语言特性,但它基本上统一了 JavaScript 在服务器端的执行方式。

代码语言:javascript
复制
$ ./index.js

代替

代码语言:javascript
复制
$ node index.js

ES10类:private、static 和 公共成员

新的语法字符 #octothorpe(hash tag)现在用于直接在类主体的范围内定义变量,函数,getter 和 setter ......以及构造函数和类方法。

下面是一个毫无意义的例子,它只关注新语法:

代码语言:javascript
复制
class Raven extends Bird {#state = { eggs: 10};// getter    get #eggs() {         return state.eggs;    }// setter    set #eggs(value) {        this.#state.eggs = value;    }#lay() {        this.#eggs++;    }constructor() {        super();        this.#lay.bind(this);    }#render() {        /* paint UI */    }}
本文参与 腾讯云自媒体同步曝光计划,分享自微信公众号。
原始发表:2019-03-08,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 code秘密花园 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 格式良好的 JSON.stringify()
  • 稳定的 Array.prototype.sort()
  • 新的F unction.toString()
  • 可选的 Catch Binding
  • 标准化 globalThis 对象
  • Symbol.description
  • Hashbang 语法
  • ES10类:private、static 和 公共成员
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档