浅谈ES标准的演变

news2024/11/19 23:39:09

ECMAScript从1997年第一版诞生依赖，经过无数人的“踩坑”和“填坑”，到现在，ES12呼之欲出。那么我们不妨讨论一下ES的发展历程，看它如何统一江湖，看它“曲折”而又令人期待的发展之路。

最近分析typescript，其中tsconfig.json有一个配置项target，其值如下：
指定ECMAScript目标版本 "ES3"（默认）、 "ES5"、 "ES6"、"ES2015"、"ES2016"、 "ES2017"、 "ESNext"。
注意： "ESNext"最新的生成目标列表为 ES proposed features

如此，按照严谨性的原则，我们查询一下每个target值之间的差异。

历史进程

在这里插入图片描述
上图按照时间顺序说明了JavaScript、JScript和ECMAScript的发展。
显示在网景工作的Brendan Eich临危受命，用十天时间设计出LiveScript的第一个版本。临时发布前为了讨好Sun公司和Java程序员，LiveScript改名为JavaScript。
微软这边不甘示弱，你的浏览器有脚本功能，我的浏览器也要有啊。于是在IE3.0版本附带退出JScript。为什么叫JScript？因为JavaScript已经被网景公司注册，微软作为一个商业公司必须用一个新的名字。
这下可苦了网页开发者了，虽然两个浏览器都支持脚本，但是两种脚本语法和功能都有区别，一个网页难道要写两套脚本？
一直致力于指定消费电子标准的ECMA组织，审时度势，觉得有必要把网页脚本的语法和功能统一一下，预时发布ECMAScript标准（第一版）。之后对该标准进行了一些修改，更新到ECMAScript3（以下简称ES3）。
所以说ECMAScript是这种网页脚本的标准，而JavaScript和JScript则是ECMAScript的两种实现。
此后的浏览器厂商都尽量依据ES3来实现自己的脚本语言。如IE8中的JScript5.8、Firefox中的JavaScript1.5，都是兼容ES3标准的。
从上图你会发现，之后的9年（2000-2009），ES没有任何升级。期间的ES4居然被放弃了。具体原因博友们可以去查一下资料。直到2009年，ES5横空出世，同年，前端界也出了一个大事件——Node.js发布。Node.js是一个基于Google Chrome的V8引擎（2008年发布）的JS运行环境。
从这一年开始，前端火了。
因为JS跳出了浏览器，可以在任何地方运行了。前端工程师被浏览器禁锢的创造力，如雨后春笋般爆发。
JS维持了几年的高速增长后，大家发现JS语言本身，已经不适应他的发展速度了，于是ES的更新越来越快，2015年发布ES6，2016年的ES7直接更名为ES2016，你猜对了，以后ES说不定会每年更新一次了……
后续： ES2017、ES2018陆续出现，在许多产商的共同努力一下，兼容ECMA逐渐成为共识。

ECMA的版本差异

如上所述，说起ES的标准不得不提ECMA-262规范，前两个版本更新尚算给力，进入版本3之后，版本4莫名夭折，终于在2009年等来版本5，之后进入6年的沉寂，终于在2015年，在千呼万唤中ES6正式发布。ES6的到来为JS的发展带来众多特性，同时也开启了ES版本发展的新纪元。下面，我列举了ECMA的发展历程：

版本时间描述别名下载地址
ECMA-262 1st edition1997-06第一版发版PDF
ECMA-262 2nd edition1998-08PDF
ECMA-262 3rd edition1999-12第三版发布，几乎所有浏览器都兼容该版本ES3PDF
ECMA-262 4th edition-实际并未存在，就其原因可以参考【原因分析】原因分析
ECMA-262 5th edition2009-12版本5ES5PDF
ECMA-262 5.1th edition2011-06版本5.1ES5.1PDF
ECMA-262 6th edition2015-06版本6ES6PDF
ECMA-262 7th edition2016-06版本7,从此版本开始又称ES2016，并规定每年一发版。ES7 ES2016PDF
ECMA-262 8th edition2017-06ES2017ES8PDF
ECMA-262 9th edition2018-06ES2018ES9PDF
ECMA-262 10th edition2019-06ES2019ES10PDF
ECMA-262 11th edition2020-06ES2020ES11PDF
ECMA-262 12th edition2021-06ES2021ES12PDF(https://www.ecma-international.org/wp-content/uploads/ECMA-262_12th_edition_june_2021.pdf)
ECMA-262 13th edition-ES2022ES13提案中

可以发现，从ES6开始，ECMA的规范发展明显加快，并基本保持一年一个版本的趋势（每年6月）。

接下来，我们分析一下每个版本的变化。ES1-2太多久远，关注意义不大，我直接从ES3开始。

ES3

ES属于标准统一阶段，基本上将之前的实现统一，特定如下：
1） regular expressions 正则表达式
2） better string handling 字符串处理
3） new control statements 新的控制语句
4） try/catch exception handling try/catch 异常处理
5） tighter definition of errors 错误定义
6） formatting

ES5

  1. 属性和值的定义的变化
    增加了Object.defineProperty，支持writable、enumerate、configurable、deletable，同时支持getter和setter方法。
    还包括：

    • Object.defineProperties(obj, propName, descriptorSet)
    • Object.create(protoObj, descriptorSet)
    • Object.getOwnPropertyNames(obj)
    • Object.Prototype
    • Object.getPrototypeOf(obj)
    • Object.getOwnPropertyDescriptor
    • Object.getOwnPropertyNames
    • Object.preventExtensions
    • Object.isExtensible(obj)
    • Object.seal
    • Object.isSealed(obj)
    • Object.freeze
    • Object.isFrozen(obj)
    • Object.keys

    所以抱怨IE不支持Vue的同学可以了解，defineProperty在ES5中才引入，而IE低版本只支持到ES3。

  2. Function变化

    the value of ‘this’ will not be changed when calling ‘.call()’ or ‘.apply()’
    ‘null’ and ‘undefined’ will not be returned to global
    a non-object will not be switched to an object
    new method Bind. This bind method allows the user to set up the value of this and apply the value to the function.

    由此我们可以看出，主要的变化是增加bind函数，如下：

    var name = 'shushanfx';
var obj = { name: 'Alex' };
function getName() {
  return this.name
}
var func2 = getName.bind(obj);
console.info(getName());     // 输出 shushanfx
console.info(func2());       // 输出 Alex

    此处需要注意，对于低版本浏览器， ES5并没有全面支持，所以使用bind等函数需要加polyfill。

  3. Array
    增加了一些数组的方法，如下：
    • Array.prototype.indexOf
    • Array.prototype.lastIndexOf
    • Array.prototype.every
    • Array.prototype.some
    • Array.prototype.forEach
    • Array.prototype.map
    • Array.prototype.filter
    • Array.prototype.reduce
    • Array.prototype.reduceRight

  4. JSON
    增加了JSON对象，并提供了JSON.parse和JSON.stringify两个对象
    JSON.stringify() → string
    JSON.parse() → value

  5. strict mode
    引入strict mode，错误的赋值语句将报错。详细的严格模式定义如下：

    • 全局变量显式声明，必须先声明再使用；
    • 静态绑定
      • 禁用with语句
      • 创设eval作用域
    • 增强的安全措施
      • 禁止this关键字指向全局对象
      • 禁止在函数内部遍历调用栈
    • 禁止删除变量，除非显式的标记为可删除
    • 显式报错
    • 重名错误
      • 对象不能有重名的属性
      • 函数不能有重名的参数
    • 禁止八进制表示法
    • arguments对象的限制
      • 不允许对arguments赋值
      • arguments不再追踪参数的变化
      • 禁止使用arguments.callee
    • 函数必须声明在顶层
    • 保留字

ES6

ES6应该是js的跨时代的更新，它的出现，解决了ES5长久积累的问题，也为js的发展带来的新的希望。特性如下：

  • let 定义以及块作用域
  • 箭头函数
  • for…of 循环
  • generators函数
  • class定义
  • Promise引入
  • 参数扩展，如默认值、剩余参数、扩展操作符
  • 字符串占位符
  • Object 属性扩展，属性定义简写、计算属性支持、方法属性支持；
  • 赋值语句扩展
    • 数组赋值
    • 对象赋值
    • 参数赋值
    • 多重赋值
  • 模块
    • export、import支持
    • default关键字
  • Symbol
  • Map、Set & WeakMap、WeakSet
  • Typed Arrays
  • 方法扩展
    • Object.assign
    • Array.prototype.find Array.prototype.findIndex
    • String.protype.repeat
    • String.protype.startsWith endsWith includes
    • Number.isNaN isFinite isSafeInteger
    • Math.trunc 去尾
    • Math.sign 获取函数符号
  • Proxy
  • Reflect
  • Internationalization & Localization
    • 数字
    • 货币
    • 日期

ES7（ES2016）

TC39，作为ECMAScript的执行委员会，决定从ES7开始，决定每年发布一版本。

  • Array.prototype.inclues
  • ** 操作符（平方）

ES8 （ES2017）

改动如下：

  • Object.entries
  • Object.values
  • String Padding： String.prototype.padStart String.protype.padEnd
  • Object.getOwnPropertyDescriptors
  • 函数参数支持末尾增加逗号(trailing comma)
  • Async functions

注意： async function是ES8才正式加上的，也就是说在这之前，async函数均会以语法糖的形式编译成另外一种形式。具体可以参加async编译后的产物

ES9（ES2018）

  • Spread properties to Object
    在这里插入图片描述
  • Asynchronous Iteration
  • Promise.prototype.finally
  • 正则表达式增强
    • s模式
    • 命名分组
      在这里插入图片描述
    • 前置条件
      在这里插入图片描述

ES10（ES2019）

  • Array.prototype.flat
    在这里插入图片描述
  • Array.prototype.flatMap
    在这里插入图片描述
  • Object.fromEntries() 从entries中复制一个对象
    在这里插入图片描述
  • String.prototype.trimStart、String.prototype.trimEnd
    在这里插入图片描述
  • try/catch不需要捕获e
    在这里插入图片描述
  • Function.prototype.toString优化，可以获取更加格式化的信息
    在这里插入图片描述
  • Symbol.prototype.description，增加只读属性description
    在这里插入图片描述
  • JSON.stringify优化，增加对unicode的处理
    在这里插入图片描述
  • Array.prototype.sort排序方式修改，改成TimSort
    10以上使用快排，10以下使用插入排序

ES2020

待补充

ES2021

待补充

小结

从1997年发布至今，经历20多年的发展，ES标准逐步完善。同时随着nodejs的兴起，物联网端的应用，es标准将会被更多厂商采用，js开发最好的时代正在向你走来。适当的了解一下ES标准，有助于js的学习，如果时间充裕的话，强烈建议大家去阅读ECMA-262标准文档，相信会受益良多。

参考文档

  1. javascript严格模式详解： https://www.ruanyifeng.com/blog/2013/01/javascript_strict_mode.html
  2. ECMAScript3 VS ECMAScript5 http://www.jiehuang.net/wordPress/uncategorized/ecmascript/
  3. New Features of ECMAScript 2017: https://lethalbrains.com/new-features-of-ecmascript-2017-c25a9db5f5e0?gi=17dbf351b3a5
  4. New ES2018 Features: https://css-tricks.com/new-es2018-features-every-javascript-developer-should-know/
  5. What’s New in ECMAScript
    2019: https://selvaganesh93.medium.com/javascript-whats-new-in-ecmascript-2019-es2019-es10-35210c6e7f4b
  6. ECMA历史记录： https://www.ecma-international.org/publications-and-standards/standards/ecma-262/

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/62615.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

双机互备是什么意思？双机互备就是双机热备吗？

双机互备是什么意思？双机互备就是双机热备吗？

看到不少小伙伴在问，双机互备是什么意思？双机互备就是双机热备吗？今天我们就来一起简单了解了解吧！ 双机互备是什么意思？双机互备就是双机热备吗？ 双机互备是指在双机热备的基础上，两个相对独…
阅读更多...
【AI数学】余弦相似性（含python实现）

【AI数学】余弦相似性（含python实现）

Cosine Similarity，即余弦相似度，又叫余弦相似性。是一个中学数学的概念，即用两个向量之间的夹角余弦值代表这两个向量之间的相似度。 Cosine Similarity虽然简单，但广泛应用在AI模型中，比如CLIP计算图像embedding和文…
阅读更多...
【KCP】UDP可靠性传输

【KCP】UDP可靠性传输

1 如何做到可靠性传输 ◼ ACK机制 ◼ 重传机制 ◼ 序号机制 3 2 1 -》2 3 1 ◼ 重排机制 2 3 1 ->3 2 1 ◼ 窗口机制 Tcp不用我们管 可靠性udp 5种机制都需要用户层处理 2 UDP与TCP，我们如何选择 3 UDP如何可靠，KCP协议在哪些方面有优势 以10%-20%…
阅读更多...
Java人事管理系统oa人力人事办公(含源码+论文+答辩PPT等)

Java人事管理系统oa人力人事办公(含源码+论文+答辩PPT等)

项目功能简介: 该项目采用技术JSP、Struts2、MyBatis、dwr、Tomcat服务器、MySQL数据库、项目含有源码、配套开发软件、软件安装教程、项目发布教程以及代码讲解教程 【项目使用技术：】Struts2MyBatisdwrjqueryjscss等技术 【技术特色】 文件上传： Strut…
阅读更多...
Android依赖注入与Hilt的使用

Android依赖注入与Hilt的使用

提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档 目录 基础知识 一、依赖注入是什么？ 二.如果依赖注入这么简单，为什么需要专门开发一个框架？ 三.安卓的依赖注入框架Dagger与Hilt 四.…
阅读更多...
[附源码]计算机毕业设计基于Springboot甜品购物网站

[附源码]计算机毕业设计基于Springboot甜品购物网站

项目运行 环境配置： Jdk1.8 Tomcat7.0 Mysql HBuilderX（Webstorm也行） Eclispe（IntelliJ IDEA,Eclispe,MyEclispe,Sts都支持）。 项目技术： SSM mybatis Maven Vue 等等组成，B/S模式 M…
阅读更多...
如何恢复文件夹隐藏文件？超实用的2种技巧来了

如何恢复文件夹隐藏文件？超实用的2种技巧来了

案例：电脑中毒，文件夹数据自动隐藏，现在全都找不到了怎么办？——在日常办公使用电脑过程当中，总会遇到这样那样的问题，比如文件夹数据隐藏问题，当我们需要这些数据时如何恢复正常呢？…
阅读更多...
java计算机毕业设计ssm图书馆管理系统z3z90（附源码、数据库）

java计算机毕业设计ssm图书馆管理系统z3z90（附源码、数据库）

java计算机毕业设计ssm图书馆管理系统z3z90（附源码、数据库） 项目运行 环境配置： Jdk1.8 Tomcat8.5 Mysql HBuilderX（Webstorm也行） Eclispe（IntelliJ IDEA,Eclispe,MyEclispe,Sts都支持）…
阅读更多...
[附源码]计算机毕业设计基于SpringBoot的疫苗接种管理系统

[附源码]计算机毕业设计基于SpringBoot的疫苗接种管理系统

项目运行 环境配置： Jdk1.8 Tomcat7.0 Mysql HBuilderX（Webstorm也行） Eclispe（IntelliJ IDEA,Eclispe,MyEclispe,Sts都支持）。 项目技术： SSM mybatis Maven Vue 等等组成，B/S模式 M…
阅读更多...
算法leetcode｜19. 删除链表的倒数第 N 个结点（rust重拳出击）

算法leetcode｜19. 删除链表的倒数第 N 个结点（rust重拳出击）

文章目录19. 删除链表的倒数第 N 个结点：样例 1：样例 2：样例 3：提示：原题传送门：分析题解rustgocpythonjava19. 删除链表的倒数第 N 个结点： 给你一个链表，删除链表的倒数第 n 个结…
阅读更多...
专享策略No.3 | 商品截面交易策略

专享策略No.3 | 商品截面交易策略

量化策略开发，高质量社群，交易思路分享等相关内容 『正文』 ˇ 大家好，2022松鼠俱乐部临近收官。前面发布了专享策略01V3 | 小短波策略，专享策略No.2 | 套利策略-自动换仓-出场加速。今天我们交付第三个专享策略：商品…
阅读更多...
C语言—详解库函数中常用的字符串函数

C语言—详解库函数中常用的字符串函数

C语言中对字符和字符串的处理很是频繁，但是C语言本身是没有字符串类型的，字符串通常放在 常量字符串中或者字符数组中。字符串常量适用于那些对它不做修改的字符串函数。本篇文章为大家详解八个常用的字符串操作函数，同时我们尝试模拟实现该函…
阅读更多...
OpenCV入门（C++/Python）-使用OpenCV裁剪图像（四）

OpenCV入门（C++/Python）-使用OpenCV裁剪图像（四）

裁剪是为了从图像中删除所有不需要的物体或区域。甚至突出显示图像的特定功能。 使用OpenCV裁剪没有特定的功能，NumPy数组切片是工作。读取的每个图像都存储在2D数组中（对于每个颜色通道）。只需指定要裁剪区域的高度和宽度（以像素…
阅读更多...
Linux安装 dotnet sdk 6.0

Linux安装 dotnet sdk 6.0

一、离线安装（推荐） 1、下载安装包 官网下载地址 2、安装 （1）将安装包上传到linux服务器上的指定目录，如：/root/dotnet/sdk，运行下面指令解压即可 # cd /root/dotnet/sdk # mkdir -p $HOM…
阅读更多...
毕设项目 - SSM留学生交流互动论坛系统(含源码+论文)

毕设项目 - SSM留学生交流互动论坛系统(含源码+论文)

文章目录1 项目简介2 实现效果2.1 界面展示3 设计方案3.1 概述3.2 系统流程3.2.1 系统开发流程3.2.2 学生登录流程3.2.3 系统操作流程3.3 系统结构设计4 项目获取1 项目简介 Hi，各位同学好呀，这里是M学姐！ 今天向大家分享一个今年(2022)最新…
阅读更多...
微服务的好处（优点）有哪些？

微服务的好处（优点）有哪些？

显然，随着系统复杂度的提升，以及对系统扩展性的要求越来越高，微服务化是一个很好的方向，但除此之外，微服务还会给我们带来哪些好处？ 独立，独立，还是独立 我们说微服务打响的是各自…
阅读更多...
虹科方案|具有RDMA复制写入日志的高可用性HDD存储集群可提供出色的性能

虹科方案|具有RDMA复制写入日志的高可用性HDD存储集群可提供出色的性能

一、引言 Open-E、Western Digital 和 ATTO 数据存储专家和工程师联手推出了基于 HDD 的数据存储设备，该设备结合Western Digital Ultrastar Data60 JBOD 的海量容量和Ultrastar 系列 HDD 以及加速的性能，这得益于ATTO HBA SAS 控制器和 100GbE NIC&…
阅读更多...
制作一个简单HTML大学生抗疫感动专题网页（HTML+CSS）

制作一个简单HTML大学生抗疫感动专题网页（HTML+CSS）

🎉精彩专栏推荐 💭文末获取联系 ✍️ 作者简介: 一个热爱把逻辑思维转变为代码的技术博主 💂 作者主页: 【主页——🚀获取更多优质源码】 🎓 web前端期末大作业： 【📚毕设项目精品实战案例 (10…
阅读更多...
一文刨析C/C++全局常量的定义

一文刨析C/C++全局常量的定义

目录 文件特性常量 文件常量 堆常量 EOF, WEOF errno 常量 数学常量 数学错误常量 共享常量 转换模式常量 文件读/写访问常量 NULL (CRT) stdin, stdout, stderr 文件特性常量 语法 #include <io.h> 备注 这些常量指定由函数指定的文件或目录的当前特性。…
阅读更多...
软件杂志软件杂志社软件编辑部2022年第9期目录

软件杂志软件杂志社软件编辑部2022年第9期目录

基金项目论文 基于Blockly和树莓派的多模态控制智能车 杨杰;宋俊炜;吴思玮;魏苏州;赖晓晨; 1-313 基于神经网络的网络异常研究与实现 郭稼逸; 4-6《软件》投稿&#xff1a;cnqikantg126.com 计算机视觉技术在电力系统自动化中的应用 陈海远;顾雅青; 7-9 基于优…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023