本教程版權(quán)歸小圓和饑人谷所有，轉(zhuǎn)載須說明來源
問答
1. CSS和JS在網(wǎng)頁(yè)中的放置順序是怎樣的？
- CSS使用link標(biāo)簽放在頁(yè)面頂部（
<head>里） - JS放在頁(yè)面底部（
<body>底部）
2. 解釋白屏和FOUC
白屏：如果把樣式放在底部,對(duì)于IE瀏覽器,在某些場(chǎng)景下(新窗口打開,刷新等)頁(yè)面會(huì)出現(xiàn)白屏,而不是內(nèi)容逐步展現(xiàn)。如果使用 @import 標(biāo)簽,即使 CSS 放入 link, 并且放在頭部,也可能出現(xiàn)白屏。把javascript放在頁(yè)面頂部也會(huì)導(dǎo)致白屏現(xiàn)象。
FOUC (Flash of Unstyled Content) 無樣式內(nèi)容閃爍：
如果把樣式放在底部,對(duì)于IE瀏覽器,在某些場(chǎng)景下(點(diǎn)擊鏈接,輸入U(xiǎn)RL,使用書簽進(jìn)入等),會(huì)出現(xiàn) FOUC 現(xiàn)象(逐步加載無樣式的內(nèi)容,等CSS加載后頁(yè)面突然展現(xiàn)樣式).對(duì)于 Firefox 會(huì)一直表現(xiàn)出 FOUC。
3. async和defer的作用是什么？有什么區(qū)別
作用：
aysnc：加載和渲染后續(xù)文檔元素的過程將和 script.js 的加載與執(zhí)行并行進(jìn)行（異步）。
defer：加載后續(xù)文檔元素的過程將和 script.js 的加載并行進(jìn)行（異步），但 script.js 的執(zhí)行要在所有元素解析完成之后，DOMContentLoaded 事件觸發(fā)之前完成。
區(qū)別：
aysnc：不保證順序
defer：腳本延遲到文檔解析和顯示后加載，有順序
4. 簡(jiǎn)述網(wǎng)頁(yè)的渲染機(jī)制
- 解析 HTML 標(biāo)簽, 構(gòu)建 DOM 樹
- 解析 CSS 標(biāo)簽, 構(gòu)建 CSSOM 樹
- 把 DOM 和 CSSOM 組合成 渲染樹 (render tree)
- 在渲染樹的基礎(chǔ)上進(jìn)行布局, 計(jì)算每個(gè)節(jié)點(diǎn)的幾何結(jié)構(gòu)
- 把每個(gè)節(jié)點(diǎn)繪制到屏幕上 (painting)
5. JavaScript 定義了幾種數(shù)據(jù)類型? 哪些是簡(jiǎn)單類型?哪些是復(fù)雜類型?
JavaScript的數(shù)據(jù)類型共有六種：
- 數(shù)值（number）：整數(shù)和小數(shù)（比如1和3.14）
- 字符串（string）：字符組成的文本（比如"Hello World"）
- 布爾值（boolean）：true（真）和false（假）兩個(gè)特定值
- undefined：表示“未定義”或不存在，即此處目前沒有任何值
- null：表示空缺，即此處應(yīng)該有一個(gè)值，但目前為空
- 對(duì)象（object）：各種值組成的集合
簡(jiǎn)單類型：數(shù)值、字符串、布爾值
復(fù)雜類型：對(duì)象
6. NaN、undefined、null分別代表什么?
NaN：含義是Nat a Number，不表示非數(shù)字，NaN和任何值都不相等，包括它本身
undefined：表示不存在值，即此處目前不存在任何值
null：表示空值，即該處的值現(xiàn)在為空
7. typeof和instanceof的作用和區(qū)別?
typeof：判斷數(shù)據(jù)類型
instanceof：判斷一個(gè)變量是否為某一個(gè)對(duì)象的實(shí)例
