Web StandardsⅠ

HTML

CSS

JavaScript

DOM & BOM

ECMAScript

  • JavaScript 的语言标准

  • 由 ECMA TC-39 委员会负责维护和发布

  • 在 ECMA-262 文件中定义

ECMAScript

  • 到2018年7月，一共发布了9个版本

ECMAScript Process

  • Stage 0: Strawman

  • Stage 1: Proposal

  • Stage 2: Draft

  • Stage 3: Candidate

  • Stage 4: Finished

ECMAScript Process

  • Stage 0: Strawman

    • TC-39 成员或者在 ECMA 注册过的会员，用各种形式提出的对语言改进的想法、意见，都可以称为 stage 0

ECMAScript Process

  • Stage 1: Proposal

    • 要求:

      • TC-39中有成员志愿成为 champion ，拥护并负责跟进这份提案

      • 提案描述要解决的问题和大致思路

      • 提案中要展示它的使用方式

      • 对关键实现方式和算法，实现难度的评估

    • 目标

      • ​描述解决问题的方式

      • 确认潜在问题

    • 通常会有 polyfill 或者 demo

ECMAScript Process

  • Stage 2: Draft

    • 要求:

      • 初始的规范文本

    • 目标

      • ​使用正式语言详细描述提案的语法

    • 通常会有试验性的实现

    • 到这一阶段就有很大可能进入规范，并且之后只允许做补充性修改

ECMAScript Process

  • Stage 3: Candidate

    • 要求:

      • 完整的规范文本

      • Reviewer 和编辑们全部在规范上签字

    • 目标

      • ​基本完成规范定制，等待从试验性实现中获得用户反馈

    • 通常会有严格符合规范内容的实现

    • 到这一阶段后，只会在有致命缺陷时才会修改

ECMAScript Process

  • Stage 4: Finished

    • 要求:

      • 完整的测试用例

      • 至少有两个实现通过测试用例

      • 向 ECMAScript 规范仓库提交 PR，并且所有编辑签字同意该 PR

    • 目标

      • ​完成提案，等待下个版本发布

当我们说“发明了一门新的语言”时，

我们在说什么？

Compiler or Interperter

JavaScript 引擎

  • 能够理解和执行 JavaScript 代码的程序或解释器

  • 同义词

    • JavaScript 解释器

    • JavaScript 的实现

  • 例如

    • V8

    • Chakra

    • JavaScriptCore

    • SpiderMonkey

规范与实现

  • 发布一个新的 ECMAScript 版本并不意味着所有现存的 JavaScript 引擎就拥有了这些新功能

  • 取决于开发 JavaScript 引擎的组织是否更新

ECMAScript is an object-oriented programming language for performing computations and manipulating computational objects within a host environment

Native Object

  • Object in an ECMAScript implementation whose semantics are fully defined by this specification rather than by the host environment

  • Object, Number, Date, JSON ...

Host Object

  • Object supplied by the host environment to complete the execution environment of ECMAScript

  • window, document, location, XMLHttpRequest ...

JavaScript Runtime

  • 引擎解释和运行 JavaScript 代码所在的环境

  • Runtime 提供了 JavaScript 可以操作的宿主对象

  • 例如：

    • 浏览器：通过宿主对象 window，提供 DOM 操作等能力

    • Node.js：通过宿主对象 global，提供文件操作等能力

JavaScript 引擎 JavaScript Runtime
V8 Blink(Chrome) Node.js
Chakra EdgeHTML(Edge)
JavaScriptCore WebKit(Safari)

​SpiderMonkey

 Gecko(Firefox)

Two Roles of "window"

  • It is Global object for JavaScript code, as described in the chapter Global object

  • It represents the “browser window” and provides methods to control it

DOM

  • The Document Object Model (DOM) is a programming interface for HTML and XML documents

  • The DOM is an object-oriented representation of the web page, which can be modified with a scripting language such as JavaScript

  • The DOM was designed to be independent of any particular programming language

DOM Standard

BOM

  • 浏览器提供的除了 DOM 之外的接口的统称，没有规范

  • 在 HTML 规范中定义了一部分

  • 不是一个规范的称呼

  • DOM 和 BOM 可以统称为 Web APIs

Quizs

  • Promise

  • MouseEvent

  • XMLHttpRequest

  • document.getElementById()

  • fetch()

  • eval()

  • encodeURIComponent()

  • requestAnimationFrame()

  • setTimeout()

Made with Slides.com