前言
360的面試和網(wǎng)易一樣，是一天之內(nèi)完成三輪面試，不同的是，他們是視頻面試，用的牛客網(wǎng)的系統(tǒng)。
一面
1.談?wù)勴?xiàng)目
我感覺等會(huì)肯定會(huì)問Angular的問題...
2.你說設(shè)計(jì)模式，那你的項(xiàng)目里用到了哪些設(shè)計(jì)模式?
1.依賴注入模式（服務(wù)）
2.觀察者模式（rxjs）
3.單例模式（模塊）
4.模板方法模式（鉤子）
5.裝飾者模式（組件）
6.發(fā)布訂閱模式(事件)
3.項(xiàng)目里的架構(gòu)是什么樣的
組件化、模塊化、抽象、封裝、隔離類職責(zé)、OOP的其他原則
4.NG的雙向數(shù)據(jù)綁定是怎么樣的
5.談?wù)劽嫦驅(qū)ο蠛屠^承，object.create的實(shí)現(xiàn)原理
Object.create = function(o) {
function F(){}
F.prototype = o;
return new F();
};
6.面向切面編程和函數(shù)式編程聽說過嗎
前面沒聽過，后面了解過：
函數(shù)式編程引入了純函數(shù)的概念來幫助編程，純函數(shù)對(duì)于相同的輸入，永遠(yuǎn)會(huì)得到相同的輸出，而且沒有任何可觀察的副作用，也不依賴外部環(huán)境的狀態(tài)。它是一種編程范式。RXJS用到了它。
7.談?wù)効缬?，postmessage的應(yīng)用場景是什么樣的？
詳情見JS與跨域
8.對(duì)象深拷貝怎么實(shí)現(xiàn)
新開辟一塊內(nèi)存空間，把源對(duì)象的屬性和方法逐個(gè)拷貝進(jìn)來。
function deepClone (obj) {
let temp = Array.isArray(obj) ? [] : {}
for (let key in obj) {
//是否有嵌套對(duì)象
temp[key] = typeof obj[key] === 'object' ? deepClone(obj[key]) : obj[key]
}
return temp
}
9.談?wù)勀闶褂眠^的構(gòu)建工具，說說對(duì)webpack的理解
gulp、webpack。打包工具，把所有文件看做是資源，然后根據(jù)它們的依賴關(guān)系打包成一個(gè)最終文件。
10.你后端為什么使用node
想前后端同構(gòu)，現(xiàn)查現(xiàn)用
二面
談?wù)勀銓?duì)ts的理解，項(xiàng)目中對(duì)ts用到什么程度？js和ts有什么本質(zhì)的區(qū)別。
ts是js的超集，es的所有特性它都支持，包括還在草案的await/async和裝飾器等，另外就是加入了C#的一些語法，可以使用它進(jìn)行傳統(tǒng)的OOP編程，對(duì)工程化和多人項(xiàng)目協(xié)助非常友好。我只用到了和es有關(guān)的部分。js是JIT的解釋語言，ts支持AOT編譯語言。
既然用過angular，zone.js了解多少，干嘛用的？
ng的裝飾器模式理解多少？知道ng怎么把字符串轉(zhuǎn)換成模板引擎的嗎？
裝飾器可以將各個(gè)類解耦，可以方便的擴(kuò)充一個(gè)類的功能。
通過注解的方式解析模板，具體是由@angular/compiler 庫和html-parser庫完成的。但未來會(huì)采用AOT的方式直接編譯成用來生成和維護(hù)DOM結(jié)構(gòu)的JavaScript代碼。所以實(shí)際上并不會(huì)把字符串解析成HTML模板。
面向?qū)ο蟮母拍钍鞘裁?？解釋一下封裝、多態(tài)、繼承 的意義
封裝多態(tài)繼承抽象。
封裝：封裝是通過限制只有特定類的對(duì)象可以訪問這一特定類的成員，而它們通常利用接口實(shí)現(xiàn)消息的傳入傳出。
多態(tài)：多態(tài)是指由繼承而產(chǎn)生的相關(guān)的不同的類，其對(duì)象對(duì)同一消息會(huì)做出不同的響應(yīng)。
繼承：指在某種情況下，一個(gè)類會(huì)有子類，子類比原本的類（父類）要更加具體化。
多重繼承怎么實(shí)現(xiàn)，多重繼承里可能會(huì)出現(xiàn)什么數(shù)據(jù)結(jié)構(gòu)？從而導(dǎo)致什么問題？
JS本身是不提供多重繼承，可以模擬多重繼承，但是它會(huì)大大增加代碼的復(fù)雜度和維護(hù)難度。
圖，查找時(shí)出現(xiàn)循環(huán)，改成委托行為(數(shù)據(jù)結(jié)構(gòu)變成鏈表)。
圖靈完備理論知道嗎？關(guān)于圖靈的其他知識(shí)知道嗎？
如果一系列操作數(shù)據(jù)的規(guī)則（如指令集、編程語言、細(xì)胞自動(dòng)機(jī)）可以用來模擬單帶圖靈機(jī)，那么它是圖靈完備的。圖靈機(jī)由以下幾個(gè)部分組成：
一條無限長的紙帶TAPE。
一個(gè)讀寫頭HEAD。
一套控制規(guī)則TABLE。
一個(gè)狀態(tài)寄存器。
如何在一個(gè)dom節(jié)點(diǎn)前面插入節(jié)點(diǎn)？
insertBefore,
如果是后面的話就先找到該元素的父元素，然后判斷該元素是否是最后一個(gè)元素，如果是最后一個(gè)元素就直接在父元素上appendChild。
如果不是最后一個(gè)元素，就找到該元素的下一個(gè)元素，然后在它的下一個(gè)元素之前用insertBefore插入。
樹的遍歷方法有哪些？
前序、中序、后序
遞歸和迭代的區(qū)別是什么，各有什么優(yōu)缺點(diǎn)?尾調(diào)用知道嗎？
遞歸是函數(shù)調(diào)用自己，迭代是循環(huán)調(diào)用別的函數(shù)
尾調(diào)用就是在return的地方執(zhí)行遞歸
函數(shù)式編程和面向?qū)ο缶幊虥_突嗎？為什么？
不沖突，比如TS和rxjs在NG項(xiàng)目并存，并且js也是一門靈活的語言
講講你對(duì)DI（依賴注入）的理解？
它是一種設(shè)計(jì)模式，可以讓類從外部源中獲得它的依賴，而不必親自創(chuàng)建它們。最大的好處是讓使用者和被使用者解耦，從而反轉(zhuǎn)依賴。
策略模式和單例模式說一下理解？
策略模式指對(duì)象有某個(gè)行為，但是在不同的場景中，該行為有不同的實(shí)現(xiàn)算法。
單例模式中單例對(duì)象的類必須保證只有一個(gè)實(shí)例存在。
Reflow和Repaint的區(qū)別？如何避免重繪？
Reflow定義：元素要先計(jì)算才渲染。
增刪改DOM、移動(dòng)DOM位置、修改一些CSS樣式、Resize窗口、修改默認(rèn)字體等會(huì)觸發(fā)。
Repaint定義：元素的屬性已經(jīng)確認(rèn)下來不需要計(jì)算，只需要繪制。
樣式、DOM有變動(dòng)都會(huì)觸發(fā)，盡量少觸發(fā)：比如使用DocumentFragment操作DOM。參考資料
Shadow DOM聽說過沒有？
Shadow DOM為Web組件中的DOM和CSS提供了封裝。將他們隔離開來，以免其中的操作影響到別的DOM和樣式。參考資料
NG提供了三種方法應(yīng)用影子DOM：Native（不進(jìn)不出）、Emulated（只進(jìn)不出）、None（可出可進(jìn)）
講講跨域的方法？
詳情見JS與跨域
setTimeout和requestAnimationFrame的區(qū)別？
setTimeout由于不準(zhǔn)確會(huì)出現(xiàn)掉幀丟幀的情況，requestAnimationFrame是幀刷新驅(qū)動(dòng)的。
參考回答
談?wù)勈录Ｐ停?/p>
講講安全方面的攻擊手段？xss和csrf有什么區(qū)別？
xss、csrf、sql注入、ddos、文件上傳漏洞、內(nèi)存緩沖區(qū)溢出、弱口令、社工等等
xss重點(diǎn)在跨站腳本攻擊，混淆數(shù)據(jù)和代碼從而達(dá)到目的，所以常常用來散布蠕蟲
csrf重點(diǎn)在跨域請(qǐng)求偽造，一般利用的是web中用戶身份驗(yàn)證的一個(gè)漏洞：簡單的身份驗(yàn)證只能保證請(qǐng)求發(fā)自某個(gè)用戶的瀏覽器，卻不能保證請(qǐng)求本身是用戶自愿發(fā)出的。所以常常用來刷接口
匯編的指令還記得多少？
mov、jmp、mul、add、ret、loop等等...
矩陣轉(zhuǎn)置和矩陣相乘還記得嗎？
轉(zhuǎn)置是把矩陣的行變成列，列變成行
相乘是把一個(gè)mxn和nxp的矩陣轉(zhuǎn)成mxp的矩陣
矩陣相乘公式.png
談?wù)勈录h(huán)？
閉包是什么？內(nèi)存泄露怎么觀察？
閉包是JS特有的一種作用域機(jī)制，它可以讓一個(gè)函數(shù)作用域有權(quán)力訪問作用域鏈上的變量。
通過chrome的開發(fā)者工具的memory欄可以觀察。
如何使用css實(shí)現(xiàn)硬件加速？
因?yàn)镃SS animations, transforms 以及 transitions 不會(huì)自動(dòng)開啟GPU加速，而是由瀏覽器的緩慢的軟件渲染引擎來執(zhí)行，所以可以使用transform: translateZ(0)來開啟硬件加速。transform: translate3d(0, 0, 0)也可以。
webgl了解過沒有？
當(dāng)時(shí)直接說沒有。
webgl學(xué)習(xí)資料
三面
hr那邊比較嘈雜，有些地方要費(fèi)勁才能聽清...
你現(xiàn)在在哪？為什么不找份實(shí)習(xí)？
為什么會(huì)報(bào)考云南大學(xué)?
對(duì)前端和安全關(guān)系的理解？
為什么做前端?
家人反對(duì)你來北京嗎?
有沒有投其他公司？
如果360不發(fā)offer給你，你會(huì)選哪家公司？
有的公司的安全團(tuán)隊(duì)是為自己公司的安全服務(wù)的，有的公司的安全團(tuán)隊(duì)是為外面的各大企業(yè)安全服務(wù)的，對(duì)此你怎么看？
