ECMAScript概览 - TOMMYHU - 专注互联网开发及运营技术,提供相关资料及软件下载,奇趣网络时事评论!
Dec 9

ECMAScript概览 不指定

tommyhu , 22:28 , 软件分析与设计 , 评论(0) , 引用(0) , 阅读(89) , Via 本站原创 | |
前言 (介绍 ECMAScript)
最初 JavaScript 语言有 2 份标准:

ECMA-262:主标准,由 ECMA 国际组织(Ecma International)负责管理(为了让最初的JavaScript 与最初的 JScript 能遵循同一套标准发展而诞生的 ECMAScript ,正好排到了作为 Ecma 的 262 号标准,所以得到 ECMA-262 编号。)

ISO/IEC 16262:第二标准,由国际标准化组织 ISO(International Standard Organization)和国际电子技术委员会 IEC(International Electrotechnical Commission)负责管理

出于商标版权的原因,规范标准中将这门语言称为 ECMAScript ,所以原则上 JavaScript 与 ECMAScript 指的是同一个东西,但有时也会加以区分:

JavaScript:指语言及其实现
ECMAScript:指语言标准及语言版本,比如 ES6 表示语言(标准)的第 6 版
ECMAScript 发展历史
ECMAScript 1(1997 年 6 月):规范第一版
ECMAScript 2(1998 年 6 月):为了同步 ISO 标准,引入了一些小更新
ECMAScript 3(1999 年 12 月):增加了正则表达式、字符串处理、控制语句(do-while、switch)、异常处理(try-catch)等众多核心特性
ECMAScript 4(2008 年 7 月废除):本来是一次大规模升级(静态类型、模块、命名空间等),但跨度过大,出现了分歧,最终没能推广使用
ECMAScript 5(2009 年 12 月):变化不大,加了一些标准库特性和严格模式
ECMAScript-5.1(2011 年 6 月):又一次小更新,为了同步 ISO 标准
ECMAScript 6(2015 年 6 月):一大波更新,实现了当年 ES4 的许多设想,并正式改为按年份命名规范版本
ECMAScript 2016(2016 年 6 月):第一个年度版本,与 ES6 相比,发布周期较短,新特性也相对少些
ECMAScript 2017(2017 年 6 月):第二个年度版本...
以后的 ECMAScript 版本(ES2018、ES2019、ES2020 等)都在 6 月正式获准生效

开始 (聚焦 ES6)
这里引用 阮一峰 老师的 ES6标准入门 一书中的总结:ES6 既是一个历史名词,也是一个泛指,含义是 5.1 版本以后的 JavaScript 的下一代标准,涵盖了 ES2015、ES2016、ES2017 等,而 ES2015 则是正式名称,特指当年发布的正式版本的语言标准 市面上提到的 ES6 一般是指 ES2015 标准,但有时也是泛指 下一代 JavaScript

本文主要讲解以下内容:

块级作用域(Block scoping,ES2015)
解构(Destructuring,ES2015)
箭头函数(Arrow Functions,ES2015)
模板字符串(template string,ES2015)
剩余参数 / 展开语法(Rest and spread parameters,ES2015)
对象字面量简写语法(Object shorthand,ES2015)
数组实例的 includes() (ES2016)
Async/await 异步语法 (ES2017)
块级作用域
为什么需要块级作用域?

ES5 只有全局作用域和函数作用域,没有块级作用域,这导致很多场景不合理。

第一种场景,内层变量可能会覆盖外层变量。

以上代码的原意是, if 代码块的外部使用外层的 tmp 变量,内部使用内层的 tmp 变量。但是,函数 fn 执行后,输出结果为 undefined ,原因在于变量提升导致内层的 tmp 变量覆盖了外层的 tmp 变量。

第二种场景,用来计数的循环变量泄露为全局变量。

上面的代码中,变量 i 只用来控制循环,但是循环结束后,它并没有消失,而是泄露成了全局变量。

let 实际上为 JavaScript 新增了块级作用域。

上面的函数有两个代码块,都声明了变量 n,运行后输出 5 。这表示外层代码块不受内层代码块的影响。如果使用 var 定义变量 ,最后输出的值就是 10

那么我们能利用块级作用域做什么呢?

我们先来做道面试题

改成 ES6 中的 let

看到这,相信聪明的你已经理解块级作用域的好处了 O(∩_∩)O

那么 ES5 能不能实现 块级作用域 的效果呢? 可以的,我们可以利用闭包

解构
解构 :是将一个数据结构分解为更小的部分的过程。ES6 中,从数组和对象中提取值,对变量进行赋值。

那么解构有什么用处呢?

可以大大的简化变量声明操作。

上面代码只用了两行,就定义了两个简单的工具函数。如果不用箭头函数,可能就要占用多行,而且还不如现在这样写醒目。

箭头函数使用注意点

函数体内的 this 对象,就是定义时所在的对象,而不是使用时所在的对象。
不可以当作构造函数,也就是说,不可以使用 new 命令,否则会抛出一个错误。
不可以使用 arguments 对象,该对象在函数体内不存在。如果要用,可以用 rest 参数代替。
不可以使用 yield 命令,因此箭头函数不能用作 Generator 函数。
上面四点中,第一点尤其值得注意。this 对象的指向是可变的,但是在箭头函数中,它是固定的。


上面代码中,函数 getTitle 内部有三个操作:抓取网页、取出文本、匹配页面标题。只有这三个操作全部完成,才会执行 then 方法里面的 console.log

结束(意犹未尽)
文章介绍了 ES6 常用的一些语法以及使用场景; 但是 ES6 内容远不止于此,感兴趣的同学可以去 阮一峰老师的 ES6 入门教程[1] 一书中查看详细内容。如果您认可这本书,也可以去正版渠道购买书籍。这样可以使出版社不因出版开源书籍而亏钱,进而鼓励更多的作者开源自己的书籍。

后记(列举API)
还有很多 ES6 实用的 API 我就简单提及一下,朋友们看看平时是否有用到
相关日志(relate log)
  • 中查看更多“ECMAScript概览”相关内容
  • 中查看更多“ECMAScript概览”相关内容
  • 中查看更多“ECMAScript概览”相关内容
  • 中查看更多“ECMAScript概览”相关内容
  • 在此发表你对本文的看法:

    您的称呼(例如:乔布斯、tommyhu 等)

    emotemotemotemotemotemotemotemotemotemotemotemotemotemotemotemot