- 相關(guān)推薦
web前端面試常問問題
1.標(biāo)簽的定義與用法。
2. 塊級(jí)元素和行內(nèi)元素都有哪些?
3. 你真的了解HTML嗎? 雅虎面試題 把前面黃底那段拿去搜索下就知道了(曾在某浪公司面試的時(shí)候被問到過，確實(shí)是很好的問題)。
CSS相關(guān)
1. 介紹所知道的CSS hack技巧(如：_， *， +， \9， !important 之類)。
2. 介紹CSS盒模型。
3. CSS層疊是什么?介紹一下。
4. 都知道哪些CSS瀏覽器兼容性問題。
5. 有時(shí)會(huì)被問到些刁鉆點(diǎn)的題，比如position值都有哪些，CSS3都有哪些新內(nèi)容...
JavaScript基礎(chǔ)相關(guān)
1. HTTP協(xié)議的狀態(tài)消息都有哪些?(如200、302對(duì)應(yīng)的描述)
2. AJAX是什么? AJAX的交互模型(流程)? AJAX跨域的解決辦法?
3. 同步和異步的區(qū)別?
4. 簡述JavaScript封裝。
5. JavaScript繼承有哪兩種形式形式，進(jìn)行描述。
6. 什么是閉包?以下代碼點(diǎn)擊
會(huì)輸出什么?為什么?能大概說明白的話繼續(xù)問能想出幾種解決辦法。
><</span>html >
<</span>head >
<</span>meta charset = "utf-8" />
<</span>title > 閉包演示 </</span>title >
<</span>style type = "text/css" >
p {background:gold;}
</</span>style >
<</span>script type = "text/javascript" >
function init() {
var pAry = document .getElementsByTagName_r("p");
for( var i = 0 ; i <</span>http://emrowgh.com) {
pAry[i] .onclick = function () {
alert(i);
} } } </</span>script >
</</span>head >
<</span>body onload = "init();" >
<</span>p > 產(chǎn)品 0 </</span>p >
<</span>p > 產(chǎn)品 1 </</span>p >
<</span>p > 產(chǎn)品 2 </</span>p >
<</span>p > 產(chǎn)品 3 </</span>p >
<</span>p > 產(chǎn)品 4 </</span>p >
</</span>body >
</</span>html >
7. 在JS中this關(guān)鍵字的使用場合和用法(如在構(gòu)造函數(shù)中、setTimeout中等)。
8. 簡述下cookie的操作，還有cookie的屬性都知道哪些。
9. IE與FF的JS兼容性都知道哪些。
10. DOM操作 - 怎樣添加、移除、移動(dòng)、復(fù)制、創(chuàng)建和查找節(jié)點(diǎn)(這個(gè)問題真心是基礎(chǔ)題，一般不會(huì)問)。
jQuery相關(guān)
1. jQuery源碼是否嘗試去讀過?說說基本的架構(gòu)或者 http://emrowgh.com中都做了哪些判斷。
2. 都知道哪些不好的jQuery書寫方式。
3. Sizzle是否有讀過?
其它相關(guān)的加分項(xiàng)：
1. 都使用和了解過哪些編輯器?都使用和了解過哪些日常工具?
2. 都知道有哪些瀏覽器內(nèi)核?開發(fā)過的項(xiàng)目都兼容哪些瀏覽器?
3. 國內(nèi)外的JS牛人都知道哪些?
4. 瀑布流布局或者流式布局是否有了解
4. 正則表達(dá)式有系統(tǒng)學(xué)習(xí)過嗎(看書或網(wǎng)上教程)?有的話就問問簡單點(diǎn)的郵箱驗(yàn)證、URL驗(yàn)證， 或者問問 貪婪匹配與懶惰匹配 的理論知識(shí)。
5. http://emrowgh.com是否有過嘗試?到什么程度?說說個(gè)人理解的看法?
6. HTML5都有哪些新的JS API?
7. 前端優(yōu)化知識(shí)都知道哪些?
8. 基礎(chǔ)算法題(如快速排序，能否一兩句說說重要的核心原理或者數(shù)組消重等)。
9. 是否有接觸過或者了解過重構(gòu)。
原文：http://emrowgh.com
///////////////////////////////
//////////////////////////////
一般問題
你用Twitter嗎？ （在天朝最好問你用微博嗎？）
如果用，你都關(guān)注那些人？
你用Github嗎？
如果用，你關(guān)注的項(xiàng)目有什么？
你關(guān)注的博客有那些？
你使用那些版本管理系統(tǒng)，比如Git，SVN等？
你常用的開發(fā)環(huán)境是怎樣的？比如操作系統(tǒng)，文本編輯器，瀏覽器，及其他工具等。
你能描述一下你制作一個(gè)網(wǎng)頁的工作流程嗎？
你能描述一下漸進(jìn)增強(qiáng)和優(yōu)雅降級(jí)之間的不同嗎?
如果提到了特性檢測(cè)，可以加分。
請(qǐng)解釋一下什么是語義化的HTML。
你更喜歡在哪個(gè)瀏覽器下進(jìn)行開發(fā)？你使用那些開發(fā)人員工具？
你如何對(duì)網(wǎng)站的文件和資源進(jìn)行優(yōu)化？
期待的解決方案包括：
文件合并
文件最小化/文件壓縮
使用CDN托管
緩存的使用
其他
為什么利用多個(gè)域名來存儲(chǔ)網(wǎng)站資源會(huì)更有效？
瀏覽器一次可以從一個(gè)域名下做多少資源？
請(qǐng)說出三種減低頁面加載時(shí)間的方法。（加載時(shí)間指感知的時(shí)間或者實(shí)際加載時(shí)間）
如果你接到了一個(gè)使用Tab來縮進(jìn)代碼的項(xiàng)目，但是你喜歡空格，你會(huì)怎么做？
建議這個(gè)項(xiàng)目使用像EditorConfig (http://emrowgh.com)之類的規(guī)范
為了保持一致性，轉(zhuǎn)換成項(xiàng)目原有的風(fēng)格
直接使用VIM的retab命令
請(qǐng)寫一個(gè)簡單的幻燈效果頁面
如果不使用JS來完成，可以加分。
你都使用那些工作來測(cè)試代碼的性能？
例如JSPerf (http://emrowgh.com) 例如Dromaeo (http://emrowgh.com) 其它。
如果今年你打算熟練掌握一項(xiàng)新技術(shù)，那會(huì)是什么？
請(qǐng)談一下你對(duì)網(wǎng)頁標(biāo)準(zhǔn)和標(biāo)準(zhǔn)制定機(jī)構(gòu)重要性的理解。
什么是FOUC？你如何來避免FOUC？
HTML相關(guān)問題
文檔類型的作用是什么？你知道多少種文檔類型？
瀏覽器標(biāo)準(zhǔn)模式和怪異模式之間的區(qū)別是什么？
使用XHTML的局限有那些？
如果頁面使用'application/xhtml+xml'會(huì)有什么問題嗎？
如果網(wǎng)頁內(nèi)容需要支持多語言，你會(huì)怎么做？
在設(shè)計(jì)和開發(fā)多語言網(wǎng)站時(shí)，有哪些問題你必須要考慮？
在HTML5的頁面中可以使用XHTML的語法嗎？
在HTML5中如何使用XML？
'data-'屬性的作用是什么？
如果把HTML5看作做一個(gè)開放平臺(tái)，那它的構(gòu)建模塊有那些？
請(qǐng)描述一下cookies，sessionStorage和localStorage的區(qū)別？
JS相關(guān)問題
你使用過那些Javascript庫？
你是否研究過你所使用的JS庫或者框架的源代碼？
什么是哈希表？
'undefined'變量和'undeclared'變量分別指什么？
閉包是什么，如何使用它，為什么要使用它？
你喜歡的使用閉包的模式是什么？
請(qǐng)舉出一個(gè)匿名函數(shù)的典型用例？
請(qǐng)解釋什么是Javascript的模塊模式，并舉出實(shí)用實(shí)例。
如果有提到無污染的命名空間，可以考慮加分。
如果你的模塊沒有自己的命名空間會(huì)怎么樣？
你如何組織自己的代碼？是使用模塊模式，還是使用經(jīng)典繼承的方法？
請(qǐng)指出Javascript宿主對(duì)象和內(nèi)置對(duì)象的區(qū)別？
指出下列代碼的區(qū)別：
function Person(){} var person = Person() var person = new Person()
'.call'和'.apply'的區(qū)別是什么？
請(qǐng)解釋'http://emrowgh.com'的作用？
你如何優(yōu)化自己的代碼？
你能解釋一下JavaScript中的繼承是如何工作的嗎？
在什么時(shí)候你會(huì)使用'http://emrowgh.com()'？
大多數(shù)生成的廣告代碼依舊使用'http://emrowgh.com()'，雖然這種用法會(huì)讓人很不爽。
請(qǐng)指出瀏覽器特性檢測(cè)，特性推斷和瀏覽器UA字符串嗅探的區(qū)別？
請(qǐng)盡可能詳盡的解釋AJAX的工作原理。
請(qǐng)解釋JSONP的工作原理，以及它為什么不是真正的AJAX。
你使用過JavaScript的模板系統(tǒng)嗎？
如有使用做，請(qǐng)談?wù)勀愣际褂眠^那些類似庫文件。比如http://emrowgh.com等等。
請(qǐng)解釋變量聲明提升。
請(qǐng)描述下事件冒泡機(jī)制。
"attribute"和"property"的區(qū)別是什么？
為什么擴(kuò)展JavaScript內(nèi)置對(duì)象是個(gè)壞做法？
為什么擴(kuò)展JavaScript內(nèi)置對(duì)象是個(gè)好做法？
請(qǐng)指出document load和document ready的區(qū)別。(這是個(gè)問題的問題）
'=='和'==='有什么不同？
你如何獲取瀏覽器URL中查詢字符串中的參數(shù)。
請(qǐng)解釋一下JavaScript的同源策略。
請(qǐng)解釋一下事件代理。
請(qǐng)描述一下JavaScript的繼承模式。
如何實(shí)現(xiàn)下列代碼：
[1,2,3,4,5].duplicator(); // [1,2,3,4,5,1,2,3,4,5]
描述一種JavaScript memoization(避免重復(fù)運(yùn)算)的策略。
什么是三元條件語句？
函數(shù)的參數(shù)元是什么？
什么是"use strict"?使用它的好處和壞處分別是什么？
JS代碼示例：
~~3.14
問題：上面的語句的返回值是什么？ 答案：3
"i'm a lasagna hog" .split( "" ).reverse().join( "" );
問題：上面的語句的返回值是什么？ 答案："goh angasal a m'i"
( http://emrowgh.com|| ( http://emrowgh.com"bar" ) );
問題：http://emrowgh.com的值是什么？ 答案："bar" 只有http://emrowgh.com為假時(shí)的才是上面答案，否則就是它本身的值。
var foo = "Hello" ; (function() { var bar = " World" ; alert(foo + bar); })(); alert(foo + bar);
問題：上面兩個(gè)alert的結(jié)果是什么？ 答案: "Hello World" & ReferenceError: bar is not defined
var foo = []; http://emrowgh.com(1); http://emrowgh.com(2);
問題：http://emrowgh.com的值是什么？ 答案：'2'
var foo = {}; http://emrowgh.com'hello' ;
問題：http://emrowgh.com的值是什么？ **答案: undefined
jQuery相關(guān)問題
解釋"chaining"。
解釋"deferreds"。
你知道那些針對(duì)jQuery的優(yōu)化方法。
請(qǐng)解釋'.end()'的用途。
你如何給一個(gè)事件處理函數(shù)命名空間，為什么要這樣做？
請(qǐng)說出你可以傳遞到j(luò)Query方法的四種不同值。
選擇器（字符串），HTML（字符串），回調(diào)函數(shù)，HTML元素，對(duì)象，數(shù)組，元素?cái)?shù)組，jQuery對(duì)象等。
什么是效果隊(duì)列？
請(qǐng)指出'.get()','[]','eq()',的區(qū)別。
請(qǐng)指出'.bing()','.live()'和'.delegate()'的區(qū)別。
請(qǐng)指出'$'和'$.fn'的區(qū)別？或者說出'$.fn'的用戶。
請(qǐng)優(yōu)化下列選擇器：
$( ".foo div#bar:eq(0)" )
CSS相關(guān)問題
描述css reset的作用和用途。
描述下浮動(dòng)和它的工作原理。
清除浮動(dòng)的方法有那些，分別適用于什么情形。
解釋css sprites,如何使用。
你最喜歡的圖片替換方法是什么，你如何選擇使用。
討論CSS hacks，條件引用或者其他。
如何為有功能限制的瀏覽器提供網(wǎng)頁。
你會(huì)使用那些技術(shù)和處理方法。
如何視覺隱藏網(wǎng)頁內(nèi)容，只讓它們?cè)谄聊婚喿x器中可用。
你使用過網(wǎng)格系統(tǒng)嗎？如果使用過，你最喜歡哪種？
你使用過meidia queries（媒體查詢）嗎，或者移動(dòng)網(wǎng)站相關(guān)的CSS布局。
你熟悉SVG樣式的書寫嗎？
如何優(yōu)化網(wǎng)頁的打印樣式。
在書寫高效CSS文件時(shí)會(huì)有哪些問題需要考慮。
你使用CSS預(yù)處理器嗎？(SASS,Compass,Stylus,LESS)
如果使用，描述你的喜好。
你是否接觸過使用非標(biāo)準(zhǔn)字體的設(shè)計(jì)？
字體服務(wù)，Google Webfonts, Typekit,等等。
請(qǐng)解釋瀏覽器是如何根據(jù)CSS選擇器選擇對(duì)應(yīng)元素的。
可選的有趣問題
你編寫過的最酷的代碼是什么？其中你最自豪的是什么？
你知道HTML5的幫派標(biāo)志嗎？
你是否正在或曾經(jīng)在一艘船上。(不懂這個(gè)幽默）
你使用的開發(fā)工具中，你最喜歡的部分是什么？
你有什么業(yè)余項(xiàng)目嗎？是那種類型的？
解釋cornify的重要性？(本題完全摸不到頭腦）
在一張紙上，垂直寫下ABCDE，然后不用任何代碼，將他們到序排列。
靜靜的看他們是否將紙反轉(zhuǎn)。
海盜還是忍者？
如果是兩者的合體，并有恰當(dāng)理由，可以加分。如果是僵尸猴子海盜加忍者加兩分。（注：此題文化差異過大）
如果沒有在Web開發(fā)，你會(huì)做什么？
卡門圣迭哥的隱藏處在哪里？
提示：本題的答案永遠(yuǎn)是錯(cuò)的。
你最愛的IE特性是什么？
完句填空： Brendan Eich和Doug Crockford是JavaScript的________。