前端面試（我的收藏總結）javascript篇（一）

前端面試（我的收藏總結）HTML篇

前端面試（我的收藏總結）CSS篇

前端面試（我的收藏總結）javascript篇（二）

JS中有多少種基本數據類型

undefined, null, boolean, string, number

Ps:ES6中新增symbol類型

參考：JavaScript的數據類型及其檢測

JS變量按照存儲方式區分爲那些類型，並描述其特色

• 值類型

• 引用類型

參考：低門檻完全理解JavaScript中的深拷貝和淺拷貝

JS中使用typeof能獲得哪些類型

undefind、string、number、boolean、function、object

特別說明的是對象、數組、null都是object（函數雖是引用類型，但能識別），由於typeof無法區分引用類型

Ps:能夠獲得ES6中新增的symbol類型

如何判斷一個變量是數組類型

能夠用instanceof關鍵字

舉個栗子：

var arr = []
arr instanceof Array //true
Array.isArray(arr) //true
複製代碼

什麼時候使用'==='什麼時候使用'=='

• 雙等會自動強制轉換，有風險。

• jQuery源碼中推薦使用三等，我我的也是這麼寫的。雙等可用於判斷布爾值

參考：完全終結 Javascript 背後的隱式類型轉換

寫一個繼承的例子

//構造函數方式
function Animal { this.name = 'pig' }
function Animal2 { Animal.call(this); this.age = 18 }
console.log(new Animal2())
//缺點：沒法繼承Animal的原型對象

//原型鏈方式
function Animal { this.name = 'pig' }
function Animal2 { this.age = 18 }
Animal2.prototype = new Animal();
console.log(new Animal2())
//缺點：其實是共享，修改原型對象裏的內容，其它繼承的類也會同步修改

//組合方式
function Animal { this.name = 'pig' }
function Animal2 { Animal.call(this); this.age = 18 }
Animal2.prototype = Animal.prototype;
console.log(new Animal2())
//缺點：因爲引用同一個原型對象，沒法區分對象是由誰實例化的

//最終方式
function Animal { this.name = 'pig' }
function Animal2 { Animal.call(this); this.age = 18 }
Animal2.prototype = Obiect.create(Animal.prototype);
Animal2.prototype.constructor = Animal2;
console.log(new Animal2())
//解釋：經過建立新的對象，再也不是同一個，再指定構造函數屬性爲本身
複製代碼

建立對象的幾種方式

• 字面量

• object對象

• 構造函數

• object create

描述new一個對象的過程

• 建立空對象，並繼承原型對象

• 執行構造函數，this指向這個空對象

• 若是返回值是object則返回新對象，不然返回object

你對變量提高的理解

在執行代碼時，變量和函數的聲明會被提高到做用域的頂部（此時變量的值爲undefined）

若是是全局，會被提高到腳本的最前面

若是是函數內，會被提高到函數內最前面，this也是

PS:注意函數表達式（匿名函數）的狀況

PS2:注意ES6中let的狀況，不會變量提高

說明this幾種不一樣的使用場景

• 做爲構造函數執行

• 做爲對象屬性執行

• 做爲普通函數執行

• call apply bind

建立10個a標籤，點擊彈出對應序號

for(var i=0;i<10;i++){
  (function(i){
  	var a = document.createElement('a');
    a.innerHtml=i+'<br>';
    a.onclick=function(e){
  		e.preventDefault();
      	alert(i)
	}
    document.body.appendChild(a)
  })(i)
}
複製代碼

如何理解做用域

只有函數做用域和全局做用域，ES6中新增塊級做用域那是後話

函數外聲明的變量爲全局做用域，函數內可使用

函數內聲明的變量爲函數做用域，函數外不可使用

做用域鏈：一個自由變量一直往上尋找（定義時的）父級做用域內的變量的過程。

自由變量：當前做用域沒有定義的變量

ps：花括號內使用let聲明變量爲塊級做用域，只能內部使用，減小全局污染

瞭解閉包嗎？

閉包：用一個函數去訪問另外一個函數內的內部變量的方式的特殊函數

使用場景：柯里化函數

參考：mp.weixin.qq.com/s/G9HIJWH-5…

同步和異步的區別？

同步會阻塞代碼執行，異步不會

前端使用異步的場景？

• 定時任務：setTimeout setInverval

• 網絡請求：ajax請求，動態加載

• 事件綁定

JS運行機制簡單說明

• 單線程：JS引擎、事件觸發器、定時觸發器都是單線程的。
• 任務隊列：JS分爲同步任務和異步任務，一旦執行棧中的全部同步任務執行完畢（此時JS引擎空閒），系統就會讀取任務隊列，將可運行的異步任務添加到可執行棧中，開始執行。
• event loop（事件循環機）制：執行棧中的代碼調用某些api時，會在事件隊列中添加各類事件，當棧中的代碼執行完畢後，會讀取事件隊列中的事件並執行回調的循環過程。

參考：www.dailichun.com/2018/01/21/…

進程和線程

• 進程：正在運行的應用程序，是應用程序的一個運行環境，是cpu資源分配的最小單位
• 線程：創建在進程的基礎上，用於執行操做（如執行代碼），是cpu調度的最小單位，一個進程能夠有多個線程

獲取隨機數，要求是長度一致的字符串格式

var random = Math.random();
var random = random+'00000000';
var random = random.slice(0,10);
複製代碼

寫一個能遍歷對象和數組的通用forEach函數

function foreach(obj,fn){
  var key;
  if(obj instanceof Array){
  	obj.forEach(function(item,index){
  		fn(index,item)
	})
  }else{
  	for(key in obj){
  		fn(key,obj[key])
	}
  }
}
複製代碼

JavaScript 中如何獲取當前的時間戳

• Date.now()

• new Date().getTime()

• +new Date()