简介

JavaScript,也称ECMAScript​​​​​​​,是一种基于对象和事件驱动并具有相对安全性并广泛用于客户端网页开发的脚本语言,同时也是一种广泛用于客户端Web开发的脚本语言。

1.1 JavaScript历史梳理

1995年 用于服务器端对语言处理输入验证(网景)

1996年8月 微软进入web领域,对JavaScript进行了实现(IE3)

1997年 JavaScript标准化提案——Ecma-TC39委员会,确立ECMAScript(ECMA-262)标准

1998年 国际标准化组织(ISO)和国际电工委员会(IEC)将ECMAScript采纳为标准(ISO/IEC-16262)

1.2 JavaScript实现

虽然人们普遍认为ECMAScript就代指JavaScript,但其实JavaScript远远不局限于ECMA-262所定义的标准。

1.2.1 ECMAScript

ECMAScript,即ECMA-262定义的语言,web浏览器只是ECMAScript的一种宿主环境,其他宿主环境还有node.js。

ECMAScript只是对实现这个规范描述所有方面的一门语言的称呼,其中包括:

  • 语法
  • 类型
  • 语句
  • 关键字
  • 保留字
  • 操作符
  • 全局对象

JavaScript实现了ECMAScript,而Adobe ActionScript同样也实现了ECMAScript。

1.ECMAScript版本

ECMAScript 第一版

本质和Javascript1.1差不多,但删除了所有的浏览器特定代码,外加少量的细微修改,加入支持unicode标准,对象脱离平台依赖

ECMAScript 第二版

为了更新之后严格符合ISO/ICE-16262的要求,做了一些编校工作,无增减和特性的改变

ECMAScript 第三版

第一次对这个标准更新,更新了字符串处理、错误定义和数值输出,此外还增加了对正则表达式、新的控制语句、try/catch异常处理的支持

ECMAScript 第四版

更新强数据类型、新语句和数据结构、真正的类与经典的继承,以及操作数据的新手段

ECMAScript 第五版

新增原生的解析和序列化JSON数据的JSON对象、严格模式

ECMAScript 第六版(2015年6月)

俗称ES6,正式支持类、模块、迭代器、生成器、箭头函数、期约、反射、代理和众多新的数据类型。

ECMAScript 第七版(2016年6月)

少量语法层面的增强,如Array.prototype.includes和指数操作符。

ECMAScript 第八版(2017年6月)

增加异步函数(async/await)、ShareArrayBuffer及Atomics API,以及object.values()/Object.entries()/Object.getOwnPripertyDescriptors()和字符串填充方法,另外明确支持对象字面量最后的逗号。

ECMAScript 第九版(2018年6月)

增加异步迭代、剩余和扩展属性、一组新的正则表达式特性、promise finally(),以及模版字面量修订。

ECMAScript 第十版(2019年6月)

增加Array.prototype.flat()/flatMap()、String.prototype.trimStart()/trimEnd()、Object.fromEntries()方法,以及Symbol.prototype.description属性,明确定义了Function.prototype.toString()的返回值并固定了Array.prototype.sort()的顺序。

1.2.2 DOM

文档对象模型是一个应用编程接口(API),用于在HTML中使用拓展的XML。

<html>
  <head>
    <title>Sample Page</title>
  </head>
  <body>
    <p>hello world</p>
  </body>
</html>

 这些代码可以抽象成一组分层节点:

1.为什么dom是必须的

实际上是因为web技术在推进过程中,网景和微软采用不同的思路开发DHTML(HTML),这导致程序员编写一个HTML多平台运行的好日子终结了,为了避免这种情况愈演愈烈,W3C开始制定了DOM标准进程。

2.DOM级别

DOM level 0 (业界说法)

IE4和Netscape Navigator 4 中最初支持的DHTML(注意:这时候并没有形成W3C推荐标准)

DOM level 1

1998年10月,DOM level 1成为W3C推荐标准,这个规范有两个模块组成:DOM Core 和DOM HTML,

DOM Core 提供了一种映射XML文档的方式,从而方便访问和操作文档任意的部分

DOM HTML 增加了特定于HTML的对象和方法

DOM level 2

增加了对鼠标和用户界面事件、范围、遍历(迭代DOM节点的方法)的支持,而且通过对象接口支持了层叠样式表(CSS)。另外,DOM Core也被扩展以包含对XML命名空间的支持。

新增以下模块支持新的接口

  • DOM视图:描述追踪文档不同视图(如应用CSS样式前后的文档)的接口
  • DOM事件:描述事件及事件处理的接口
  • DOM样式:描述处理元素CSS样式的接口
  • DOM遍历和范围:描述遍历和操作DOM树的接口
DOM level 3

增加以统一的方式加载和保存文档的方法(包含在一个叫DOM Load and Save 的新模块中),以及验证文档的方法(DOM Validation),DOM Core 经过扩展支持了XML1.0的特性,包括XML Infoset、XPath、XML Base。

DOM4

W3C不再以level维护DOM了,而是以DOM Living Standard 来维护,其快照被称为DOM。DOM4新增的内容包括替代Mutation Events的Mutation Observers。

3.其他DOM

除了DOM Core 和DOM HTML接口,有些其他语言也发布了自己的DOM标准,下面列出的语言是给予XML的,每一种都增加了该语言独有的DOM方法和接口:

  • 可伸缩矢量图(SVG)
  • 数学标记语言(MathML)
  • 同步多媒体集成语言(SMIL)

此外还有一些语言开发了自己的DOM实现,比如Mozillia的XML用户界面语言(XUL)。不过,只有前面列表中语言是W3C推荐标准。

1.2.3 BOM

IE3和Netscape Navigator 3提供了浏览器对象模型(BOM)API,用于支持访问和操作浏览器的窗口。

总的来说,BOM主要针对浏览器窗口和子窗口(frame),不过人们通常会把任何特定于浏览器的扩展都归在BOM的范畴内。比如,下面就是这样一些扩展:

  • 弹出新浏览器窗口的能力;
  • 移动、缩放和关闭浏览器窗口的能力;
  • navigator对象,提供关于浏览器的详尽信息;
  • location对象,提供浏览器加载页面的详尽信息;
  • screen 对象,提供关于用户屏幕分辨率的详尽信息;
  • performance对象,提供浏览器内存占用、导航行为和时间统计的详尽信息;
  • 对cookie的支持;
  • 其他自定义对象,如XMLHttpRequest和IE的ActiveXObject。

HTML5的出现逐渐定义了清晰的BOM标准化,在此之前各家浏览器的属性和方法都不尽相同

1.3 小结

JavaScript是一门用来与网页交互的脚本语言,包含以下三个组成部分。

  • ECMAScript:由ECMA-262定义并提供核心功能。
  • 文档对象模型(DOM):提供与网页内容交互的方法和接口。
  • 浏览器对象模型(BOM):提供与浏览器交互的方法和接口。

JavaScript的这三个部分得到了五大Web浏览器(IE、Firefox、Chrome、Safari和Opera)不同程度的支持。所有浏览器基本上对ES5(ECMAScript 5)提供了完善的支持,而对ES6(ECMAScript 6)和ES7(ECMAScript 7)的支持度也在不断提升。这些浏览器对DOM的支持各不相同,但对Level3的支持日益趋于规范。HTML5收录的BOM会因浏览器而异,不过开发者仍然可以假定存在很大一部分公共特性。

Logo

欢迎加入 MCP 技术社区!与志同道合者携手前行,一同解锁 MCP 技术的无限可能!

更多推荐