JavaScript
JavaScript高级程序设计是入门web前端开发的神级书籍，简称小红书。由于公司业务的发展，我不得不从iOS转向前端开发。目前已上线一款小程序《熊猫超级名片》，在开发过程中，也感受到了一个半吊子前端的困惑和无奈。所以想要从基础开始，打好底子，往后才会事半功倍。
JS = JavaScript , ES = EMACScript， AS = ActionScript
第1-2章
1. EMACScript
ES和WEB浏览器没啥关系，WEB浏览器只是提供了一个宿主环境给ES，宿主环境提供了ES的实现，同时也给他提供了扩展功能。ES本身也没有输出和输入的功能(交互)，例如DOM就是宿主环境对其的扩展，才有了和浏览器交互的功能。其他的宿主环境包括：Node，Adobe Flash。
ES规定的内容主要包括：
- 语法
- 类型
- 语句
- 关键字
- 保留字
- 操作符
- 对象
JS 实现了 ES， AS 也实现了 ES
ES详细介绍：https://baike.baidu.com/item/ECMAScript/1889420?fr=aladdin
2. DOM(文档对象模型)
文档对象模型(DOM, Document Object Model)是用于HTML的应用程序编程接口(API , Application Programming Interface)。DOM把HTML页面映射为多层节点结构，HTML的每个组成部分都是不同类型的节点。例如：
<html>
<head>
</head>
<body>
<p>JS高程</p>
</body>
</html>
通过DOM创建的文档结构树图，我们可以借助DOM的API来轻松的对文档接口进行增删改的操作。
3. BOM(浏览器对象模型)
BOM(Browser Object Model) 其实就是操作浏览器的接口。例如放大缩小浏览器，打开新窗口，移动等。
上面开篇基本带你进入了JS的世界，但也只是一段段的介绍，后面才开始真的JS之旅。
4. JavaScript (和Java没有一毛钱的关系)
上面我们说了JS是对ES的实现，我们要和WEB页面进行交互就需要用到JS。非常简单的就不再描述，在这里只说一些平常不注意的地方，和没了解到的点。
会用到一些HTML和CSS的知识，如果是完全没基础，请移步：http://www.w3school.com.cn/做一些基础的了解再回来。
Netscape(网景): 相当于是JS的老妈，生了它。
把JS放到网页中执行，就要使用到HTML，当初网景为了解决怎样让JS和HTML共存，同时又能在其他浏览器中展示同样的效果，经过讨论实践，最终决定增加了一个标签 <script>。向HTML中插入JS，添加<script>标签是一个主要的方法。
<html>
<head></head>
<body>
<script async charset defer language src type>
</script>
</body>
</html>
可用属性介绍:
- async: 可选。表示应该立即下载脚本，不影响页面其他操作，异步。
- charset：可选。表示通过 src 属性指定的代码的字符集。很多浏览器会忽略
- defer：可选。表示要等到文档结构加载完成之后再加载脚本。只对外部JS文件有效。
- language：已被弃用。
- src：可选。加载外部JS文件。
- type: 可选。默认就是text/javascript，可不写。
<script src="..."></script>如果包含了外部的JS文件，不要在标签内再添加JS代码。如果你用了外域的JS文件， 一定要小心，要么是受信任的，要么是你自己服务器上的。例如：
<script src="https://www.somewhere.com/abc.js"></script>
最好要确保这个文件的安全性。
只要不存在defer, async 属性浏览器都会按照<script>标签的 先后 顺序执行。
<script>标签插入时机
传统的做法是放在<head>标签里：
<html>
<head>
<script src="./js/abc.js"></script>
<script src="./js/efg.js"></script>
</head>
<body>
<!-- 内容 -->
</body>
</html>
这样做的后果就是你需要下载所有的标签里的JS文件然后后面的文档才能渲染，如果下载较慢，则会出现白屏的现象。
这样使用：
<html>
<head>
</head>
<body>
<!-- 内容 -->
<script src="./js/abc.js"></script>
<script src="./js/efg.js"></script>
</body>
</html>
将标签插入到文档流body节点内的最后，使用户进来就能先看到内容，这样就会感觉页面的速度变快了。
HTML5中的 async属性
<html>
<head>
<script src="./js/abc.js" async></script>
<script src="./js/efg.js" async></script>
</head>
<body>
<!-- 内容 -->
</body>
</html>
async 上面说的是，异步加载，就是他不会按照script标签出现的先后顺序加载，所以使用的时候小心了，尽量不要两个文件中的代码互相引用。
嵌入代码和外部文件
没有任何硬性规定必须使用外部文件。但是使用外部文件有几个好处：
- 可维护性强：把所有的JS文件和HTML文件分开，大大提高的可读性和维护性。
- 可缓存：如果多个页面同时使用了同一个JS文件，那么浏览器只会下载其中的一个，剩下的使用到的都会去读缓存里存在的JS文件。
<noscript></noscript>标签
和script标签对立的一个标签，它在以下两点中起作用：
- 浏览器不支持JS脚本
- 浏览器支持JS脚本，但被用户禁用了
<html>
<head>
</head>
<body>
<!-- 内容 -->
<noscript>
<p>需要用户支持(开启)JavaScript脚本</p>
</noscript>
</body>
</html>
当这句话显示出来的时候，就意味着你需要开启JS脚本支持.
该篇简单介绍了JS的学习前知识点, 从读这本书前两章，这些笔记是我看到的比较重点的东西，所以就记录了下来。后面会根据这本书的内容不定期不间断的更新JS的学历历程。
-- 以此来记录JS学习历程。
网友评论