我的前端学习笔记14——js基础

1，CSS和JS在网页中的放置顺序是怎样的？

2，解释白屏和FOUC。

白屏和fouc并不是bug，而是不同浏览器加载和显示机制不同造成的。
白屏: 即网页空白, 不显示任何内容
当CSS放置在代码的最后面, 如果浏览器是等待CSS加载完成之后对HTML元素进行渲染和展示, 在新窗口打开或刷新页面时, 可能因为未加载完成而出现白屏, 使用@import导入CSS和把JS放在顶部也可能导致白屏。
FOUC: (Flash of Unstyled Content) 无样式内容闪烁
当CSS放置在代码的最后面, 如果浏览器是先对HTML元素进行展示，然后等待CSS加载完成之后重新对样式进行修改, 在新窗口打开或刷新页面时, 可能会逐步加载无样式内容, 然后再CSS加载完成后突然展现样式。

3，async和defer的作用是什么？有什么区别？

<script src="script.js"></script>
没有 defer 或 async，浏览器会立即加载并执行指定的脚本，“立即”指的是在渲染该 script 标签之下的文档元素之前，也就是说不等待后续载入的文档元素，读到就加载并执行。
<script async src="script.js"></script>
有 async，加载和渲染后续文档元素的过程将和 script.js 的加载与执行并行进行（异步）。
<script defer src="myscript.js"></script>
有 defer ，加载后续文档元素的过程将和 script.js 的加载并行进行（异步），但是 script.js 的执行要在所有元素解析完成之后，DOMContentLoaded 事件触发之前完成。

从实用角度来说呢，首先把所有脚本都丢到 </body>之前是最佳实践，因为对于旧浏览器来说这是唯一的优化选择，此法可保证非脚本的其他一切元素能够以最快的速度得到加载和解析。

蓝色线代表网络读取，红色线代表执行时间，这俩都是针对脚本的；绿色线代表 HTML 解析

此图告诉我们以下几个要点：

defer 和 async 在网络读取（下载）这块儿是一样的，都是异步的（相较于 HTML 解析）
它俩的差别在于脚本下载完之后何时执行，显然 defer 是最接近我们对于应用脚本加载和执行的要求的
关于 defer，此图未尽之处在于它是按照加载顺序执行脚本的，这一点要善加利用
async 则是一个乱序执行的主，反正对它来说脚本的加载和执行是紧紧挨着的，所以不管你声明的顺序如何，只要它加载完了就会立刻执行
仔细想想，async 对于应用脚本的用处不大，因为它完全不考虑依赖（哪怕是最低级的顺序执行），不过它对于那些可以不依赖任何脚本或不被任何脚本依赖的脚本来说却是非常合适的，最典型的例子：Google Analytics

4，简述网页的渲染机制。

5，JavaScript 定义了几种数据类型? 哪些是简单类型?哪些是复杂类型?

6，NaN、undefined、null分别代表什么?

NaN是一个特殊数字，表示非数(not alike Number)例如Number (“123a”) 得到的即为NaN；NaN 不等于自己。这里注意，他是数字。
undefined表示"缺少值"——表明此处应该有一个值，但是没有定义。例如 var a；
null表示"没有对象"——即该处不应该有值。

7，typeof和instanceof的作用和区别?

instanceof 和typeof都能用来判断一个变量是否为空或是什么类型的变量。
typeof 用以获取一个变量的类型，typeof 一般只能返回如下几个结果：number，boolean，string，function，object，undefined。
我们可以使用 typeof 来获取一个变量是否存在，如 if(typeof a!=“undefined”){}，而不要去使用 if(a)。因为如果 a 不存在（未声明）则会出错，对于 Array,Null 等特殊对象使用 typeof 一律返回 object。
这正是 typeof 的局限性。如果我们希望获取一个对象是否是数组，或判断某个变量是否是某个对象的实例则要选择使用instanceof。
instanceof 用于判断一个变量是否某个对象的实例，如 var a=new Array();alert(a instanceof Array);会返回 true，
同时 alert(a instanceof Object) 也会返回 true;这是因为 Array 是 object 的子类。再如：
```
function test(){};
var a=new test();
alert(a instanceof test) 

会返回 true。
```

谈到instanceof 我们要多插入一个问题，就是 function 的 arguments，我们大家也许都认为 arguments 是一个 Array，但如果使用 instaceof 去测试会发现 arguments 不是一个 Array 对象，尽管看起来很像。