css 選擇符有哪些

通配選擇符 *
類選擇符 class
id選擇符 id
屬性選擇符 input[name=button]
包含選擇符 類似 div span
子對象選擇符 類似 div > span

apply() 和 call()的區別? ==和===的區別? null和undefined的區別

apply和call參數不同 call可以傳多個參 apply只能傳二個參

雙等號只要值相等就為真

三等號 值和類型必須都相同才為真

null 指向了一個空的對象 可以看做一個空指針 不占用內存

undefined 當聲明一個未初始化的變量的時候 值為undefined 會占用內存 只不過值為undefined

js的事件模型有哪些

dom0事件模型? 原始事件模型

dom2事件模型? 分為三個階段? 目標階段、捕獲階段、冒泡階段?? ?

dom3事件模型? 只不過是在原來的事件上增加了一些事件類型

簡述異步編程模式

對于在瀏覽器中頻繁操作會阻礙瀏覽器的響應速度 通過異步編程的模式可以加快瀏覽器的響應速度 這種模式被稱為異步編程
（實現異步編程的有好多 譬如ajax、promise、deffer等都是采用異步編程來實現的）

for for in? for of之間的區別

其實三者的區別并不大 都是用來遍歷數組或者對象的? 只不過實現方式不同
for in 是以key -value的形式實現的
for of 是以iterator的形式實現的

深拷貝和淺拷貝的實現

//淺拷貝 function extendCopy(p){var c = {};for(var i in p){c[i] = p[i];}return c;} //深拷貝 function deepCopy(p,c){var c = c || {};for(var i in p){if(typeof p[i] === "object"){c[i] = (p[i].constructor == Array) ? [] : {};deepCopy(p[i],c[i]);}else{c[i] = p[i];}}return c;}

排序

//這里只使用冒泡排序作為例子 var arr = [2,1,4,7];for(var i = 0;i<arr.length;i++){for(var j = 0;j<arr.length-1-i;j++){var temp;if(arr[j]>arr[j+1]){temp = arr[j+1];arr[j+1] = arr[j];arr[j] = temp;}}}

數組去重

//這里只用一種方式來實現 還有好多方法大家自己去看吧 function duplicateArr(arr){var temp = [];for(var i = 0;i<arr.length;i++){if(arr.indexOf(arr[i]) == i){temp.push(arr[i]);}}return temp;}

html和html5的區別

1.文檔聲明不同

2.結構語義化不同

?

?document.write和innerHTML的區別

?
1.write是DOM方法,向文檔寫入HTML表達式或JavaScript代碼，可列出多個參數，參數被順序添加到文檔中 ；innerHTML是DOM屬性,設置或返回調用元素開始結束標簽之間的HTML元素。
2.兩者都可向頁面輸出內容,innerHTML比document.write更靈活。
當文檔加載時調用document.write直接向頁面輸出內容，文檔加載結束后調用document.write輸出內容會重寫整個頁面。通常按照兩種的方式使用 write() 方法：一是在使用該方在文檔中輸出 HTML，二是在調用該方法的的窗口之外的窗口、框架中產生新文檔（務必使用close關閉文檔）。
在讀模式下，innerHTML屬性返回與調用元素的所有子節點對應的HTML標記，在寫模式下，innerHTML會根據指定的值創建新的DOM樹替換調用元素原先的所有子節點。
3.兩者都可動態包含外部資源如JavaScript文件
通過document.write插入<script>元素會自動執行其中的腳本；
大多數瀏覽器中，通過innerHTML插入<script>元素并不會執行其中的腳本。

而且document.write 有個最大的缺點就是會阻塞瀏覽器的解析和渲染速度（因為docume.write 在全局是同步的并且瀏覽器是無法預加載的）

請試運行下面的例子就可以看到結果了：

?

<script>document.addEventListener("DOMContentLoaded", function(){alert("執行異步渲染、綁定事件等操作")})document.write("<script src=http://www.twitter.com><\/script>")</script>

?

?

?

?

var let const的區別:

1.var 可以掛載到window對象上 其它二個不會

var a = 100; console.log(a,window.a); // 100 100 let b = 10; console.log(b,window.b); // 10 undefined const c = 1; console.log(c,window.c); // 1 undefined

2.var 有變量提升的概念?? let 和const沒有

console.log(a); // undefined ===> a已聲明還沒賦值，默認得到undefined值var a = 100; console.log(b); // 報錯：b is not defined ===> 找不到b這個變量 let b = 10; console.log(c); // 報錯：c is not defined ===> 找不到c這個變量 const c = 10;

3.let 和const 會形成塊級作用域? 只能夠在if代碼塊中訪問到let聲明的變量

if(1){var a = 100;let b = 10; }console.log(a); // 100 console.log(b) // 報錯：b is not defined ===> 找不到b這個變量

4.同一作用域下let和const不能聲明同名變量，而var可以

var a = 100; console.log(a); // 100var a = 10; console.log(a); // 10 let a = 100; let a = 10;// 控制臺報錯：Identifier 'a' has already been declared ===> 標識符a已經被聲明了。

5.const

/* * 　　1、一旦聲明必須賦值,不能使用null占位。 * * 　　2、聲明后不能再修改 * * 　　3、如果聲明的是復合類型數據，可以修改其屬性 * * */const a = 100; const list = []; list[0] = 10; console.log(list);　　// [10] const obj = {a:100}; obj.name = 'apple'; obj.a = 10000; console.log(obj);　　// {a:10000,name:'apple'}

?6.var 會涉及到一個層級的查找? 如果函數內部 不帶var 關鍵字創建一個同名的變量的話 會層級查找 直到 windows對象上 才結束查找

var a = 100;function aa(){a = 10;console.log(a); //10 }aa();console.log(a);//10 var a = 100;function aa(){//如果帶var 關鍵字的話就是一個全局變量和一個局部變量var a = 10;console.log(a);// 10}aa();console.log(a); //100

?

js宏任務和微任務的概念

setTimeout(function(){console.log(4);})new Promise(function(resolve,reject){resolve();console.log(1);}).then(function(){console.log(2);})console.log(3); //具體的思路請看鏈接 點擊打開鏈接 // 1 3 2 4

?

簡述打開瀏覽器輸入地址到頁面展示的流程

1、當我們在瀏覽器的地址欄出輸入一個地址 瀏覽器開始向地址所在的服務器發送http請求 緊接著 對應的服務器會響應瀏覽器的請求

2、瀏覽器解析、下載、呈現

瀏覽器是從上到下解析html文檔的 先解析文檔的聲明? 如果頭部有js css等會先下載 加載這些文件 （js 圖片 css等都會向服務器發送請求 下載資源）

等到解析到body節點時? 會創建 dom節點樹 =》創建css rules=》將之前下載下來的css文件作用到dom節點樹上 形成dom渲染樹=》 然后在通知瀏覽器去繪制dom渲染樹 =》最后形成真實dom呈現給用戶。

以上過程會涉及到css 和 js的阻塞 阻塞是怎么產生的呢？

js 阻塞

當把js放到header里面的話 會先下載并執行js的操作? 但這樣一來會阻塞其他資源的下載 而后面dom的呈現也會受到影響

?css阻塞

CSS本來是可以并行下載的，在什么情況下會出現阻塞加載了(在測試觀察中，IE6下CSS都是阻塞加載）

?

當CSS后面跟著嵌入的JS的時候，該CSS就會出現阻塞后面資源下載的情況。而當把嵌入JS放到CSS前面，就不會出現阻塞的情況了。

根本原因：因為瀏覽器會維持html中css和js的順序，樣式表必須在嵌入的JS執行前先加載、解析完。而嵌入的JS會阻塞后面的資源加載，所以就會出現上面CSS阻塞下載的情況。

?

怎么加載js才不會對用戶的呈現出現問題 （有阻塞解決這個問題）

1、放在底部，雖然放在底部照樣會阻塞所有呈現，但不會阻塞資源下載。

2、如果嵌入JS放在head中，請把嵌入JS放在CSS頭部。

3、ie使用defer屬性? w3c 使用async

4、不要在嵌入的JS中調用運行時間較長的函數，如果一定要用，可以用`setTimeout`來調用

?

Javascript無阻塞加載具體方式 （無阻塞解決這個問題）

1、ie使用defer屬性? w3c 使用async （這二種需要高瀏覽器支持）

2、利用js動態創建script標簽 將它掛載到頭部

3、利用事件監聽 dom是否加載完畢 然后在下載js

<script>var script=document.createElement("script");script.type="text/javascript";script.src="file.js";document.getElementsByTagName("head")[0].appendChild(script); </script>

?

這里相當于給head下面插入了一個script的標簽。當script.src所對應的文件下載以后，再往后執行。

此技術的重點在于：無論何時啟動、下載和運行都不會阻塞頁面中其他部分的解析和呈現

數據的可變性和不可變性

所謂可變和不可變就是 直接改變數據和間接改變數據

直接改變數據對于復雜的特性不易于實現 譬如 追蹤數據的歷史記錄 整個對象樹都需要從新遍歷一次

而間接改變數據只要發現對象變成了一個新對象 我們就可以說這個對象發生改變了

簡述react

react是JavaScript的一種第三方框架庫 react最顯著的語法就是函數和jsx

jsx是JavaScript是一種表達式 可以作為變量賦值 也可以作為參數傳入 還可以作為函數返回

多個jsx組合成react元素 react元素組合形成組件 然后通過reactDOM渲染成dom結構

react元素與瀏覽器的dom元素不同? react元素是創建開銷極小的普通對象 reactDOM會負責更新dom于react元素保持一致

（很晚了后續在補充。。。）

轉載于:https://www.cnblogs.com/nianzhilian/p/10146911.html

總結

以上是生活随笔為你收集整理的js常见的面试题的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。