前端面試常問演算法_web前端面試經常問到的面試題有哪些

❶ BAT 前端工程師面試對演算法一般有怎樣的要求

當我是實習生時，我遇到了BAT三，所以我對演算法沒有要求。當然，實習生的要求也可能比較低。

阿裡面試:

一邊使用電腦直接連接到互聯網看到面試官網站,博客之類的,然後選擇一些問,並幫助考背後的標簽組件的實現和JS類繼承,等等。在第二個方面,我也看到了,GitHub,博客等等。

實際上，在工作的前端使用的演算法並不多，即使像jQuery這樣的公共庫的實現對演算法的應用也不是很好。至於何時使用，請使用NodeJs偶爾編寫自動化工具，前端WebGL矩陣操作，圖像處理，如需要，但我認為這些都超出了一般前端工程師的能力。

❷ 前端面試官常問的問題有哪些

1、重繪和重排的關系：

重繪不會引起重排，但重排一定會引起重繪，一個元素的重排通常會帶來一系列的反應，甚至觸發整個文檔的重排和重繪，性能代價是高昂的。

2、重繪的概念：

重繪是一個元素外觀的改變所觸發的瀏覽器行為，例如改變visibility、outline、背景色等屬性。瀏覽器會根據元素的新屬性重新繪制，使元素呈現新的外觀。由於瀏覽器的流布局，對渲染樹的計算通常只需要遍歷一次就可以完成。

但table及其內部元素除外，它可能需要多次計算才能確定好其在渲染樹中節點的屬性值，比同等元素要多花兩倍時間，這就是我們盡量避免使用table布局頁面的原因之一。

3、觸發重排的情況：

頁面渲染初始化時；瀏覽器窗口改變尺寸；元素尺寸改變時；元素位置改變時；元素內容改變時；添加或刪除可見的DOM元素時。

4、rex的缺點：

（1）一個組件所需要的數據，必須甶父組件傳過來，而不能像flux中直接從store取。

（2）當一個組件相關數據更新吋，即使父組件不需要用到這個組件，父組件還是會重新render,可能會有效率影響，或者需要寫復雜的shouldComponentUpdate進行判斷。

5、對MVC和MVVM的理解：

（1）mvc：View傳送指令到Controller Controller完成業務邏輯後，要求Model改變狀態Model將新的數據發送到View，用戶得到反饋所有通信都是單向的。Angular它採用雙向綁定（data-binding）：View的變動，自動反映在ViewModel，反之亦然。組成部分Model、View、ViewModel

（2）View：UI界面ViewModel：它是View的抽象，負責View與Model之間信息轉換，將View的Command傳送到Model；Model：數據訪問層。

❸ 前端面試會提問到哪些

在面試前端的過程中，有些問題是經常會被提問到的
一、基礎篇
1. 在不使用第三個變數的情況下，如何調換a與b的值？
2. px與em的區別
3. 簡述一下盒模型
4. 頁面導入樣式時，使用link和@import有什麼區別？
5. 簡述一下事件代理
二、HTML常見題目
01、Doctype作用？嚴格模式與混雜模式如何區分？它們有何意義？
02、HTML5為什麼只需要寫？
03、行內元素有哪些？塊級元素有哪些？空(void)元素有哪些？
04、頁面導入樣式時，使用link和@import有什麼區別？
05、介紹一下你對瀏覽器內核的理解？
06、常見的瀏覽器內核有哪些？
07、html5有哪些新特性、移除了哪些元素？如何處理HTML5新標簽的瀏覽器兼容問題？
08、如何區分HTML和HTML5？
09、簡述一下你對HTML語義化的理解？
10、HTML5的離線儲存怎麼使用，工作原理能不能解釋一下？
三、CSS類的題目
01、介紹一下標準的CSS的盒子模型？與低版本IE的盒子模型有什麼不同的？
02、CSS選擇符有哪些？哪些屬性可以繼承？
03、CSS優先順序演算法如何計算？
04、CSS3新增偽類有哪些？
05、如何居中div？如何居中一個浮動元素？如何讓絕對定位的div居中？
06、display有哪些值？說明他們的作用。
07、position的值relative和absolute定位原點是？
08、CSS3有哪些新特性？
09、請解釋一下CSS3的Flexbox(彈性盒布局模型),以及適用場景？
10、用純CSS創建一個三角形的原理是什麼？
四、JavaScript類的題目
01、JavaScript中this是如何工作的
02、請解釋原型繼承的原理。
03、什麼是閉包(closure)，如何使用它，為什麼要使用它？
04、.call 和.apply的區別是什麼？
05、請指出JavaScript 宿主對象(host objects) 和原生對象(native objects) 的區別？
06、請指出以下代碼的區別：function Person(){}、var person = Person()、var person = new Person()？
07、請解釋變數聲明提升(hoisting)。
08、什麼是「use strict」; ？使用它的好處和壞處分別是什麼？
09、什麼是事件循環 (event loop)？
10、請解釋同步 (synchronous) 和非同步 (asynchronous) 函數的區別。
五、開發及性能優化類題目
01、如何規避javascript多人開發函數重名問題？
02、請說出三種減低頁面載入時間的方法.
03、說說你所了解到的Web攻擊技術。
04、說說你說了解的前端性能優化方法？
05、前端開發中，如何優化圖像？圖像格式的區別？
06、瀏覽器是如何渲染頁面的？
07、頁面重構怎麼操作？
08、什麼叫優雅降級和漸進增強？
09、前端需要注意哪些SEO？如何做SEO優化？
10、平時如何管理你的項目？

❹ 前端hr面試常問的問題

面試其實就是一個不斷選擇與被選擇的過程(不知道說的對不對)。不同公司的面試方式都有所不同，大多數人都有過多次面試的經歷，前端面試也不外乎那麼一些啦(好像有些廢話的感覺)。

面試之前的小故事

HR會打電話過來我是××公司的，在××上看到你投到我們公司的簡歷，問你何時候有空約一個唄，然後說就星期*吧，既然都打電話請我面試了，好吧，那就約一個!

然後有些人會精心准備，不停刷面試題，整夜整夜的看著HTML/JS/CSS知識點，還有那些最新的、時髦的技術，看看到時候能不能唬住面試官;而有些人對自己胸有成竹，哥那麼多年的前端經驗了，啥項目沒有經歷過，不就一個面試，怕啥呢。

很快或者很慢的來到那天。你打扮的清清爽爽漂漂亮亮的，打扮的好會有加分不，沒錯，第一印象也是挺重要的。途中有些人可能會還一直想著面試官會問啥題目呢，那啥**屬性是什麼來著呢，再次拿出手機默默的看起資料;有些人可能就會想著公司不知道妹子多不多漂亮不呢，環境和福利不知道咋樣，最好別碰到傻逼一樣的面試官哎，不然這以後咋相處好呢。

來到公司，大小公司大家都見多了嘛，也是得看發展是吧，我們也不是膚淺的人，見到前台妹妹，喲，還不錯哦。領你進會議室里，讓你稍等一下，她去通知面試官，過了一會兒，不是面試官進來，那就是前台妹妹給您送來一杯水。面試官踱步向前，咦~，我是繼續坐著呢，還是站著呢，還是站起來顯禮貌一些嗯。

給面試的一般會是Team Leader或者非常資深的工程師。首先會讓你自我介紹下，然後巴拉巴拉介紹自己，途中或者聊到面試官喜歡的`部分那就會中斷問幾個問題吧，介紹完自己，就進入正式的戰鬥了吧，一般會有2-3輪的回合。遇知戰斗詳情，請聽下回分解。

哈哈，開玩笑。以上瞎編胡造，如有雷同，純屬巧合。

這里就只談談前端技術的戰斗回合吧，寫的不好，請多見諒。

普通型

面試中問題會比較的零碎，html/js/css肯定都會有涉及。知識點不會有太大的規律，可能幾個公司面試下來你遇到的問題一個都不帶重復的。哎，前端的知識點就是乍一看深似海，仔細一看深似黑洞啊。問題好的話，一方面考察了面試人對前端接觸的廣度，深度的話也可以從中接觸到一些。因為面試的時間有限，其實也非常考驗面試官對一個人的洞察能力。

一般如果不是應屆生的話，也就是會跟你交流你之前的項目，你擔當的角色，你遇到的難題，怎麼解決問題，用的框架，與其他工程師的交流溝通協作等等。這些其實你心裡肯定是有答案的(可能也有懵逼的)，就看你的表達，能不能對上面試官的胃口。

進階型

除了基本的問題，面試中會有一些明顯設計過的題目。針對某幾個知識點，或讓你手寫代碼，或讓你提供演算法或思路。如果之前沒有遇到過這類問題的話其實一下子真的挺難回答，或者直接懵逼了，或者回答不出面試官滿意的答案。這其實對工程師的要求也是比較的高，不能只是單純的切切頁面，用用插件，需要對某一類問題或者模式或者演算法有深入的了解，對問題的解決思路有很好的把握。

演算法可能不是前端工程師的長項，但作為優秀的工程師，對演算法的了解應該會只深不淺。

這種面試的題目既提現了公司對面試者的要求，也相對而言的會有所體現公司的水平。

出題型

題目比較的綜合，會通過郵件發給你，或者有專門的頁面提供，在面試之前讓你2-3天的時間做完。題目可能是很有名的某一類交互，或游戲，或頁面，或公司自己出的一類小東西。

因為非當場面試，所有有比較充足的時間來思考，來寫一些代碼。一般都會完成，所以其實比較的關注點就是對代碼的質量，通過代碼來考察面試者的思路以及代碼**慣等等。

其未知性也比較多，可能因為有些東西可能沒法通過代碼來傳遞，溝通，其他的思路，或者題目的缺陷等等。所以這只是面試途中的一個小部分，大多數人其實都會能做的很好。

直接上機型

還有的就會直接給你某一個交互，或者一張靜態頁面，或者一個布局等等，直接給你台電腦讓你當場寫出來。寫完之後再有所交流，說說自己的想法或者接著談其他的。

當你寫代碼時候，其實暴露的東西也挺多的。你寫的**慣，思路清晰不清晰，對代碼的熟悉程度，可能你平時都是ctrl C + V的，這時候你咋辦呢。

這個可能遇到的比較少，但也會是有的。

結束語

許多面試可能都會結合以上的幾種類型，多方面的考察面試者，其實，大家都懂的。

❺ WEB前端面試題

第二章面試題基礎篇

2.1 HTML面試題

面試題：行內元素有哪些？塊級元素有哪些？空(void)元素有那些？

面試題：頁面導入樣式時，使用link和@import有什麼區別？

面試題：title與h1的區別、b與strong的區別、i與em的區別？

面試題：img標簽的title和alt有什麼區別？

面試題：png、jpg、gif 這些圖片格式解釋一下，分別什麼時候用？

2.2 CSS面試題

面試題：css背景紋路

面試題：介紹一下CSS的盒子模型

面試題：CSS選擇符有哪些？哪些屬性可以繼承？

面試題：CSS優先順序演算法如何計算？

面試題：用CSS畫一個三角形

面試題：一個盒子不給寬度和高度如何水平垂直居中？

面試題：display有哪些值？說明他們的作用。

面試題：對BFC規范(塊級格式化上下文：block formatting context)的理解？

面試題：清除浮動有哪些方式？

面試題：在網頁中的應該使用奇數還是偶數的字體？為什麼呢？

面試題：寫一個左中右布局占滿屏幕，其中左、右倆塊固定寬200，中間自適應寬，要求先載入中間塊，請寫出結構及樣式。

面試題：什麼是CSS reset？

面試題：css sprite是什麼,有什麼優缺點

面試題：display: none;與visibility: hidden;的區別

面試題：position有哪些值?有什麼作用? 【特別多公司問】

面試題：line-height和height有什麼區別？

面試題：opacity 和 rgba區別

2.3 JavaScript基礎面試題

面試題：延遲載入JS有哪些方式？

面試題：JS數據類型有哪些？

面試題：null和undefined的區別

面試題：JS數據類型考題

面試題：==和===有什麼不同

面試題：JS微任務和宏任務

面試題：JS作用域考題

面試題：JS對象考題

面試題：JS作用域+this指向+原型考題

面試題：JS判斷變數是不是數組，你能寫出哪些方法？

面試題：slice是幹嘛的、splice是否會改變原數組

面試題：JS數組去重

面試題：找出多維數組最大值

面試題：給字元串新增方法實現功能

面試題：找出字元串出現最多次數的字元以及次數

2.4 真正移動端 —— H5/C3面試題

面試題：什麼是語義化標簽

面試題：::before 和 :after中雙冒號和單冒號有什麼區別？解釋一下這2個偽元素的作用。

面試題：如何關閉iOS鍵盤首字母自動大寫

面試題：怎麼讓Chrome支持小於12px 的文字？

面試題：rem和em有什麼樣區別

面試題：ios系統中元素被觸摸時產生的半透明灰色遮罩怎麼去掉

面試題：webkit表單輸入框placeholder的顏色值能改變嗎？

面試題：禁止ios 長按時不觸發系統的菜單，禁止ios&android長按時下載圖片

面試題：禁止ios和android用戶選中文字

面試題：自適應 [淘寶無線適配]

面試題：響應式

第三章面試題進階篇

3.1 JavaScript進階面試題

面試題：new操作符具體做了什麼

面試題：閉包【必須會】

面試題：原型鏈【必須會】

面試題： JS繼承有哪些方式

面試題：說一下call、apply、bind區別

面試題：sort背後原理是什麼？

面試題：深拷貝和淺拷貝

面試題：localstorage、sessionstorage、cookie的區別

3.2 ES6面試題

面試題：var、let、const區別

面試題：作用域考題

面試題：將下列對象進行合並

面試題：箭頭函數和普通函數有什麼區別？

面試題：Promise有幾種狀態

面試題：find和filter的區別【大廠】

面試題：some和every的區別【大廠】

3.3 webpack面試題

面試題：webpack插件

3.4 Git面試題

面試題：git常用命令

面試題：解決沖突

面試題：GitFlow

第四章面試題框架篇

4.1 區分初中高級的 —— Vue面試題

面試題：Vue2.x 生命周期有哪些？

1.系統自帶八個

2.當一旦進入到某個組件會執行哪些生命周期

3.$el和$data在哪個階段有

4.如果使用keep-alive會多倆個生命周期

5.如果加入keep-alive第一次進入組件會執行哪些生命周期

6.如果加入keep-alive第二次或者第N進入該組件會執行哪些生命周期

面試題：談談你對keep-alive的了解

面試題：v-if和v-show區別

面試題：v-if和v-for優先順序 2.x

面試題：ref是什麼？

面試題：nextTick是什麼？

面試題：Vue中如何做樣式穿透

面試題：scoped原理

面試題：Vuex是單向數據流還是雙向數據流？

面試題：講一下MVVM

面試題：雙向綁定原理

面試題：什麼是虛擬DOM

面試題：key是干什麼？

面試題：diff演算法

面試題：Vue組件傳值

面試題：props和data優先順序誰高？

面試題：computed、methods、watch有什麼區別？

面試題：Vuex

面試題：Vue路由

面試題：Vue項目打包後出現空白頁

4.2 微信小程序面試題

面試題：如何自定義頭部？

面試題：如何自定義底部？

4.3 uni-app面試題

面試題：生命周期

面試題：條件編譯

第五章面試題性能優化篇

❻ Web前端崗位面試題有哪些

前端面試題匯總，基本上會有四大類問題，具體如下：
一、HTML

1、Doctype作用？嚴格模式與混雜模式如何區分？它們有何意義?

2、HTML5 為什麼只需要寫 <!DOCTYPE HTML>？
3、行內元素有哪些？塊級元素有哪些？空(void)元素有那些？
4、頁面導入樣式時，使用link和@import有什麼區別？
5、介紹一下你對瀏覽器內核的理解？
6、常見的瀏覽器內核有哪些？
7、html5有哪些新特性、移除了那些元素？如何處理HTML5新標簽的瀏覽器兼容問題？如何區分 HTML 和 HTML5？
8、簡述一下你對HTML語義化的理解？
9、HTML5的離線儲存怎麼使用，工作原理能不能解釋一下？
10、瀏覽器是怎麼對HTML5的離線儲存資源進行管理和載入的呢？
11、請描述一下 cookies，sessionStorage 和 localStorage 的區別？
12、iframe有那些缺點？
13、Label的作用是什麼？是怎麼用的？（加 for 或包裹）
14、HTML5的form如何關閉自動完成功能？
15、如何實現瀏覽器內多個標簽頁之間的通信? (阿里)
16、webSocket如何兼容低瀏覽器？(阿里)
17、頁面可見性（Page Visibility）API 可以有哪些用途？
18、如何在頁面上實現一個圓形的可點擊區域？
19、實現不使用 border 畫出1px高的線，在不同瀏覽器的Quirksmode和CSSCompat模式下都能保持同一效果。
20、網頁驗證碼是幹嘛的，是為了解決什麼安全問題？
21、tite與h1的區別、b與strong的區別、i與em的區別？

二、css

1、介紹一下標準的CSS的盒子模型？與低版本IE的盒子模型有什麼不同的？

2、CSS選擇符有哪些？哪些屬性可以繼承？
3、CSS優先順序演算法如何計算？
4、CSS3新增偽類有那些？
5、如何居中div？如何居中一個浮動元素？如何讓絕對定位的div居中？
6、display有哪些值？說明他們的作用。
7、position的值relative和absolute定位原點是？
8、CSS3有哪些新特性？
9、請解釋一下CSS3的Flexbox（彈性盒布局模型）,以及適用場景？
10、用純CSS創建一個三角形的原理是什麼？

11、一個滿屏品字布局如何設計?

三、常見兼容性問題？

1、li與li之間有看不見的空白間隔是什麼原因引起的？有什麼解決辦法？
2、經常遇到的瀏覽器的兼容性有哪些？原因，解決方法是什麼，常用hack的技巧？
3、為什麼要初始化CSS樣式。
4、absolute的containing block計算方式跟正常流有什麼不同？
5、CSS里的visibility屬性有個collapse屬性值是幹嘛用的？在不同瀏覽器下以後什麼區別？
6、position跟display、margin collapse、overflow、float這些特性相互疊加後會怎麼樣？
7、對BFC規范(塊級格式化上下文：block formatting context)的理解？
8、CSS權重優先順序是如何計算的？
9、請解釋一下為什麼會出現浮動和什麼時候需要清除浮動？清除浮動的方式
10、移動端的布局用過媒體查詢嗎？
11、使用 CSS 預處理器嗎？喜歡那個？
12、CSS優化、提高性能的方法有哪些？
13、瀏覽器是怎樣解析CSS選擇器的？
14、在網頁中的應該使用奇數還是偶數的字體？為什麼呢？
15、margin和padding分別適合什麼場景使用？
16、抽離樣式模塊怎麼寫，說出思路，有無實踐經驗？[阿里航旅的面試題]
17、元素豎向的百分比設定是相對於容器的高度嗎？
18、全屏滾動的原理是什麼？用到了CSS的那些屬性？
19、什麼是響應式設計？響應式設計的基本原理是什麼？如何兼容低版本的IE？
20、視差滾動效果，如何給每頁做不同的動畫？（回到頂部，向下滑動要再次出現，和只出現一次分別怎麼做？）
21、::before 和 :after中雙冒號和單冒號有什麼區別？解釋一下這2個偽元素的作用。
22、如何修改chrome記住密碼後自動填充表單的黃色背景？
23、你對line-height是如何理解的？
24、設置元素浮動後，該元素的display值是多少？（自動變成display:block）
25、怎麼讓Chrome支持小於12px 的文字？
26、讓頁面里的字體變清晰，變細用CSS怎麼做？（-webkit-font-smoothing: antialiased;）
27、font-style屬性可以讓它賦值為「oblique」 oblique是什麼意思？
28、position:fixed;在android下無效怎麼處理？
29、如果需要手動寫動畫，你認為最小時間間隔是多久，為什麼？（阿里）
30、display:inline-block 什麼時候會顯示間隙？(攜程)
31、overflow: scroll時不能平滑滾動的問題怎麼處理？
32、有一個高度自適應的div，裡面有兩個div，一個高度100px，希望另一個填滿剩下的高度。
33、png、jpg、gif 這些圖片格式解釋一下，分別什麼時候用。有沒有了解過webp？
34、什麼是Cookie 隔離？（或者說：請求資源的時候不要讓它帶cookie怎麼做）
35、style標簽寫在body後與body前有什麼區別？

四、JavaScript

1、介紹JavaScript的基本數據類型。
2、說說寫JavaScript的基本規范？
3、JavaScript原型，原型鏈 ? 有什麼特點？
4、JavaScript有幾種類型的值？（堆：原始數據類型和棧：引用數據類型），你能畫一下他們的內存圖嗎？
5、Javascript如何實現繼承？
6、Javascript創建對象的幾種方式？
7、Javascript作用鏈域?
8、談談This對象的理解。
9、eval是做什麼的？
10、什麼是window對象? 什麼是document對象?
11、null，undefined的區別？
12、寫一個通用的事件偵聽器函數(機試題)。
13、[「1」, 「2」, 「3」].map(parseInt) 答案是多少？
14、關於事件，IE與火狐的事件機制有什麼區別？如何阻止冒泡？
15、什麼是閉包（closure），為什麼要用它？
16、javascript 代碼中的」use strict」;是什麼意思 ? 使用它區別是什麼？
17、如何判斷一個對象是否屬於某個類？
18、new操作符具體幹了什麼呢?
19、用原生JavaScript的實現過什麼功能嗎？
20、Javascript中，有一個函數，執行時對象查找時，永遠不會去查找原型，這個函數是？
21、對JSON的了解？
22、[].forEach.call($$("*"),function(a){ a.style.outline="1px solid #"+(~~(Math.random()*(1<<24))).toString(16) }) 能解釋一下這段代碼的意思嗎？
23、js延遲載入的方式有哪些？
24、Ajax 是什麼? 如何創建一個Ajax？
25、同步和非同步的區別?
26、如何解決跨域問題?
27、頁面編碼和被請求的資源編碼如果不一致如何處理？
28、模塊化開發怎麼做？
29、AMD（Moles/Asynchronous-Definition）、CMD（Common Mole
Definition）規范區別？
30、requireJS的核心原理是什麼？（如何動態載入的？如何避免多次載入的？如何緩存的？）
31、讓你自己設計實現一個requireJS，你會怎麼做？
32、談一談你對ECMAScript6的了解？
33、ECMAScript6 怎麼寫class么，為什麼會出現class這種東西?
34、非同步載入的方式有哪些？
35、documen.write和 innerHTML的區別?
36、DOM操作——怎樣添加、移除、移動、復制、創建和查找節點?
37、.call() 和 .apply() 的含義和區別？
38、數組和對象有哪些原生方法，列舉一下？
39、JS 怎麼實現一個類。怎麼實例化這個類
40、JavaScript中的作用域與變數聲明提升？
41、如何編寫高性能的Javascript？
42、那些操作會造成內存泄漏？
43、JQuery的源碼看過嗎？能不能簡單概況一下它的實現原理？
44、jQuery.fn的init方法返回的this指的是什麼對象？為什麼要返回this？
45、jquery中如何將數組轉化為json字元串，然後再轉化回來？
46、jQuery 的屬性拷貝(extend)的實現原理是什麼，如何實現深拷貝？
47、jquery.extend 與 jquery.fn.extend的區別？
48、jQuery 的隊列是如何實現的？隊列可以用在哪些地方？
49、談一下Jquery中的bind(),live(),delegate(),on()的區別？
50、JQuery一個對象可以同時綁定多個事件，這是如何實現的？
51、是否知道自定義事件。jQuery里的fire函數是什麼意思，什麼時候用？
52、jQuery 是通過哪個方法和 Sizzle 選擇器結合的？（jQuery.fn.find()進入Sizzle）
53、針對 jQuery性能的優化方法？
54、Jquery與jQuery UI有啥區別？
55、JQuery的源碼看過嗎？能不能簡單說一下它的實現原理？
56、jquery 中如何將數組轉化為json字元串，然後再轉化回來？
57、jQuery和Zepto的區別？各自的使用場景？
58、針對 jQuery 的優化方法？
59、Zepto的點透問題如何解決？
60、jQueryUI如何自定義組件?
61、需求：實現一個頁面操作不會整頁刷新的網站，並且能在瀏覽器前進、後退時正確響應。給出你的技術實現方案？
62、如何判斷當前腳本運行在瀏覽器還是node環境中？（阿里）
63、移動端最小觸控區域是多大？
64、jQuery 的 slideUp動畫，如果目標元素是被外部事件驅動, 當滑鼠快速地連續觸發外部元素事件, 動畫會滯後的反復執行，該如何處理呢?
65、把 Script 標簽放在頁面的最底部的body封閉之前和封閉之後有什麼區別？瀏覽器會如何解析它們？
66、移動端的點擊事件的有延遲，時間是多久，為什麼會有？怎麼解決這個延時？（click 有 300ms 延遲,為了實現safari的雙擊事件的設計，瀏覽器要知道你是不是要雙擊操作。）
67、知道各種JS框架(Angular, Backbone, Ember, React, Meteor, Knockout…)么? 能講出他們各自的優點和缺點么?
68、Underscore 對哪些 JS 原生對象進行了擴展以及提供了哪些好用的函數方法？
69、解釋JavaScript中的作用域與變數聲明提升？
70、那些操作會造成內存泄漏？
71、JQuery一個對象可以同時綁定多個事件，這是如何實現的？
72、Node.js的適用場景？
(如果會用node)知道route, middleware, cluster, nodemon, pm2, server-side rendering么?
73、解釋一下 Backbone 的 MVC 實現方式？
74、什麼是「前端路由」?什麼時候適合使用「前端路由」? 「前端路由」有哪些優點和缺點?
75、知道什麼是webkit么? 知道怎麼用瀏覽器的各種工具來調試和debug代碼么?
76、如何測試前端代碼么? 知道BDD, TDD, Unit Test么? 知道怎麼測試你的前端工程么(mocha, sinon, jasmin, qUnit..)?
77、前端templating(Mustache, underscore, handlebars)是幹嘛的, 怎麼用?
78、簡述一下 Handlebars 的基本用法？
79、簡述一下 Handlerbars 的對模板的基本處理流程，如何編譯的？如何緩存的？
80、用js實現千位分隔符?(來源：前端農民工，提示：正則+replace)
檢測瀏覽器版本版本有哪些方式？
81、我們給一個dom同時綁定兩個點擊事件，一個用捕獲，一個用冒泡，你來說下會執行幾次事件，然後會先執行冒泡還是捕獲

❼ hr如何面試web前端工程師，該問哪些技術問題

hr如何面試web前端工程師，該問哪些技術問題

一、基本知識
我們生活在網際網路時代，你想知道的任何事情幾乎都能在15分鍾內找到相關資訊。可是，能找到資訊並不等於你會使用它。我認為所有前端工程師至少都應該掌握某些基本的知識，才能有效地完成自己的工作。如果一遇到問題，就停下工作上網四處搜尋解決方案，怎麼可能保證按期完成工作呢？聽聽，還有誰在說「我不知道，但我可以上網搜到。」請這些同學把手舉起來，讓大家認識一下（immediately raises a flag for me.）。下面我列出一些基本的知識點，這些都是我認為一名前端工程師（無論工作年頭長短）在沒有任何外來幫助的情況應該知道的。
[list][*]
DOM結構——兩個節點之間可能存在哪些關系以及如何在節點之間任意移動。
[*]
DOM操作——怎樣新增、移除、移動、復制、建立和查詢節點。
[*]
事件——怎樣使用事件以及IE和DOM事件模型之間存在哪些主要差別。
[*]
XMLHttpRequest——這是什麼、怎樣完整地執行一次GET請求、怎樣檢測錯誤。
[*]
嚴格模式與混雜模式——如何觸發這兩種模式，區分它們有何意義。
[*]
盒模型——外邊距、內邊距和邊框之間的關系，IE 8以下版本的瀏覽器中的盒模型有什麼不同。
[*]
塊級元素與行內元素——怎麼用CSS控制它們、它們怎樣影響周圍的元素以及你覺得應該如何定義它們的樣式。
[*]
浮動元素——怎麼使用它們、它們有什麼問題以及怎麼解決這些問題。
[*]
HTML與XHTML——二者有什麼區別，你覺得應該使用哪一個並說出理由。
[*]
JSON——它是什麼、為什麼應該使用它、到底該怎麼使用它，說出實現細節來。
[/list]
重申一下，上述這些知識點都應該是你應該「想都不用想」的東西。我一開始問的所有問題都是想摸清你對所有這些領域知識的掌握程度。雖然上面列出的這些知識點並沒有面面俱到，但我覺得你至少應該掌握這些，才有可能跟我坐到一間辦公室里來。
二、少量提問
我非常贊同面試者問的問題越少越好。反復問應聘者各種問題既不公平，也很無聊。我在任何一次面試中，通常只問三個大問題，但每個問題又會涉及我所能想到的多個方面。回答每個大問題一般要經過幾個步驟，這樣我就可以在每個步驟中穿插著問一些小問題。比如說：

現在有一個正顯示著Yahoo!股票價格的頁面。頁面上有一個按鈕，你可以單擊它來重新整理價格，但不會重新載入頁面。請你描述一下實現這個功能的過程，假設伺服器會負責准備好正確的股票價格資料。
這個問題牽扯到一組我想要考察的基本知識點：DOM結構、DOM操作、事件處理、XHR和JSON。如果我要求你對換一種處理股票價格的方式，或者讓你在頁面中顯示其他資訊，就可以把更多的知識點包括進來。對於經驗比較豐富應聘者，我也可以自如地擴充套件要考察的知識范圍，最簡單像JOSN與XML的區別、安全問題、容量問題，等等。
我還希望應聘者給出的任何解決方案中都不要使用庫。我想看到最原生態的程式碼，你就當頁面中沒有包含任何庫。你說你對哪個庫了解多少多少，但我不能把關於庫的知識作為評判能力的因素，因為庫是會隨時間變化的。我需要的是真正理解庫背後的機制，特別是能夠徒手寫出一個自己的庫的人。
三、解決問題
做為一名前端工程師，最值得高興的事莫過於解決同一個問題會有很多種不同的方法，而你要做的就是找出最合適的方法來。我在提問的時候，經常會在應聘者解釋完一種方法後問他們還有沒有第二種方法。此時我會跟他們說，假設你的這個方法由於種種原因被否決了，那麼你還能不能給出另一種方法。這樣做可以達到兩個目的。
首先，可以測試出他們是否在毫無意義地復述書本中的東西。不能不承認，某些人確實有過目不忘的天賦，聽他們在那裡滔滔不絕地講，你會覺得他們什麼都明白。可是，只要一跟這些人談到怎麼查詢方案無效的原因，以及能否拿出一個新方案來，他們往往就傻眼了。這時候，如果我聽到「我不明白這個方案為什麼不夠好」之類的反問，心裡立刻就明白我的問題已經超出了他們的能力范圍，而他們只是想拿自己死記硬背的結論來矇混過關。
其次，可以測試出他們已經掌握的（還是那句話，「想都不用想」）瀏覽器技術知識。如果他們對瀏覽器平台的核心知識有較好的理解，想出解決同一問題的不同方案根本沒有那麼難。
對一名前端工程師來說，這絕對是最重要的能力。前端工程師在工作中遇到本該如此卻並未如此的難題（說你啦，IE6），應該說是一件很平常的事。一個方案無效就無計可施的人，做不了前端工程師。
考核應聘者解決問題能力的另一層原因，與我的個人喜好有關。在搞清楚應聘者知道什麼不知道什麼之後，我就會想著問一個他們知識領域之外的問題。這樣做的目的，就是想看看他們怎樣運用已有的知識解決新問題。在解決問題的每一步，我也准備了一些提示，以防有人會卡殼打艮（在我面前15分鍾一言不發，對我評價這個人毫無幫助）。我真正感興趣的，是他們能夠從上一步前進到下一步。我希望看到一個人就在我眼前學到新知識。
注意：所有問題都與瀏覽器技術相關。我不相信出幾道抽象的邏輯題，就能夠考出某人解決Web技術問題的能力。在我看來，這無異於讓素描大師畫肖像（或者讓劉翔跟博爾特同場競技），沒有意義，也得不到任何有價值的資訊。

HR一般不會面試太深的問題，主要是了解一下你之前的工作經歷，更多的是你自己描述，中間可能會問一些初級的問題，比如，你為什麼從上一家單位離職等類似問題。

一道web前端工程師面試題，求解答。

這樣的布局用絕對定位實現最合適，ABC的外層用相對定位，里邊各列用絕對定位就可以。至於CBA且B寬度自適應，還是用絕對定位，但只定位C,A分部到兩側，中間的列margin設成左右列的寬度就可以。

web前端工程師如何才能硬氣的跳槽？

web前端開發工程師想要硬氣的跳槽，起碼應該達到以下幾點：
1.掌握扎實的技術基礎，
需要掌握技術包括：HTML、CSS、JavaScript;
HTML是Web程式設計的基礎，HTML也是一種規范，一種標准，它通過標記符號來標記要顯示的網頁中的各個部分。網頁檔案本身是一種文字檔案，通過在文字檔案中新增標記符，可以告訴瀏覽器如何顯示其中的內容。
維護大型的CSS程式碼庫並非易事，特別是那些隨意散漫未經組織的CSS程式碼極易變成一團亂麻，所以，應該掌握CSS命名規范，來幫助開發者編寫優質的程式碼。
2.深入理解前端工程化和元件開發;
需要熟悉web前端框架—— React、Vue.js等，
React為我們提供了直接易用的，以狀態為核心的前端應用開發方式，前端工程師應該會分析React內部工作原理，討論React中簡單元件、類元件等渲染流程。
Vue.js單元測試是應用開發中不可或缺的部分，日常開發中會用到的Vue.js單元測試的例子，所以應該掌握。
3.熟練掌握Web開發相關知識
至少熟悉一門後端語言，例如Node.js、Java、Go等;
Node.js內部原理視非常重要的，應該明白Node.js的主程序是如何啟動的、如何載入內建模組、os包如何實現等等。
4.對技術有熱情，有一定前端架構能力或者技術深度;具備團隊合作意識強，能夠多團隊協作開發;具備企業級大型前端應用開發經驗更佳。

如何識別一個人是web前端工程師

前端工程師需要懂得設計類程式碼和js，有需要了解一些後台語言，例如PHP等。

如何實現成為web前端工程師的夢想

1.入門階段：能夠解決一些問題的水平。有一定的基礎(比如最常見的HTML標簽及其屬性、事件、方法;最常見的CSS屬性;基礎的JavaScript程式設計能力)，能夠完成一些簡單的Web前端研發需求。
2.進階階段：將JavaScript、HTML、CSS之類的編碼幫助手冊里的每個方法/屬性都通讀幾遍!只有將基礎打好，以後的路才能走的順暢。
3.入室：最強程式碼，知道所有能夠解決需求的各種方案，能夠選擇使用最優秀的方案滿足需求。這個級別基本上產品開發程式設計中的程式碼主力。程式設計師應該能夠肯定的回答：對於這個需求而言，我的程式碼就是最優秀的程式碼。
4.注重細節，注意那些當前需求里沒有明文給出的細節：程式碼效能的差異、執行平台(瀏覽器)的差異、需求的隱性擴充套件、程式碼的向後相容等等。

如何了解web前端工程師和UI設計師

web前端工程師是不參與任何的設計，直接將網站美工製作的網站效果圖使用ps按照效果圖進行切片並使用、css、js等程式碼進行網頁的製作，最終編寫出符合w3c標準的相容各個主流瀏覽器的靜態頁面，同時還需要按照後台開發人員的要求留下一些後台資料的介面。所以說網站前端工程師更多的是程式設計而不是設計。
UI設計師一般是學美術或者設計出身，精通photoshop、AI、AE等平面設計工具，其在網站開發過程的中的職責就是按照客戶或者公司的需求設計出符合客戶需求和介面或者顏色符合大眾視覺的網站效果，如根據不同行業的需求設計顏色、設計介面風格等，其工作的最後成果就是網站的效果圖。

web前端工程師進階學習路線如何走

less和sass什麼時候學都行，1,2天就能學會。這個不著急，沒有什麼承上啟下的作用，可以單獨拿出來學。
bootstrap就是一個框架，把最主要的柵格系統看看就好。其他的大概了解能幹啥就行，很多公司，是不讓用bootstrap的，而是用原始碼自己寫。這個用一天的時間沒啥問題。
node.js和angular比較重要，如果學會，算是上了一個台階了。所以重點說說這個。
angular屬於mvvm框架，一開始覺得angular挺復雜的，所以想學一個簡單的，輕量級的，所以決定先學vue。但是在了解的過程中發現，很多的專業名詞，沒聽過，或者理解不透。所以又開始從頭學習node.js。在學習node.js的過程中又開始迷茫，發現了很多JS不懂的地方。
所以，又開始深入研究js的dom，函式，ajax，陣列等。總之用了很長的時間，浪費了很長時間。
最後總結一下啊。其實，沒必要鑽那麼多牛角尖。
先做著vue的例子，不懂的地方，直接略過，很多時候，不理解的不懂的東西，用著用著，突然就能明白。照貓畫虎先把VUE的例子跟著做一遍之後，同時梳理一下涉及到的JS知識點。能自己用vue做出幾個小成品的時候，開始結合js研究node.js。之後再去涉及angular。
angular差不多有個大概了解的時候，反過頭接著學vue，你會發現，又會發現很多新東西。
web前端這個東西特別有意思，當你達到一個高度，返回來再看以前的技術，會發現，哎呀，竟然又能發現新大陸。

廈門web前端工程師培訓哪家好

培訓學校很多，沒有具體的衡量標準的。但是可以從幾方面去選擇：
1 有很多優秀導師的
2 培養出很多優秀學員的
3 只做培訓的，沒有做其他的
4 做的比較久的。

北京WEB前端工程師培訓哪個好

建議找全程面授課程的地方學習，課程體系很重要，現在企業在用人方面講究全棧的前端工程師人才，所在在課程選擇上要慎重，學習內容要基於HTML5，要包含pc端+移動端+後端。這要才能學的系統，就業上才會有所保障。

❽ web前端面試經常問到的面試題有哪些

Web前端經常被問到的面試題及答案

一、HTML+CSS

1.對WEB標准以及W3C的理解與認識

標簽閉合、標簽小寫、不亂嵌套、提高搜索機器人搜索幾率、使用外
鏈css和js腳本、結構行為表現的分離、文件下載與頁面速度更快、內容能被更多的用戶所訪問、內容能被更廣泛的設備所訪問、更少的代碼和組件，容易維
護、改版方便，不需要變動頁面內容、提供列印版本而不需要復制內容、提高網站易用性;

2.xhtml和html有什麼區別

HTML是一種基本的WEB網頁設計語言，XHTML是一個基於XML的置標語言

最主要的不同：

XHTML 元素必須被正確地嵌套。

XHTML 元素必須被關閉。

標簽名必須用小寫字母。

XHTML 文檔必須擁有根元素。

3.Doctype? 嚴格模式與混雜模式-如何觸發這兩種模式，區分它們有何意義?

用於聲明文檔使用那種規范(html/Xhtml)一般為嚴格過度基於框架的html文檔

加入XMl聲明可觸發，解析方式更改為IE5.5 擁有IE5.5的bug

4.行內元素有哪些?塊級元素有哪些?CSS的盒模型?

塊級元素：div p h1 h2 h3 h4 form ul

行內元素: a b br i span input select

Css盒模型:內容，border ,margin，padding

5.CSS引入的方式有哪些? link和@import的區別是?

內聯內嵌外鏈導入

區別：同時載入

前者無兼容性，後者CSS2.1以下瀏覽器不支持

Link 支持使用javascript改變樣式，後者不可

6.CSS選擇符有哪些?哪些屬性可以繼承?優先順序演算法如何計算?內聯和important哪個優先順序高?

標簽選擇符類選擇符 id選擇符

繼承不如指定 Id>class>標簽選擇

後者優先順序高

7.前端頁面有哪三層構成，分別是什麼?作用是什麼?

結構層 Html 表示層 CSS 行為層 js

8.css的基本語句構成是?

選擇器{屬性1:值1;屬性2:值2;……}

9.你做的頁面在哪些流覽器測試過?這些瀏覽器的內核分別是什麼?

Ie(Ie內核) 火狐(Gecko) 谷歌(webkit) opear(Presto)

二、Javascript

1.javascript的typeof返回哪些數據類型

Object number function boolean underfind

2.例舉3種強制類型轉換和2種隱式類型轉換?

強制(parseInt,parseFloat,number)

隱式(== – ===)

3.split() join() 的區別

前者是切割成數組的形式，後者是將數組轉換成字元串

4.數組方法pop() push() unshift() shift()

Push()尾部添加 pop()尾部刪除

Unshift()頭部添加 shift()頭部刪除

5.事件綁定和普通事件有什麼區別

6.IE和DOM事件流的區別

1.執行順序不一樣、

2.參數不一樣

3.事件加不加on

4.this指向問題

7.IE和標准下有哪些兼容性的寫法

Var ev = ev || window.event

document.documentElement.clientWidth || document.body.clientWidth

Var target = ev.srcElement||ev.target

8.ajax請求的時候get 和post方式的區別

一個在url後面一個放在虛擬載體裡面

有大小限制

安全問題

應用不同一個是論壇等只需要請求的，一個是類似修改密碼的

9.call和apply的區別

Object.call(this,obj1,obj2,obj3)

Object.apply(this,arguments)

10.ajax請求時，如何解釋json數據

使用eval parse 鑒於安全性考慮使用parse更靠譜

11.b繼承a的方法

12.寫一個獲取非行間樣式的函數

function getStyle(obj,attr,value)

{

if(!value)

{

if(obj.currentStyle)

{

return obj.currentStyle(attr)

}

else

{

obj.getComputedStyle(attr,false)

}