重学JavaScript 篇的目的是回顾基础，方便学习框架和源码的时候可以快速定位知识点，查漏补缺，所有文章都同步在 公众号(道道里的前端栈) 和 github 上。
JavaScript问世
JavaScript 最开始的用途是代替 perl 等后端语言处理输入验证的。在那个年代，验证输入是需要走接口的的，为了解决这一问题，1995年，网景 公司开发了叫 **Mocha(后改名为 LiveScript) **的脚本语言，为了赶时间，网景 和 Sun公司合作，但是后来网景把它改名为 JavaScript，目的就是当时 Java 的炒作，想蹭热度。
JavaScript1.0 问世之后，Web 领域受欢迎程度创历史新高，而网景也成了市场的领导者。这时候微软不服，花了大量资源定向投入 IE，而微软创立的语言叫 JScript(为了避免纠纷)。
1996年，微软开始重磅进入 Web 领域，慢慢的 JavaScript 也规范了起来。
1997年，JavaScript1.1 作为提案被提交给 ECMA(欧洲计算机制造商协会)，之后该组织开始标准化Web脚本，打造了新的 ECMAScript。
1998年，ISO(国际标准化组织) 和 IEC(国际电工委员会) 也将 ECMAScript 作为标准，从此各家浏览器都开始用 ECMAScript 作为自己的JavaScript实现依据。
组成
ECMAscript
JavaScript 包括了：核心(ECMAscript)， 文档对象模型(DOM)，浏览器对象模型(BOM)，也就是说JavaScript 是一个有自己规范和组成的成品，而ECMAScript是一个定义的语言，它并不局限于浏览器，它定义的只是一个基准，浏览器只是ECMAScript实现的一个宿主环境。如果不涉及浏览器，ECMAScript定义了以下部分：
- 语法
- 类型
- 语句
- 关键字
- 保留字
- 操作符
- 全局对象
所以有关前端的JS语言更新，新的API的使用，其实是基于ECMAScript的更新。
DOM
DOM(文档对象模型) 是一个API，用于在 HTML 中使用扩展的 XML，DOM其实就是把整个页面抽象成一个分组了的节点，它们包含了不同的数据。
大多数情况下一个HTML页面的DOM包括 head 和 body，DOM可以通过创建文档树来让开发者随心所欲控制网页的内容和结构，并且通过开发的 DOM API 可以轻松的对DOM进行增删改查。
BOM
BOM(浏览器对象模型) 也是一个API，它是用来访问和操作浏览器窗口的，在各家浏览器百花争艳的年代，BOM没有一个统一的标准，从HTML5出现之后，这个版本的HTML以正式规范的形式涵盖了尽可能多的BOM。
总体来说，BOM主要针对于浏览器窗口和子窗口(frame)，对于它们，有一套专门的API。
JavaScript脚本
一般情况下，我们通过 <script> 元素插入HTML，来实现脚本运行，<script> 元素一共有8个属性：
- async：异步下载脚本，只对外部脚本文件有效
- defer：同步下载脚本，脚本可以延迟到文档解析显示完毕，只对外部脚本有效
- crossorigin：配置请求的CORS，默认不使用，该配置主要表示需不需要请求凭据
- integrity：允许比对接收到的资源和加密签名，如果签名不匹配，脚本不会执行
- src：要执行的外部文件
language：弃用，表示语言类型- type：代替 language，表示脚本的 MIME 类型。一般情况下为 "text/javascript"，MIME类型通常是 "application/x-javascript" ，如果该属性设置为 module，表示代码会当成 ES6 模块，此时才可以使用 import 和 export 关键字。
<script> 元素最强大的也是最受争议的，在于可以包含来自外域的 JavaScript 文件，再请求时，浏览器会发送 GET 请求获取文件，如果该文件是 JavaScript 类型，那么该请求就不受浏览器的同源策略限制，但是返回并执行的javascript受限制。此时，来自外域的代码会被当成该页面的一部分加载，此时就会有危险性，所以要保证域的安全性。
过去，<script> 被放在 <head> 中间，目的是为了把所有的外部文件都集中到一起，但是这样也就意味着必须把所有代码都下载，解析和解释完后，才开始渲染页面，所以现代Web通常将所有JavaScript放在 <body> 内部，从而加快页面的加载速度，减少白屏。
加载
一般情况下，可以通过如下方法往页面中加入脚本：
let script = document.createElement('script');
script.src = 'test.js';
document.head.appendChild(script);
这种方式是异步加载的，其实就相当于给脚本添加了 async 属性，但是有的浏览器不支持该属性，所以最好的做法是加上 script.async = false ，从而将代码变为同步加载。
文档模式
文档模式 是由IE5.5发明的，即可以使用 doctype 切换文档模式，最初有 混杂模式 和 标准模式，后来出现了 准标准模式，而到现在HTML5，对于文档类型已经同意，由最初的混杂的写法，全部统一为<!DOCTYPE html> 。
noscript
noscript 标签是针对不支持JavaScript浏览器而出现的，如果浏览器不支持JavaScript，或者浏览器对脚本的支持被关闭了，那么就会执行该标签的内容：
<!DOCTYPE html>
<html>
<head>
<title>Example HTML Page</title>
<script defer="defer" src="example.js"></script>
</head>
<body>
<noscript>
<p>页面需要开启javascript</p>
</noscript>
</body>
</html>
参考资料：
- JS高程4
- 浅谈HTML文档模式
- 怪异模式和标准模式
我的公众号：道道里的前端栈，每一天一篇前端文章，嚼碎的感觉真奇妙~
常见问题FAQ
- 免费下载或者VIP会员专享资源能否直接商用？
- 本站所有资源版权均属于原作者所有，这里所提供资源均只能用于参考学习用，请勿直接商用。若由于商用引起版权纠纷，一切责任均由使用者承担。更多说明请参考 VIP介绍。
- 提示下载完但解压或打开不了？
- 找不到素材资源介绍文章里的示例图片？
- 模板不会安装或需要功能定制以及二次开发？
发表评论
还没有评论，快来抢沙发吧！