js 历史

javascript 的历史回顾可以让我们里了解某些设计是怎样导致了现有的语法或者某些bug，因此可以简单回溯一下 js 的历史

Q：为啥会出现 javascript？

A：刚开始网景公司为了给表单校验，避免重复的客户端与服务端通信，即优化用户的体验，由于赶发布时间，网景与 Sun 公司联盟开发完成了 JavaScript 的首版本（叫 LiveScript）

Q： javascript 语法为啥有 IE 等常见兼容语法？

A：微软决定向 IE 投入资源，也写了一个类似功能语言（JScript），刚开始创建的语言还没来得及规范和标准化他们两家公司就开弄了，各干各的当然不一样

Q： ESMAScript 是什么？

A： js 脚本语言的标准，有了这个标准，各家浏览器均开始将 ECMAScript 作为 js 实现的依据（虽然具体实现各有不同）但是呈现的调用方式是一致的

js 实现

ESMAScript 是 js 的冰山一角！

其不限于 Web 浏览器，它是将js语言作为一个基准来定义。宿主环境提供 ESMAScript 的基准实现和与环境自身交互必须的扩展，扩展也是使用 ESMAScript 的核心类型和语法

Q： ECMAScript 的宿主环境有哪些？

A： Web 浏览器、服务端 js 平台 Node.js 、 Adobe Flash(逐渐淘汰)

Q： ECMAScript 的主要版本做了啥事情

A：请看 ⬇️ ：

ES6 版本，正式支持类、模块、迭代器、生成器、箭头函数、Promise、Proxy 和 Reflect 等新类型的数据类型 ES6-阮一峰传送门
ES8 主要增加了异步函数（async/await）、SharedArrayBuffer、Atomics API 以及 Object.values()/Object.entries()/Object.getOwnPropertyDescriptors() 和字符串填充的方法，另外明确支持对象字面量最后的逗号
ES9 修订异步迭代、剩余属性和扩展运属性、新的正则表达式特性、Promise finally() 以及模板字面量修订
ES10 修订增加了 Array.prototype.flat()/flatMap()、String.prototype.trimStart()/trimeEnd()、Object.fromEntries() 以及 Symbol.prototype.decription 属性，明确定义了 Function.prototype.toString()的返回值并固定了 Array.prototype.sort() 的顺序，另外修订解决了与JSON字符串兼容的问题，并定义了 catch 子句的可选绑定

Q： ECMAScript 符合性是什么意思

A：就是要实现满足（符合）支持 ECMA 描述的所有“类型、值、对象、属性、函数、以及程序语法与语义”等其他描述

文档对象模型（DOM， Document Object Model) 是一个应用编程接口API，用于在 HTML 中使用扩展的 XML，DOM 将整个页面抽象为一组分层节点。

Q: 将页面标签转化为节点？

A：是的，转换大概是这样的，DOM 的必须性在于不刷新页面就恶意修改页面的内容

<html lang="en">
  <head><title> page title </title> </head>
  <body>
      <div> 呈现的页面内容 </div>
  </body>
</html>

html 表示整个页面，通过 DOM 可以表示为一组分层节点（文档书），以便让开发者可以随心所欲地控制网页的内容和结构（通过 DOM API 来实现添加、删除、替换、修改节点）

- html() 根节点
    - head
        - title
            - page title (文本节点)
    - body
        - div
            - 呈现的页面内容 (文本节点)

因为没有统一的标准，因此网景和微软采用了不同的思路开发 DHTML（动态的 HTML），这样导致开发者写一个 HMTL 页面并不能运行在任何浏览器上，因此万维网联盟（W3C，World Wide Web Consortium）开始制定了 DOM 标准进程

注意⚠️： DOM 并非只能通过 js 来访问，其他语言也实现了，但是对于浏览器来说，DOM 就是使用 ECMAScript 实现的

DOM Levl1 的目标是映射文档结构，其对最初 DOM 的扩展增加了鼠标和用户界面事件、范围、遍历（迭代 DOM节点）的支持，而且通过对象接口支持了层叠样式表（CSS），另外 DOM Level1 的 DOM Core 也被扩展以包含对 XML 命名空间的支持
DOM Level2 新增模块
- DOM 视图：描述追踪文档不同视图的接口。
- DOM 事件：描述事件以及事件处理的接口
- DOM 样式：处理元素 CSS 样式的接口
- DOM 遍历和范围：描述遍历和操作 DOM 树的接口
DOM Level3
- 统一方式加载和保存文档（DOM Load and Save）
- DOM Core 经过扩展支持了所有 XML 1.0 的特性
DOM4
- 新增替代 Mutation Events 的 Mutation Observers
其他 DOM （如下是基于 XML 的方法和接口）
- 可伸缩矢量图（ SVG，Scalable Vector graphics）
- 数学标记语言（ MathML）
- 同步多媒体集成语言（ SMIL ）

浏览器对象模型（BOM）用于访问和操作浏览器的窗口 API，BOM 主要针对浏览器窗口和子窗口（frame），比如如下操作：