01 初探JavaScript和概述
一、聊一下JavaScript的历史
(1) 产生背景和原因
早期的Html是什么样的呢?
现在收藏的最早的网页
那个时候还没有JavaScript呢!Css也还在整合当中,当初网页要实现一个表单的提交,可没有Html5这么简单轻松。以前的input可没有验证属性之类的验证方法,只有每次提交经有服务器验证确认才能确定自己是否有正确填写格式。
对的也许你已经能够想到当时网民的痛苦,数据格式还不是其它错误都需要30s的等待回复时间,这是一个相当漫长的过程。直到1995年,终于有人站出来解决了这个问题。
以下涉及到的时间仅供参考
网景(Netscape Navigator)这家公司希望通过 “JavaScript” (当时还不叫JavaScript)解决这个问题。
- 1995年2月,网景计划发布的 Netscape Navigator 2 命名为 LiveScript ,它是一门脚本语言,用于浏览器和服务器使用(服务器叫LiveWire),即JavaScript 1.0
- 1995年12月5日,为了有热度,正式发布前夕,决定蹭一波Java的热度,改名叫JavaScript
- 1996你8月,Netscape Navigator 3发布了JavaScript 1.1,同时微软注意到网景,开始投入资源到Internet Explorer,并在其发布不久后,在Netscape Navigator 3加入一些实现(技术)并称其为JScript。至此,JavaScript的实现开始出现不同版本,为后续的指定标准和统一埋下伏笔。
- 1997年,以JavaScript 1.1为蓝本被提交给ECMA(欧洲计算机制造商协会),希望能够实现通用的,标准的脚本语言的语法和语义。经过数月=> ECMA-262, 并命名为ECMAScript。(后面讲到ECMAScript的版本问题)
(2) ECMAScript究竟如何去描述
- ECMAScript规定了一门语言的基础语法标准,比如 数据类型,语法,语句,关键字,保留字,操作符,对象。大家可能都会说 语言是相通的,通的是什么? 其实就是基础语法的很大一部分都极其相似(语句,关键字,保留字,操作符)
- 平时大家说的JavaScript的DOM和BOM相当于基于ECMAScript的基础语法去实现的一个复杂的函数,只是经过层层封装,最后只是需要调用一个对象的方法属性,看起来好像就是语法的一部分,但注意,它本质上仍然是一个功能方法
- 其实说到ECMAScript更多的你应该想起"浏览器引擎",比如Google的著名的V8引擎,它才是真正解析高级API,最终翻译执行一条条最基础的语法。
(3) 停下,聊聊ECMAScript和JavaScript和NodeJs的关系
-
JavaScript现在广义上就是客户端的JavaScript脚本语言,以浏览器作为其宿主环境;而NodeJs则是服务端的JavaScript语言,加入大量的Node API
-
ECMAScript只是对"JavaScript"(广义上的JavaScript)的核心语法的实现,说的像人话一点就是:我们所学的JavaScript的基本语法,包括数据类型,语法,语句,关键字,保留字,操作符,对象等等,平时用的各种API都是通过基础语法去实现的。因此ECMAScript也常被贴上JavaScript的核心,如果没有它,一切API的调度都没有了意义。
-
JavaScript 和 NodeJs 差别就是ECMAScript运行在不同的平台,拥有不同的API进行调度。
(4) ECMAScript故事的后续
- 请注意,其实到了ECMAScript,各大浏览器开始都并不买账,最后还是Netscape最先实现ECMAScript发布的是JavaScript 1.3,后来大家大家基本都以ECMAScript标准去实现,但是注意,只是ECMAScript实现完成了标准,在浏览器这个宿主环境,或者说平台,由于多年的历史积累,以及不知道有多少DOM API和BOM API有不同的实现,从而产生兼容性问题。
- ECMAScript版本问题:在ECMAScript前期,都是以 ECMA-262 + 第N版 结束命名,比如ECMA-262第二版(简称ECMAScript 2),ECMA-262第三版,直到ECMA-262第五版(ECMAScript 5)
- 2011 年,ECMAScript 5.1 版发布后,就开始制定 6.0 版了。因为这个版本引入的语法功能太多,而且制定过程当中,还有很多组织和个人不断提交新功能,于是希望ECMAScript能够快速更新,希望每年6月份发布一次,因为是每年发布一次,所以ECMA-262的版本号改为 ECMA-262 + 年份
- ECMAScript 2015 (如果按照以前的版本命名为ECMAScript 6)是一个 ECMAScript 划时代的版本,引入了非常多的东西,之后的2016、2017变化相对较小,于是在人们口中ES6慢慢泛指ECMAScipt 2015及其以后版本
二、聊一下JavaScript的DOM和BOM
(1) DOM (Document Object Model) 文档对象模型
- DOM是什么?
- DOM是针对XML但扩展用于HTML的应用编程接口API
- 其实从它的名字不难看出,是文档对象的模型,说明和文档的内容有关,文档其实就是HTML,因此可以理解为和HTML有关的所以API接口,都被集中到抽象到 Document Object Model 上
- DOM的发展史:
- Netscape Navigator 3 和 Internet Explorer 4分别支持不同的DHTML(Dynamic HTML),开发人员不需要刷新就能重新加载网页,修改内容和外观,DOM开始产生兼容性问题,只编写一个HTML就能在任何浏览器运行的时代结束
- (World Web Consortium) W3C 开始着手规划DOM的标准
- DOM一级、二级、三级分别出现。其中DOM一级主要是两个部分:DOM核心(如何映射基于XML的文档结构)和 DOM HTML(针对HTML的对象和方法),后两级一直增加新的模块,比如视图、事件、样式等等。
- 浏览器对DOM的支持情况
- 其实每个技术都这样,各各浏览器并不会完全按照标准实现,即使是,也需要相当长的一段事件
(2) BOM (Brower Object Model) 浏览器对象模型
大致是和DOM差不多意思就可,应该很容易理解
- BOM是什么?
- 支持可以访问和操作浏览器的应用编程接口API
- BOM的发展史:
- BOM在之前一部分一直没有相关的标准出现,直到HTML5,致力于把很多BOM功能写入正式规范
- 功能大致包括:
- 弹出新的浏览器窗口
- 移动、缩放和关闭浏览器
- 提供浏览器详细的信息的navigator对象
- 提供加载页面详细信息的location对象
- screen对象
- 对cookie支持
- XMLHttpRequest 和 IE的ActiveXObject
- 兼容,一言难尽