1.CSS和JS在網頁中的放置順序是怎樣的？
css一般使用 link 標簽將樣式表放在頂部的<head>標簽內，
js一般放在頁面底部(</body>標簽前)
2.解釋白屏和FOUC
- 如果把樣式放在底部,對于IE瀏覽器,在某些場景下(新窗口打開,刷新等)頁面會出現白屏,而不是內容逐步展現如果使用 @import標簽,即使 CSS 放入 link, 并且放在頭部,也可能出現白屏
- 如果把樣式放在底部,對于IE瀏覽器,在某些場景下(點擊鏈接,輸入URL,使用書簽進入等),會出現 FOUC 現象(逐步加載無樣式的內容,等CSS加載后頁面突然展現樣式).對于 Firefox 會一直表現出 FOUC .
- 如果將JS放在底部，腳本會阻塞后面內容的呈現也會阻塞其后組件的下載。對于圖片和CSS, 在加載時會并發加載(如一個域名下同時加載兩個文件). 但在加載 JavaScript 時,會禁用并發,并且阻止其他內容的下載. 所以把 JavaScript 放入頁面頂部也會導致 白屏現象。
3.async和defer的作用是什么？有什么區別
如果沒有 defer 或 async，瀏覽器會立即加載并執行指定的腳本，“立即”指的是在渲染該 script 標簽之下的文檔元素之前，也就是說不等待后續載入的文檔元素，讀到就加載并執行。而有了async或者defer后，加載和渲染后續文檔元素的過程將和 script.js異步執行。
區別：
- async，加載和渲染后續文檔元素的過程將和 script.js 的加載與執行并行進行(不保證順序)。
- 有 defer，加載后續文檔元素的過程將和 script.js 的加載并行進行（異步），但 script.js 的執行要在所有元素解析完成之后，DOMContentLoaded 事件觸發之前完成（腳本延遲到文檔解析和顯示后執行，有順序）。
4.簡述網頁的渲染機制
- 1.解析 HTML 標簽, 構建 DOM 樹
- 2.解析 CSS 標簽, 構建 CSSOM 樹
- 3.把 DOM 和 CSSOM 組合成 渲染樹 (render tree)
- 4.在渲染樹的基礎上進行布局, 計算每個節點的幾何結構
- 5.把每個節點繪制到屏幕上 (painting)
render-tree-construction.png
5.JavaScript 定義了幾種數據類型? 哪些是簡單類型?哪些是復雜類型?
JavaScript的數據類型，共有六種。
簡單類型：
- 數值（number）：整數和小數（比如1和3.14）
- 字符串（string）：字符組成的文本（比如"Hello World"）
- 布爾值（boolean）：true（真）和false（假）兩個特定值
- undefined：表示“未定義”或不存在，即此處目前沒有任何值
- null：表示空缺，即此處應該有一個值，但目前為空
復雜類型： - 對象（object）：各種值組成的集合
6.NaN、undefined、null分別代表什么?
- NaN:含義是Not a Number，表示非數字，NaN和任何值都不相等，包括自己
-undefined:該類型只有一個值，即特殊的undefined。在var聲明變量但未對其加以初始化時，這個變量的值就是undefined。
null:表示空缺，即此處應該有一個值，但目前為空。
7.typeof和instanceof的作用和區別?
typeof是一元運算符，返回值為字符串，該字符串用來說明運算數的數據類型
instanceof用于判斷一個變量是否某個對象的實例，返回true或者false。是二元運算。
代碼
function isNumber(el){
return typeof el =="number";
}
function isString(el){
return typeof el =="string";
}
function isBoolean(el){
return typeof el =="boolean";
}
function isFunction(el){
return typeof el =="function";
}
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());//1477584649062
console.log(+"4");//4
3.以下代碼的輸出結果是?
var a = 1;
a+++a;//3
typeof a+2;//number2
4.遍歷數組，把數組里的打印數組每一項的平方
var arr = [3,4,5];
for(var i=0;i<arr.length;i++){
y=arr[i]*arr[i];
console.log(y);
}
// 輸出 9, 16, 25
5.遍歷 JSON, 打印里面的值
var obj = {
name: 'hunger',
sex: 'male',
age: 28
}
for(prop in obj){
console.log(prop +":"+ obj[prop]);
}
//todo ...
// 輸出 name: hunger, sex: male, age:28
6.下面代碼的輸出是? 為什么 ?
console.log(a);//undefined
var a = 1;
console.log(a);//1
console.log(b);//報錯
原因var語句會被提到前面，所以a被聲明但是并沒有賦值。
b沒有被聲明所以報錯。
