一、css和js在网页中的放置顺序是怎么样的？
- css一般放在<head>标签里面。因为浏览器需先渲染css。
-
js一般放在<body>的尾部。因为只有全部js代码都被下载、解析和执行完成后，才能开始呈现页面的内容，因此将js放在<body>元素中页面的内容后面。这样避免浏览器在呈现页面时出现的延迟。
二、解释白屏和FOUC。
- 白屏产生原因： 将js文件放在头部，而未使用defer或async延迟或异步加载js文件，导致js阻塞html和css的加载,就产生了白屏。
- FOUC(Flash of Unstyled Content)无样式内容闪烁：如果把css放在底部，浏览器就会先显示加载的html文件，直到遇到css才开始加载css并重新对内容添加样式。因此会出现短暂的闪烁的现象。
三、async和defer的作用是什么？有什么区别？
- async表示应立即下载脚本，但不应妨碍页面中的其他操作，比如下载其他资源或者等待加载其他脚本。只对外部脚本文件有效。
- defer表示脚本可以延迟到文档完全被解析和显示之后再执行。只对外部脚本文件有效。
- 区别:主要是脚本下载完成之后何时执行，defer会按照加载顺序脚本延迟到文档解析显示后按顺序执行，而有async属性的js文件是谁先下载好谁先执行，并不会按照顺序。
四、简述网页的渲染机制？
-
主要有三个步骤：
1.解析。浏览器会解析HTML，产生一个DOM Tree；解析CSS，产生style rules；解析Javacript，主要通过DOM API和CSSOM API来操作DOM Tree和CSS Rule Tree。
2.解析完成后，浏览器引擎会通过DOM Tree和CSS Rule Tree来构造Render Tree。
3.调用操作系统Native GUI的API绘制。
如下图所示：
五、JavaScript定义了几种数据类型？哪些是简单类型？哪些是复杂类型？
- js包括以下六种数据类型：
数值（number）：整数和小数；
字符串（string）：字符组成的文本（比如”Hello World”）；
布尔值（boolean）：true（真）和false（假）两个特定值；
undefined：表示“未定义”或不存在，即由于目前没有定义，所以此处暂时没有任何值；
null：表示无值，即此处的值就是“无”的状态；
对象（object）：各种值组成的集合。
数值、字符串、布尔值、underfined、null属于简单类型。对象（object）是属于复杂类型。
六、NaN、undefined、null分别代表什么？
- NaN：not a number的缩写是number类型中一个特殊的值，主要出现在将字符串解析成数字出错的场合。。
- NaN不是一种独立的数据类型，而是一种特殊数值，它的数据类型依然属于Number:
typeof NaN // 'number'。 - NaN不等于任何值，包括它本身。
NaN === NaN // false - NaN与任何数（包括它自己）的运算，得到的都是NaN。
- NaN不是一种独立的数据类型，而是一种特殊数值，它的数据类型依然属于Number:
NaN + 32 // NaN
NaN - 32 // NaN
NaN * 32 // NaN
NaN / 32 // NaN
- 判断NaN的方法：
- isNaN方法可以用来判断一个值是否为NaN。但是，isNaN只对数值有效，如果传入其他值，会被先转成数值。也就是说，isNaN为true的值，有可能不是NaN，而是一个字符串。因此，使用isNaN之前，最好判断一下数据类型。
isNaN(NaN) // true
isNaN(123) // false
isNaN('Hello') // true// 相当于isNaN(Number('Hello')) // true
判断NaN更可靠的方法是，利用NaN是JavaScript之中唯一不等于自身的值这个特点，进行判断。
function myIsNaN(value) {
return value !== value;
}
- undefined:表示“未定义”或不存在，即由于目前没有定义，所以此处暂时没有任何值;
- null:表示无值，即此处的值就是“无”的状态。
七、typeof和instanceof的作用和区别？
- typeof运算符可以返回一个值的数据类型。
- 数值、字符串、布尔值分别返回number、string、boolean。函数返回function。undefined返回undefined。
- 除此以外，其他情况都返回object。
- instanceof运算符返回一个布尔值，表示指定对象是否为某个构造函数的实例。比如：
var v = new Vehicle();v instanceof Vehicle // true对象v是构造函数Vehicle的实例，所以返回true。
因此，instanceof运算符的一个用处，是判断值的类型。 - 区别：typeof只是判断一个变量的数据类型，而instanceof可以判断对象是否为某个构造函数的实例。
网友评论