1.CSS和JS在網(wǎng)頁(yè)中的放置順序是怎樣的？
答：CSS一般放在<head>中利术，而JS一般放置在<body>最下面呈野。
2.解釋白屏和FOUC
答
- 白屏：如果把樣式放在底部，對(duì)于某些場(chǎng)景的IE瀏覽器下印叁，頁(yè)面會(huì)出現(xiàn)白屏被冒，而不是內(nèi)容逐步呈現(xiàn)军掂，如果使用
@import標(biāo)簽也會(huì)白屏。當(dāng)把JS文件放在頂部姆打，因?yàn)镴S腳本加載時(shí)會(huì)阻止后面內(nèi)容的呈現(xiàn)以及其組件的下載良姆，所以也會(huì)發(fā)生白屏。 - FOUC（無(wú)樣式內(nèi)容閃爍）：如果把CSS樣式放在底部幔戏，對(duì)于某些場(chǎng)景下的IE瀏覽器玛追，會(huì)出現(xiàn)FOUC（先逐步加載HTML內(nèi)容，等CSS加載完成時(shí)突然出現(xiàn)樣式）對(duì)于Firefox瀏覽器則會(huì)一直發(fā)生FOUC闲延。
3.async和defer的作用是什么痊剖？有什么區(qū)別
答:
- 沒(méi)有async和defer的時(shí)候，瀏覽器會(huì)立即加載執(zhí)行指定腳本垒玲，立即的意思是渲染該
script標(biāo)簽之下的文檔元素前陆馁，就是不等待后續(xù)載入的文檔元素，讀到就加載并執(zhí)行合愈。 - 有async時(shí)叮贩，加載和渲染后續(xù)文檔時(shí)候的過(guò)程將和
script.js的加載與執(zhí)行過(guò)程一起進(jìn)行（異步）。 - 有defer佛析，加載后續(xù)文檔元素的過(guò)程將與
script.js的加載同時(shí)進(jìn)行益老，但是script.js的執(zhí)行只要在所有元素解析完成之后，DOMContentLoaded事件觸發(fā)之前完成寸莫。 - 區(qū)別：async不保證順序捺萌。defer腳本延遲到文檔解析和顯示后執(zhí)行，有順序膘茎。
4.簡(jiǎn)述網(wǎng)頁(yè)的渲染機(jī)制
答：第一步：瀏覽器在接收到服務(wù)器返回的頁(yè)面信息后桃纯，遇到解析html標(biāo)簽構(gòu)建DOM樹(shù)，遇見(jiàn)解析CSS標(biāo)簽構(gòu)建CSSOM樹(shù)
- DOM：Document Object Model披坏，瀏覽器將HTML解析成樹(shù)形的數(shù)據(jù)結(jié)構(gòu)态坦，簡(jiǎn)稱(chēng)DOM。
- CSSOM:CSS Object Model,瀏覽器將CSS代碼解析成樹(shù)形的數(shù)據(jù)結(jié)構(gòu)棒拂。
- DOM樹(shù)的構(gòu)建過(guò)程是一個(gè)深度遍歷過(guò)程：當(dāng)前節(jié)點(diǎn)的所有子節(jié)點(diǎn)都構(gòu)建完成好后才會(huì)去構(gòu)建當(dāng)前節(jié)點(diǎn)下的下一個(gè)兄弟節(jié)點(diǎn)驮配。
第二步：DOM與CSSOM合成后生成Render Tree，如上圖
Render Tree和DOM一樣着茸，以多叉樹(shù)的形式保存了每個(gè)節(jié)點(diǎn)的本身屬性和CSS屬性壮锻，以及其子節(jié)點(diǎn)。
第三步：有了Render Tree之后涮阔，瀏覽器知道了網(wǎng)頁(yè)中有哪些節(jié)點(diǎn)猜绣，以及各個(gè)節(jié)點(diǎn)的CSS定義和從屬關(guān)系，下一步我們稱(chēng)之為layout就是計(jì)算出每個(gè)節(jié)點(diǎn)在屏幕中的位置敬特。
第四步：瀏覽器已經(jīng)知道了哪些節(jié)點(diǎn)要顯示掰邢、每個(gè)節(jié)點(diǎn)的CSS屬性是什么牺陶，每個(gè)節(jié)點(diǎn)的位置在哪里，然后painting按照算出來(lái)的規(guī)則辣之，把內(nèi)容畫(huà)到了屏幕上掰伸。
5.JavaScript 定義了幾種數(shù)據(jù)類(lèi)型? 哪些是簡(jiǎn)單類(lèi)型?哪些是復(fù)雜類(lèi)型?
答：
- 字符串：是存儲(chǔ)字符的變量例如：abcd。
- 數(shù)值：整數(shù)和小數(shù)怀估。
- 布爾值：只有ture跟false兩個(gè)特定值狮鸭。
- null：表示空缺，此處應(yīng)有一個(gè)值但現(xiàn)在為空多搀。
- underfined：表示未定義不存在歧蕉，此處沒(méi)有任何值。
- 對(duì)象object：各種值組成的集合康铭。
簡(jiǎn)單類(lèi)型：字符串惯退、布爾值、數(shù)值从藤、null催跪、underfined。
復(fù)雜類(lèi)型：對(duì)象夷野。
6.NaN叠荠、undefined、null分別代表什么?
答：NaN：表示not a number扫责，表示非數(shù)字，它與任何數(shù)值都不相等逃呼，包括他自己鳖孤。
null：此處應(yīng)該有一個(gè)值，但是目前為空抡笼，會(huì)自動(dòng)轉(zhuǎn)化為“0”苏揣，如果一個(gè)變量將用來(lái)保存對(duì)象，那應(yīng)該保存為nall推姻。
underfined：如果一個(gè)變量給它聲明了但是沒(méi)有賦值平匈，那這個(gè)變量的值就是underfined，轉(zhuǎn)化為NaN
7.typeof和instanceof的作用和區(qū)別?
答：tapeof和instanceof的作用都是用來(lái)判斷一個(gè)變量是否為空藏古，或者是什么類(lèi)型增炭。他們的區(qū)別主要有：
- typeof是一個(gè)一元運(yùn)算，放在一個(gè)運(yùn)算數(shù)之前拧晕，運(yùn)算數(shù)可以是任何類(lèi)型隙姿。它的返回值是一個(gè)字符串，該字符串說(shuō)明運(yùn)算數(shù)的類(lèi)型typeof 一般只能返回如下幾個(gè)結(jié)果：number,boolean,string,function,object,undefined厂捞。typeof返回的值都是object输玷，而且具有局限性队丝。
- instanceof是一個(gè)二元運(yùn)算，用于判斷一個(gè)變量是否某個(gè)對(duì)象的實(shí)例欲鹏，返回值是一個(gè)布爾值机久。
代碼：
1
function isNumber(el){
// todo ...
}
function isString(el){
//todo ...
}
function isBoolean(el){
//todo ...
}
function isFunction(el){
//todo ...
}
var a = 2,
b = "jirengu",
c = false;
alert( isNumber(a) ); //true
alert( isString(a) ); //false
alert( isString(b) ); //true
alert( isBoolean(c) ); //true
alert( isFunction(a)); //false
alert( isFunction( isNumber ) ); //true
地址
2
console.log(1+1);//輸出：2
console.log("2" + "4");//輸出：24
console.log(2 + "4");//輸出：24
console.log(+new Date());//輸出：1471341539756
console.log(+"4");//輸出：4
3
var a = 1;
a+++a;//3
typeof a+2;//number2
4
5
var obj = {
name : 'hunger',
sex : 'male',
age : 28
}````
6
console.log(a);
var a = 1;
console.log(a);
console.log(b);
輸出什么 為什么？
提升變量必須聲明變量赔嚎，a聲明了所以輸出1膘盖，b沒(méi)有被聲明所以報(bào)錯(cuò)。
**本文版權(quán)歸本人和饑人谷所有尽狠，轉(zhuǎn)載請(qǐng)注明來(lái)源衔憨。**