JavaScript入门指南：前端开发的起点

发表时间: 2022-07-11 06:30

JavaScript 最早诞生于1995年，当时主要用来处理输入验证操作，随着时间的发展它成为了市面上浏览器必备的一项功能。如今JavaScript不仅仅局限于简单的数据校验，它已经具备与浏览器窗口及其内容几乎所有方面的交互能力，已经是一个功能全面的编程语言，能够处理复杂的交互和计算。

JavaScript 简史

1995年Netscape 公司的布兰登.艾奇（Brendan Eich）着手开发一种名为 LiveScript的脚步语言。主要用于 Netscape Navigator 浏览器上，为了赶在浏览器发布前完成Livescript 的开发，Netscape 便和 Sun 公司合作，因此Netscape 为了搭上 Java的顺风车，把Livescrip改名JavaScript。

由于JavaScript 1.0版的巨大成功，成为了市场的领袖型公司，在当时的背景下，微软在其ie 3中加入了名为JScript的脚本语言，随着微软的加入，市场上出现多个不同版本的JavaScript，导致每个版本差异巨大，没有统一的标准，引起了许多问题。

于是在1997年，以JavaScript 1.1为基础版本提交给欧洲计算机制造商协会（ECMA）。随后，该协会推出了ECMAScript标准，各浏览器厂商都将此标准作为实现各自JavaScript的实现基础，也在不同程度上取得成功。

JavaScript 的实现

虽然通常JavaScript 和 ECMAScript被认为是相同的含义，但是JavaScript却比ECMA规定的内容要多得多。一个完整的JavaScript 由以下组成：

核心（ECMAScript）
文档对象模型（DOM）
浏览器对象模型（BOM）

1、ECMAScript

ECMAScript 其实与web浏览器没有依赖关系，它不依赖任何环境，web浏览器只是其实现的一种宿主环境。此外还有Node 和 Flash 也都是宿主环境，都实现了各自的ECMAScript 脚本。

ECMAScript 主要有以下核心内容：

语法
类型
语句
关键字
保留字
操作符
对象
类
模块化

2015年6月17日，ECMAScript 6发布正式版本，即ECMAScript 2015，简称ES6，ES6增添了许多必要的特性，例如：模块和类，以及一些实用特性，例如Maps、Sets、Promises、生成器（Generators）等。尽管ES6做了大量的更新，但是它依旧完全向后兼容以前的版本。

截止目前，ES6是各大浏览器支持较好的且稳定的一个版本，以后关于JavaScript的知识都会在ES6的语法基础上介绍。

2、文档对象模型（DOM）

文档对象模型（Document Object Model），是针对XML及其基础上扩展的HTML的应用程序编程接口（API）。DOM把整个网页映射成为一个树状的多层节点结构。页面中每个组成部分都是某种类型的节点，这些节点有包含不同的数据。如下面这个html页面：

<html>  <head>  	<title>标题</title>  </head>  <body>  	<p>段落文字</p>  </body> </html>

通过DOM构建的节点树结构，我们可以很方便的控制页面的内容，比如删除、添加、修改任何节点的内容。

DOM主要内容

DOM 作为一种API，它也是有规范的，1998年DOM成为W3C的推荐标准，DOM从1.0到如今的3.0，其实现了更加丰富的接口，主要有如下这些模块：

DOM 视图：定义跟踪不同文档的视图的接口；
DOM 事件：定义了事件和事件处理的接口；
DOM样式：定义基于css的应用样式接口；
DOM遍历范围：定义了遍历和操作文档的接口；
统一加载和保存文档的方法；
DOM验证：验证文档的方法；
同时开始支持XML1.0规范，涉及XML Infoset、XPath和XMl Base；

其它DOM标准

处理DOM核心和DOM HTML接口外，另外其它语言也发布了针对自己的DOM标准。比如下面几种：

SVG：可伸缩矢量图；
MathMl：数学标记语言；
SMIL：同步多媒体集成语言；

还有一些语言，比如 Mozilla 的XUL（XML 用户界面语言），但是只有上面几种是W3C推荐的标准。

如今，大部分浏览器已经全部支持DOM 1.0 、2.0版，3.0版也大部分都支持，所以我们可以放心的使用，尤其是最近IE浏览器的彻底退出舞台，浏览器兼容问题少了许多。

浏览器对象模型（BOM）

早期Netscape 浏览器和IE浏览器，都支持访问和操作浏览器窗口对象模型。开发者可以控制页面以外的部分，不同于其它，BOM作为JavaScript的实现却没有一个相关的标准。这个问题直到HTML5出现才得到解决，HTML5致力于把BOM纳入正式的规范中。

BOM从根本上讲，只处理浏览器窗口和框架，但人们都习惯把针对浏览器的JavaScript扩展归于BOM的范畴，下面是一些扩展：

弹出浏览器窗口的功能；
移动、缩放和关闭浏览器窗口；
提高浏览器详细信息的navigator对象；
提高浏览器加载的页面详细信息的location对象；
提高显示屏分辨率信息的的screen对象；
对cookies的支持；
XMLHttpRequest 和 IE中的ActiveXObject对象；

由于BOM一直以来没有统一的规范，各个浏览器都有自己的实现，所以差距比较大，但是随着HTML5的发展，BOM朝着兼容性更高的方向发展。

总结

JavaScript 是一种专门为网页设计的脚本语言，其主要由以下三个部分组成：

ECMAScript ，由ECMA-262定义，提高核心功能；
文档对象模型（DOM），提供访问和操作网页内容的接口；
浏览器对象模型（BOM），提高和浏览器窗口交互的方法；

在当前主流浏览器中，对于ES6的大部分功能都得到了支持，随着技术的发展，JavaScript越来越完善，功能也更加强大。

参考资料：

《JavaScript 高级程序设计》第三版

MDN JavaScript 教程 ——
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript