本文由我收集總結(jié)了一些前端面試題栗菜，初學(xué)者閱后也要用心鉆研其中的原理欠雌，重要知識需要系統(tǒng)學(xué)習(xí)、透徹學(xué)習(xí)疙筹，形成自己的知識鏈富俄。萬不可投機(jī)取巧，臨時(shí)抱佛腳只求面試僥幸混過關(guān)是錯(cuò)誤的而咆！也是不可能的霍比！不可能的！不可能的暴备！

前端還是一個(gè)年輕的行業(yè)悠瞬，新的行業(yè)標(biāo)準(zhǔn)， 框架， 庫都不斷在更新和新增浅妆，正如赫門在2015深JS大會(huì)上的《前端服務(wù)化之路》主題演講中說的一句話：“每18至24個(gè)月望迎，前端都會(huì)難一倍”，這些變化使前端的能力更加豐富凌外、創(chuàng)造的應(yīng)用也會(huì)更加完美辩尊。所以關(guān)注各種前端技術(shù)，跟上快速變化的節(jié)奏趴乡，也是身為一個(gè)前端程序員必備的技能之一对省。

面試有幾點(diǎn)需注意：

1. 面試題目： 根據(jù)你的等級和職位的變化，入門級到專家級晾捏，廣度和深度都會(huì)有所增加。
2. 題目類型： 理論知識哀托、算法惦辛、項(xiàng)目細(xì)節(jié)、技術(shù)視野仓手、開放性題胖齐、工作案例。
3. 細(xì)節(jié)追問： 可以確保問到你開始不懂或面試官開始不懂為止嗽冒，這樣可以大大延展題目的區(qū)分度和深度呀伙，知道你的實(shí)際能力。因?yàn)檫@種知識關(guān)聯(lián)是長時(shí)期的學(xué)習(xí)添坊，臨時(shí)抱佛腳絕對是記不住的剿另。
4. 回答問題再棒，面試官（可能是你面試職位的直接領(lǐng)導(dǎo)）贬蛙，會(huì)考慮我要不要這個(gè)人做我的同事雨女？所以態(tài)度很重要、除了能做事阳准，還要會(huì)做人氛堕。（感覺更像是相親( ????????????????? )）
5. 資深的前端開發(fā)能把a(bǔ)bsolute和relative弄混，這樣的人不要也罷野蝇，因?yàn)閳F(tuán)隊(duì)需要的是：你這個(gè)人具有可以依靠的才能（靠譜）讼稚。

前端開發(fā)所需掌握知識點(diǎn)概要：

HTML&CSS：
對Web標(biāo)準(zhǔn)的理解（結(jié)構(gòu)、表現(xiàn)绕沈、行為）锐想、瀏覽器內(nèi)核、渲染原理七冲、依賴管理痛倚、兼容性、CSS語法澜躺、層次關(guān)系蝉稳，常用屬性抒蚜、布局、選擇器耘戚、權(quán)重嗡髓、盒模型、Hack收津、CSS預(yù)處理器饿这、
CSS3、Flexbox撞秋、CSS Modules长捧、Document flow、BFC吻贿、HTML5（離線 & 存儲(chǔ)串结、Histoy,多媒體、WebGLSVGCanvas）舅列；
JavaScript：
數(shù)據(jù)類型肌割、運(yùn)算、對象帐要、Function把敞、繼承、閉包榨惠、作用域奋早、事件、Prototype冒冬、RegExp伸蚯、JSON、Ajax简烤、DOM剂邮、BOM、
內(nèi)存泄漏横侦、跨域挥萌、異步請求、模板引擎枉侧、模塊化引瀑、Flux、同構(gòu)榨馁、算法憨栽、ECMAScript6、Nodejs、HTTP屑柔、
其他：
主流MVVM框架(ReactVueAngular)屡萤、Hybrid AppReact NativeWeex、TypeScript掸宛、RESTFul死陆、WEB安全、前端工程化唧瘾、依賴管理措译、性能優(yōu)化、
重構(gòu)饰序、團(tuán)隊(duì)協(xié)作领虹、可維護(hù)、易用性菌羽、SEO掠械、UED、前端技術(shù)選型注祖、快速學(xué)習(xí)能力等；

作為一名前端工程師均唉，無論工作年頭長短都應(yīng)該掌握的知識點(diǎn)：

HTML

• Doctype作用是晨？嚴(yán)格模式與混雜模式如何區(qū)分？它們有何意義?
• HTML5 為什么只需要寫 舔箭？
• 行內(nèi)元素有哪些罩缴？塊級元素有哪些？ 空(void)元素有那些层扶？
• 頁面導(dǎo)入樣式時(shí)箫章，使用link和@import有什么區(qū)別？
• 介紹一下你對瀏覽器內(nèi)核的理解镜会？
• 常見的瀏覽器內(nèi)核有哪些檬寂？
• html5有哪些新特性、移除了那些元素戳表？如何處理HTML5新標(biāo)簽的瀏覽器兼容問題桶至？如何區(qū)分 HTML 和 HTML5？
• 簡述一下你對HTML語義化的理解匾旭？
• HTML5的離線儲(chǔ)存怎么使用镣屹，工作原理能不能解釋一下？
• 瀏覽器是怎么對HTML5的離線儲(chǔ)存資源進(jìn)行管理和加載的呢价涝？
• 請描述一下 cookies女蜈，sessionStorage 和 localStorage 的區(qū)別？
• iframe有那些缺點(diǎn)？
• Label的作用是什么伪窖？是怎么用的逸寓？（加 for 或 包裹）
• HTML5的form如何關(guān)閉自動(dòng)完成功能？
• 如何實(shí)現(xiàn)瀏覽器內(nèi)多個(gè)標(biāo)簽頁之間的通信? (阿里)
• webSocket如何兼容低瀏覽器惰许？(阿里)
• 頁面可見性（Page Visibility API） 可以有哪些用途席覆？
• 如何在頁面上實(shí)現(xiàn)一個(gè)圓形的可點(diǎn)擊區(qū)域？
• 實(shí)現(xiàn)不使用 border 畫出1px高的線汹买，在不同瀏覽器的Quirksmode和CSSCompat模式下都能保持同一效果佩伤。
• 網(wǎng)頁驗(yàn)證碼是干嘛的，是為了解決什么安全問題晦毙？
• title與h1的區(qū)別生巡、b與strong的區(qū)別、i與em的區(qū)別见妒？

CSS

• 介紹一下標(biāo)準(zhǔn)的CSS的盒子模型孤荣？低版本IE的盒子模型有什么不同的？
• CSS選擇符有哪些须揣？哪些屬性可以繼承盐股？
• CSS優(yōu)先級算法如何計(jì)算？
• CSS3新增偽類有那些耻卡？
• 如何居中div疯汁？如何居中一個(gè)浮動(dòng)元素？如何讓絕對定位的div居中卵酪？
• display有哪些值幌蚊？說明他們的作用。
• position的值relative和absolute定位原點(diǎn)是溃卡？
• CSS3有哪些新特性溢豆？
• 請解釋一下CSS3的Flexbox（彈性盒布局模型）,以及適用場景？
• 用純CSS創(chuàng)建一個(gè)三角形的原理是什么瘸羡？
• css多列等高如何實(shí)現(xiàn)漩仙？
• 一個(gè)滿屏 品 字布局 如何設(shè)計(jì)?
• 經(jīng)常遇到的瀏覽器的兼容性有哪些？原因最铁，解決方法是什么讯赏，常用hack的技巧 ？
• li與li之間有看不見的空白間隔是什么原因引起的冷尉？有什么解決辦法漱挎？
• 為什么要初始化CSS樣式?
• absolute的containing block計(jì)算方式跟正常流有什么不同？
• CSS里的visibility屬性有個(gè)collapse屬性值是干嘛用的雀哨？在不同瀏覽器下以后什么區(qū)別磕谅？
• position跟display私爷、margin collapse、overflow膊夹、float這些特性相互疊加后會(huì)怎么樣衬浑？
• 對BFC規(guī)范(塊級格式化上下文：block formatting context)的理解？
• CSS權(quán)重優(yōu)先級是如何計(jì)算的放刨？
• 請解釋一下為什么需要清除浮動(dòng)工秩？清除浮動(dòng)的方式
• zoom:1的清楚浮動(dòng)原理?
• 移動(dòng)端的布局用過媒體查詢嗎？
• 使用 CSS 預(yù)處理器嗎进统？喜歡那個(gè)助币？
• CSS優(yōu)化、提高性能的方法有哪些螟碎？
• 瀏覽器是怎樣解析CSS選擇器的眉菱？
• 在網(wǎng)頁中的應(yīng)該使用奇數(shù)還是偶數(shù)的字體？為什么呢掉分？
• margin和padding分別適合什么場景使用俭缓？
• 抽離樣式模塊怎么寫，說出思路酥郭，有無實(shí)踐經(jīng)驗(yàn)华坦？[阿里航旅的面試題]
• 元素豎向的百分比設(shè)定是相對于容器的高度嗎？
• 全屏滾動(dòng)的原理是什么不从？用到了CSS的那些屬性季春？
• 什么是響應(yīng)式設(shè)計(jì)？響應(yīng)式設(shè)計(jì)的基本原理是什么消返？如何兼容低版本的IE？
• 視差滾動(dòng)效果耘拇，如何給每頁做不同的動(dòng)畫撵颊？（回到頂部，向下滑動(dòng)要再次出現(xiàn)惫叛，和只出現(xiàn)一次分別怎么做倡勇？）
• ::before 和 :after中雙冒號和單冒號 有什么區(qū)別？解釋一下這2個(gè)偽元素的作用嘉涌。
• 如何修改chrome記住密碼后自動(dòng)填充表單的黃色背景 妻熊？
• 你對line-height是如何理解的？
• 設(shè)置元素浮動(dòng)后仑最，該元素的display值是多少扔役？（自動(dòng)變成display:block）
• 怎么讓Chrome支持小于12px 的文字？
• 讓頁面里的字體變清晰警医，變細(xì)用CSS怎么做亿胸？（-webkit-font-smoothing: antialiased;）
• font-style屬性可以讓它賦值為“oblique” oblique是什么意思坯钦？
• position:fixed;在android下無效怎么處理？
• 如果需要手動(dòng)寫動(dòng)畫侈玄，你認(rèn)為最小時(shí)間間隔是多久婉刀，為什么？（阿里）
• display:inline-block 什么時(shí)候會(huì)顯示間隙序仙？(攜程)
• overflow: scroll時(shí)不能平滑滾動(dòng)的問題怎么處理突颊？
• 有一個(gè)高度自適應(yīng)的div，里面有兩個(gè)div潘悼，一個(gè)高度100px律秃，希望另一個(gè)填滿剩下的高度。
• png挥等、jpg友绝、gif 這些圖片格式解釋一下，分別什么時(shí)候用肝劲。有沒有了解過webp迁客？
• 什么是Cookie 隔離？（或者說：請求資源的時(shí)候不要讓它帶cookie怎么做）
• style標(biāo)簽寫在body后與body前有什么區(qū)別辞槐？
• 什么是CSS 預(yù)處理器 / 后處理器掷漱？?
• rem布局的優(yōu)缺點(diǎn)

JavaScript

• 介紹JavaScript的基本數(shù)據(jù)類型。
• 說說寫JavaScript的基本規(guī)范榄檬？
• JavaScript原型卜范，原型鏈 ? 有什么特點(diǎn)？
• JavaScript有幾種類型的值鹿榜？（堆：原始數(shù)據(jù)類型和 棧：引用數(shù)據(jù)類型）海雪，你能畫一下他們的內(nèi)存圖嗎？
• Javascript如何實(shí)現(xiàn)繼承舱殿？
• Javascript創(chuàng)建對象的幾種方式奥裸？
• Javascript作用鏈域?
• 談?wù)則his對象的理解。
• eval是做什么的沪袭？
• 什么是window對象? 什么是document對象?
• null湾宙，undefined的區(qū)別？
• 寫一個(gè)通用的事件偵聽器函數(shù)(機(jī)試題)冈绊。
• ["1", "2", "3"].map(parseInt) 答案是多少侠鳄？
• 關(guān)于事件，IE與火狐的事件機(jī)制有什么區(qū)別死宣？ 如何阻止冒泡伟恶？
• 什么是閉包（closure），為什么要用它十电？
• javascript 代碼中的"use strict";是什么意思 ? 使用它區(qū)別是什么知押？
• 如何判斷一個(gè)對象是否屬于某個(gè)類叹螟？
• new操作符具體干了什么呢?
• 用原生JavaScript的實(shí)現(xiàn)過什么功能嗎？
• Javascript中台盯，有一個(gè)函數(shù)罢绽，執(zhí)行時(shí)對象查找時(shí)，永遠(yuǎn)不會(huì)去查找原型静盅，這個(gè)函數(shù)是良价？
• 對JSON的了解？
• [].forEach.call($$(""),function(a){ a.style.outline="1px solid #"+(~~(Math.random()(1<<24))).toString(16) })能解釋一下這段代碼的意思嗎蒿叠？
• js延遲加載的方式有哪些明垢？
• Ajax 是什么? 如何創(chuàng)建一個(gè)Ajax？
• 同步和異步的區(qū)別?
• 如何解決跨域問題?
• 頁面編碼和被請求的資源編碼如果不一致如何處理市咽？
• 服務(wù)器代理轉(zhuǎn)發(fā)時(shí)痊银，該如何處理cookie？
• 模塊化開發(fā)怎么做施绎？
• AMD（Modules/Asynchronous-Definition）溯革、CMD（Common Module Definition）規(guī)范區(qū)別？
• requireJS的核心原理是什么谷醉？（如何動(dòng)態(tài)加載的致稀？如何避免多次加載的？如何 緩存的俱尼？）
• JS模塊加載器的輪子怎么造抖单，也就是如何實(shí)現(xiàn)一個(gè)模塊加載器？
• 談一談你對ECMAScript6的了解遇八？
• ECMAScript6 怎么寫class矛绘，為什么會(huì)出現(xiàn)class這種東西?
• 異步加載的方式有哪些？
• documen.write和 innerHTML的區(qū)別?
• DOM操作——怎樣添加刃永、移除蔑歌、移動(dòng)、復(fù)制揽碘、創(chuàng)建和查找節(jié)點(diǎn)?
• .call() 和 .apply() 的作用和區(qū)別？
• 數(shù)組和對象有哪些原生方法园匹，列舉一下雳刺？
• JS 怎么實(shí)現(xiàn)一個(gè)類。怎么實(shí)例化這個(gè)類
• JavaScript中的作用域與變量聲明提升裸违？
• 如何編寫高性能的Javascript掖桦？
• 那些操作會(huì)造成內(nèi)存泄漏？
• JQuery的源碼看過嗎供汛？能不能簡單概況一下它的實(shí)現(xiàn)原理枪汪？
• jQuery.fn的init方法返回的this指的是什么對象涌穆？為什么要返回this？
• jquery中如何將數(shù)組轉(zhuǎn)化為json字符串雀久，然后再轉(zhuǎn)化回來宿稀？
• jQuery 的屬性拷貝(extend)的實(shí)現(xiàn)原理是什么，如何實(shí)現(xiàn)深拷貝赖捌？
• jquery.extend 與 jquery.fn.extend的區(qū)別祝沸？
• jQuery 的隊(duì)列是如何實(shí)現(xiàn)的？隊(duì)列可以用在哪些地方越庇？
• 談一下Jquery中的bind(),live(),delegate(),on()的區(qū)別罩锐？
• JQuery一個(gè)對象可以同時(shí)綁定多個(gè)事件，這是如何實(shí)現(xiàn)的卤唉？
• 是否知道自定義事件涩惑。jQuery里的fire函數(shù)是什么意思，什么時(shí)候用桑驱？
• jQuery 是通過哪個(gè)方法和 Sizzle 選擇器結(jié)合的竭恬？（jQuery.fn.find()進(jìn)入Sizzle）
• 針對 jQuery性能的優(yōu)化方法？
• Jquery與jQuery UI有啥區(qū)別碰纬？
• JQuery的源碼看過嗎萍聊？能不能簡單說一下它的實(shí)現(xiàn)原理？
• jquery 中如何將數(shù)組轉(zhuǎn)化為json字符串悦析，然后再轉(zhuǎn)化回來寿桨？
• jQuery和Zepto的區(qū)別？各自的使用場景强戴？
• 針對 jQuery 的優(yōu)化方法亭螟？
• Zepto的點(diǎn)透問題如何解決？
• jQueryUI如何自定義組件?
• 需求：實(shí)現(xiàn)一個(gè)頁面操作不會(huì)整頁刷新的網(wǎng)站骑歹，并且能在瀏覽器前進(jìn)预烙、后退時(shí)正確響應(yīng)。給出你的技術(shù)實(shí)現(xiàn)方案道媚？
• 如何判斷當(dāng)前腳本運(yùn)行在瀏覽器還是node環(huán)境中扁掸？（阿里）
• 移動(dòng)端最小觸控區(qū)域是多大？
• jQuery 的 slideUp動(dòng)畫 最域，如果目標(biāo)元素是被外部事件驅(qū)動(dòng), 當(dāng)鼠標(biāo)快速地連續(xù)觸發(fā)外部元素事件, 動(dòng)畫會(huì)滯后的反復(fù)執(zhí)行谴分，該如何處理呢?
• 把 Script 標(biāo)簽 放在頁面的最底部的body封閉之前 和封閉之后有什么區(qū)別？瀏覽器會(huì)如何解析它們镀脂？
• 移動(dòng)端的點(diǎn)擊事件的有延遲牺蹄，時(shí)間是多久，為什么會(huì)有薄翅？ 怎么解決這個(gè)延時(shí)沙兰？（click 有 300ms 延遲,為了實(shí)現(xiàn)safari的雙擊事件的設(shè)計(jì)氓奈，瀏覽器要知道你是不是要雙擊操作。）
• 知道各種JS框架(Angular, Backbone, Ember, React, Meteor, Knockout...)么? 能講出他們各自的優(yōu)點(diǎn)和缺點(diǎn)么?
• Underscore 對哪些 JS 原生對象進(jìn)行了擴(kuò)展以及提供了哪些好用的函數(shù)方法鼎天？
• 解釋JavaScript中的作用域與變量聲明提升舀奶？
• 那些操作會(huì)造成內(nèi)存泄漏？
• JQuery一個(gè)對象可以同時(shí)綁定多個(gè)事件训措，這是如何實(shí)現(xiàn)的伪节？
• Node.js的適用場景？
• (如果會(huì)用node)知道route, middleware, cluster, nodemon, pm2, server-side rendering么?
• 解釋一下 Backbone 的 MVC 實(shí)現(xiàn)方式绩鸣？
• 什么是“前端路由”?什么時(shí)候適合使用“前端路由”? “前端路由”有哪些優(yōu)點(diǎn)和缺點(diǎn)?
• 知道什么是webkit么? 知道怎么用瀏覽器的各種工具來調(diào)試和debug代碼么?
• 如何測試前端代碼么? 知道BDD, TDD, Unit Test么? 知道怎么測試你的前端工程么(mocha, sinon, jasmin, qUnit..)?
• 前端templating(Mustache, underscore, handlebars)是干嘛的, 怎么用?
• 簡述一下 Handlebars 的基本用法怀大？
• 簡述一下 Handlerbars 的對模板的基本處理流程， 如何編譯的呀闻？如何緩存的化借？
• 用js實(shí)現(xiàn)千位分隔符?(來源：前端農(nóng)民工，提示：正則+replace)
• 檢測瀏覽器版本版本有哪些方式捡多？
• What is a Polyfill?
• 做的項(xiàng)目中蓖康，有沒有用過或自己實(shí)現(xiàn)一些 polyfill 方案（兼容性處理方案）？
• 我們給一個(gè)dom同時(shí)綁定兩個(gè)點(diǎn)擊事件垒手，一個(gè)用捕獲蒜焊，一個(gè)用冒泡。會(huì)執(zhí)行幾次事件科贬，會(huì)先執(zhí)行冒泡還是捕獲泳梆？
• 使用JS實(shí)現(xiàn)獲取文件擴(kuò)展名？
• Webpack熱更新實(shí)現(xiàn)原理?
• 請介紹一下JS之事件節(jié)流榜掌？
• 什么是JS的函數(shù)防抖优妙？

ECMAScript6 相關(guān)

• Object.is() 與原來的比較操作符“ ===”、“ ==”的區(qū)別憎账？
• ES6是如何實(shí)現(xiàn)編譯成ES5的套硼？
• css-loader的原理？

前端框架

• React 使用場景胞皱？
• 描述一下React 生命周期
• 實(shí)現(xiàn)組件有哪些方式邪意？
• 應(yīng)該在React生命周期的什么階段發(fā)出ajax請求，為什么反砌？
• shouldComponentUpdate函數(shù)有什么作用抄罕？
• 當(dāng)組件的setState函數(shù)被調(diào)用之后，發(fā)生了什么于颖？
• 為什么循環(huán)產(chǎn)生的組件中要利用上key這個(gè)特殊的prop？
• React-router 路由的實(shí)現(xiàn)原理嚷兔？
• 說說React Native,Weex框架的實(shí)現(xiàn)原理森渐？
• 受控組件(Controlled Component)與非受控組件(Uncontrolled Component)的區(qū)別
• refs 是什么?
• React為什么自己定義一套事件體系呢做入，與瀏覽器原生事件體系有什么關(guān)系？
• 什么時(shí)候應(yīng)該選擇用class實(shí)現(xiàn)一個(gè)組件同衣，什么時(shí)候用一個(gè)函數(shù)實(shí)現(xiàn)一個(gè)組件竟块？
• 什么是HoC（Higher-Order Component）？適用于什么場景耐齐？
• 并不是父子關(guān)系的組件浪秘，如何實(shí)現(xiàn)相互的數(shù)據(jù)通信？
• 用過 React 技術(shù)棧中哪些數(shù)據(jù)流管理庫埠况？
• Redux是如何做到可預(yù)測呢耸携？
• Redux將React組件劃分為哪兩種？
• Redux是如何將state注入到React組件上的辕翰？
• 請描述一次完整的 Redux 數(shù)據(jù)流
• React的批量更新機(jī)制 BatchUpdates夺衍？
• React與Vue，各自的組件更新進(jìn)行對比喜命，它們有哪些區(qū)別沟沙？

其他問題

• 原來公司工作流程是怎么樣的，如何與其他人協(xié)作的壁榕？如何跨部門合作的矛紫？
• 你遇到過比較難的技術(shù)問題是？你是如何解決的牌里？
• 設(shè)計(jì)模式 知道什么是singleton, factory, strategy, decrator么?
• 常使用的庫有哪些颊咬？常用的前端開發(fā)工具？開發(fā)過什么應(yīng)用或組件二庵？
• 頁面重構(gòu)怎么操作贪染？
• 列舉IE與其他瀏覽器不一樣的特性？
• 99%的網(wǎng)站都需要被重構(gòu)是那本書上寫的催享？
• 什么叫優(yōu)雅降級和漸進(jìn)增強(qiáng)杭隙？
• 是否了解公鑰加密和私鑰加密。
• WEB應(yīng)用從服務(wù)器主動(dòng)推送Data到客戶端有那些方式因妙？
• 對Node的優(yōu)點(diǎn)和缺點(diǎn)提出了自己的看法痰憎？
• 你有用過哪些前端性能優(yōu)化的方法？
• http狀態(tài)碼有那些攀涵？分別代表是什么意思铣耘？
• 一個(gè)頁面從輸入 URL 到頁面加載顯示完成，這個(gè)過程中都發(fā)生了什么以故？（流程說的越詳細(xì)越好）
• 部分地區(qū)用戶反應(yīng)網(wǎng)站很卡蜗细，請問有哪些可能性的原因，以及解決方法？
• 從打開app到刷新出內(nèi)容炉媒，整個(gè)過程中都發(fā)生了什么踪区，如果感覺慢，怎么定位問題吊骤，怎么解決?
• 第一次訪問頁面中時(shí)彈出引導(dǎo)缎岗，用戶關(guān)閉引導(dǎo)，之后再次進(jìn)入頁面時(shí)不希望出現(xiàn)引導(dǎo)白粉，如何實(shí)現(xiàn)传泊？
• 除了前端以外還了解什么其它技術(shù)么？你最最厲害的技能是什么鸭巴？
• 你用的得心應(yīng)手用的熟練地編輯器&開發(fā)環(huán)境是什么樣子眷细？
• 對前端界面工程師這個(gè)職位是怎么樣理解的？它的前景會(huì)怎么樣奕扣？
• 你怎么看待Web App 薪鹦、hybrid App、Native App惯豆？
• 你移動(dòng)端前端開發(fā)的理解池磁？（和 Web 前端開發(fā)的主要區(qū)別是什么？）
• 產(chǎn)品進(jìn)行版本升級時(shí)楷兽，可能發(fā)生不兼容性問題地熄，如何提前預(yù)防和解決？
• 你對加班的看法芯杀？
• 平時(shí)如何管理你的項(xiàng)目端考？
• 說說最近最流行的一些東西吧？常去哪些網(wǎng)站揭厚？
• 如何設(shè)計(jì)突發(fā)大規(guī)模并發(fā)架構(gòu)屈暗？
• 說說最近最流行的一些東西吧戈轿？常去哪些網(wǎng)站暂论？
• 是否了解開源的工具 bower六孵、npm、yeoman太援、grunt闽晦、gulp，一個(gè) npm 的包里的 package.json 具備的必要的字段都有哪些提岔？（名稱仙蛉、版本號，依賴）
• 每個(gè)模塊的代碼結(jié)構(gòu)都應(yīng)該比較簡單碱蒙，且每個(gè)模塊之間的關(guān)系也應(yīng)該非常清晰荠瘪，隨著功能和迭代次數(shù)越來越多，你會(huì)如何去保持這個(gè)狀態(tài)的？
• Git知道branch, diff, merge么?
• 如何設(shè)計(jì)突發(fā)大規(guī)模并發(fā)架構(gòu)哀墓？
• 當(dāng)團(tuán)隊(duì)人手不足鞭莽，把功能代碼寫完已經(jīng)需要加班的情況下，你會(huì)做前端代碼的測試嗎麸祷？
• 說說最近最流行的一些東西吧？平時(shí)常去哪些網(wǎng)站褒搔？
• 知道什么是SEO并且怎么優(yōu)化么? 知道各種meta data的含義么?
• 移動(dòng)端（Android IOS）怎么做好用戶體驗(yàn)?
• 簡單描述一下你做過的移動(dòng)APP項(xiàng)目研發(fā)流程阶牍？
• 你在現(xiàn)在的團(tuán)隊(duì)處于什么樣的角色，起到了什么明顯的作用星瘾？
• 你認(rèn)為怎樣才是全端工程師（Full Stack developer）走孽？
• 介紹一個(gè)你最得意的作品吧？
• 你有自己的技術(shù)博客嗎琳状，用了哪些技術(shù)磕瓷？
• 對前端安全有什么看法？
• 是否了解Web注入攻擊念逞，說下原理困食，最常見的兩種攻擊（XSS 和 CSRF）了解到什么程度？
• 項(xiàng)目中遇到國哪些印象深刻的技術(shù)難題翎承，具體是什么問題硕盹，怎么解決？叨咖。
• 最近在學(xué)什么東西瘩例？
• 你的優(yōu)點(diǎn)是什么？缺點(diǎn)是什么甸各？
• 如何管理前端團(tuán)隊(duì)?
• 最近在學(xué)什么垛贤？能談?wù)勀阄磥?，5年給自己的規(guī)劃嗎趣倾？

有趣的問題

• .A聘惦、B兩人分別在兩座島上。B生病了誊酌，A有B所需要的藥部凑。C有一艘小船和一個(gè)可以上鎖的箱子。C愿意在A和B之間運(yùn)東西碧浊，但東西只能放在箱子里涂邀。只要箱子沒被上鎖，C都會(huì)偷走箱子里的東西箱锐，不管箱子里有什么比勉。如果A和B各自有一把鎖和只能開自己那把鎖的鑰匙，A應(yīng)該如何把東西安全遞交給B？

答案：A把藥放進(jìn)箱子浩聋，用自己的鎖把箱子鎖上观蜗。B拿到箱子后，再在箱子上加一把自己的鎖衣洁。
箱子運(yùn)回A后墓捻，A取下自己的鎖。箱子再運(yùn)到B手中時(shí)坊夫，B取下自己的鎖砖第，獲得藥物。

• Amazon主頁的左上角有一個(gè)商品分類瀏覽的下拉菜單 沒有延遲环凿，而且子菜單也不會(huì)在不應(yīng)該的時(shí)候消失梧兼。它是怎樣做到這一點(diǎn)的呢？

答案：是通過探測鼠標(biāo)移動(dòng)的方向和軌跡智听，具體查看Khan Academy工程師 Ben Kamens 寫的 jQuery插件

BAT前端開發(fā)面試題：HTML+CSS+JavaScript+ES6+框架之大全

歡迎大家關(guān)注我羽杰，每天分享干貨文章和面試大綱答案