前端面試題總結,你見過幾個?

2022-09-02 07:54:09 字數 2080 閱讀 6213

劃重點

步入正題-筆試

本來我以為只有面試的,發現那個姐姐並不是帶我去面試的,帶我去了個房間,留了兩張題目給我,說半小時來說,毫無防備,接下來步入正題吧~

1.alert(1&&2),alert(1||0)

具體我不記得了反正就這兩個,我以為考的是純粹的與運算和或運算,後來發現太天真了

2.mouseenter和mouseover的區別

這個之前看了下,大概是答出來了,但可能不夠詳細吧

3.用正規表示式匹配字串,以字母開頭,後面是數字、字串或者下劃線,長度為9-20

看到這題我是崩潰的,因為正則學的不多,但是稍微寫了下也差不多只是忘了些

4.js字串兩邊擷取空白的trim的原型方法的實現

5.三道判斷輸出的題都是經典的題

6.寫出position不同值和區別

突然想到還有inherit,當時忘記了,後來面試的時候又重新問了我一下

7.寫乙個div+css布局,左邊右邊文字,文字環繞,外面容器固定寬度,文字不固定(這是後來根據面試官描述的,筆試題上只有圖我就不放上來了)

這道題我沒答好,剛開始我不清楚那個文字是要自適應的面試官說用p標籤包裹文字,我當時就緊張了下,把p標籤錯當成內聯了,然後我再修正,然後加左浮動,然後不行,我就跟面試官說,我以前都直接就乙個img它float:left,加文字不加p標籤就好了然後我回來試一試才發現= =,直接加p標籤就可以了啊= =,omg我的錯誤!!!

8.講述你對reflow和repaint的理解

這個真不會了沒接觸,第乙個我猜是重新布局,第二個倒是見過就是重繪,就想到document.write(),這個後來也沒再問我了查查查

repaint就是重繪,reflow就是回流。repaint主要是針對某乙個dom元素進行的重繪,reflow則是回流,針對整個頁面的重排

嚴重性:

在效能優先的前提下,效能消耗 reflow大於repaint。

體現:repaint是某個dom元素進行重繪;reflow是整個頁面進行重排,也就是頁面所有dom元素渲染。

如何觸發:

style變動造成repaint和reflow。不涉及任何dom元素的排版問題的變動為repaint,例如元素的color/text-align/text-decoration等等屬性的變動。除上面所提到的dom元素style的修改基本為reflow。例如元素的任何涉及長、寬、行高、邊框、display等style的修改。

常見觸發場景:

觸發repaint:

觸發reflow:

如何避免:

盡可能在dom末梢通過改變class來修改元素的style屬性:盡可能的減少受影響的dom元素。

避免設定多項內聯樣式:使用常用的class的方式進行設定樣式,以避免設定樣式時訪問dom的低效率。

設定動畫元素position屬性為fixed或者absolute:由於當前元素從dom流中獨立出來,因此受影響的只有當前元素,元素repaint。

避免使用table進行布局:table的每個元素的大小以及內容的改動,都會導致整個table進行重新計算,造成大幅度的repaint或者reflow。改用div則可以進行針對性的repaint和避免不必要的reflow。

避免在css中使用表示式:學習css的時候就知道,這個應該避免,不應該加深到這一層再去了解,因為這個的後果確實非常嚴重,一旦存在動畫性的repaint/reflow,那麼每一幀動畫都會進行計算,效能消耗不容小覷。

面試部分

半小時寫完筆試後,等待面試,hh中途遇到了北郵的師兄聊了一些nodejs的東西

步入正題面試

基本也就這些,面試官人挺好的,感覺沒什麼壓力~最後也讓我過了吧,說我還得多去看看基礎的東西~確實基礎還不夠紮實哈,不過總的來說,這人生第一次面試還挺順利的說,也是運氣好吧~希望以後的路能踏實的走下去吧~

需要web前端學習資料的同學,**434623999 

前端面試題總結

什麼是盒子模型?元素寬度是否包含margin寬度?padding百分比是相對於父級寬度還是自身寬度?解釋px和em?答 盒子模型又稱框模型,包含了元素內容 內邊距 邊框 外邊距幾個要素。元素內容不包括margin寬度,但是ie模式的width包括content padding border,w3c的...

前端面試題總結

1.彈性布局 flex布局是css3中新增的一種布局方式。元素排列方式 flex direction 超出行是否換行 nowrap不換行 flex wrap 水平對齊方式 justify content 垂直對齊方式 align items 實現水平居中對齊 display flex justify...

前端面試題總結

前端瀏覽器快取問題 1.強快取,可以通過cache control和expires控制。cache control no cache,no store,must revalidate cache control must revalidate 必須重新驗證 cache control no cach...