前端面試題

2021-09-13 18:02:52 字數 3259 閱讀 5710

以下,是個人遇到的面試題 

20170327

1、專案介紹 

2、你在專案中的職責 

3、h5會用嗎? 

4、行內元素和塊級元素舉幾個例子? 

行內元素:span,a,var ,em,input,img,img,textarea,var,em,strong,select, 

塊級標籤:div,p,h1-h3,ul,ol,dl,li,dd,dt,table,td,tr, 

5、link和@import的區別? 

(1)link屬於html標籤,而@import是css提供的。 

(2)頁面被載入時,link會同時被載入,而@import引用的css會等到頁面被載入完再載入。 

(3)import只在ie5以上才能識別,而link是html標籤,無相容問題。 

(4)link方式的央視權重高於@import的權重。 

6、選擇框獲得第幾項,獲得第幾項的值,文字內容 

(1)js 

利用for迴圈

(2)jquery 

7、陣列怎麼去重 

7.1 去重的方法 

(1)使用陣列方法indexof來判斷

function

sele

(arr)

}return temp;

}var arr = ['aa', 'bb', 'cc', '', 1, 0, '1', 1, 'bb', null, undefined, null];

console.log(sele(arr));

2個缺點,一是效率問題,因為加上indexof相當於是2重迴圈,二是indexof的相容性問題:ie8–不相容。 

(2)使用陣列方法indexof第二種方法 ie8–不相容

function

sele

( arr )

}return temp;

}

比方法(1)效率還要差 

(3)迴圈

function

sele

( arr )

}temp.push( arr[ i ] );

}return temp;

}

(4)

function

unique3

(array)

; for(var i=0; i}

return result;

}var arr = ['aa', 'bb', 'cc', '', 1, 0, '1', 1, 'bb', null, undefined, null];

console.log(unique3(arr));

以上方法中之所以給key新增了型別字首,是因為要區分』1』和1。

(5)使用es6中includes方法

function

sele

( arr ) )

return temp;

}

(6)es6的set

function

unique4

(array)

var arr = ['aa', 'bb', 'cc', '', 1, 0, '1', 1, 'bb', null, undefined, null];

console.log(unique4(arr));

相容性問題。 

7.2 對上述方法進行速度比較

var testarray = ;

for(var i=0; i

<500000; i++)

function

test

(fn, name)

test(unique1, '第1種實現');

test(unique2, '第2種實現');

test(unique3, '第3種實現');

test(unique4, '第4種實現');

8、ajax非同步與同步的區別 

同步是阻塞模式,非同步是非阻塞模式。 

同步就是指乙個程序在執行某個請求的時候,若該請求需要一段時間才能返回資訊,那麼這個程序將會一直等待下去,直到收到返回資訊才繼續執行下去; 

非同步是指程序不需要一直等下去,而是繼續執行下面的操作,不管其他程序的狀態。當有訊息返回時系統會通知程序進行處理,這樣可以提高執行的效率。

9、js的理解 

js是一種基於物件和事件驅動,並具有安全性的指令碼語言。 

10、平時會遇到哪些瀏覽器相容性問題? 

(延伸的問題:你做的頁面在哪些流覽器測試過?這些瀏覽器的核心分別是什麼?經常遇到的瀏覽器的相容性有哪些?怎麼會出現?解決方法是什麼?) 

ie6、7、8、ff、opear、safari、chrome、maxthon 

trident:windows 下的 ie 瀏覽器使用的核心代號。除 ie 外,眾多的 ie shell(如 maxthon )都使用這個核心。 

gecko:mozilla firefox 瀏覽器使用的核心代號。 

presto:opera 瀏覽器使用的核心代號,這是目前公認網頁瀏覽速度最快的瀏覽器核心。 

khtml/webcore: konqueror/safari 瀏覽器使用的核心代號。

#box

11、瀏覽器快取的區別 

(等同於:請描述一下cookies,sessionstorage和localstorage的區別)? 

sessionstorage用於本地儲存乙個會話(session)中的資料,這些資料只有在同乙個會話中的頁面才能訪問並且當會話結束後資料也隨之銷毀。因此sessionstorage不是一種持久化的本地儲存,僅僅是會話級別的儲存。而localstorage用於持久化的本地儲存,除非主動刪除資料,否則資料是永遠不會過期的。 

web storage和cookie的區別 

web storage的概念和cookie相似,區別是它是為了更大容量儲存設計的。cookie的大小是受限的,並且每次你請求乙個新的頁面的時候cookie都會被傳送過去,這樣無形中浪費了頻寬,另外cookie還需要指定作用域,不可以跨域呼叫。 

除此之外,web storage擁有setitem,getitem,removeitem,clear等方法,不像cookie需要前端開發者自己封裝setcookie,getcookie。但是cookie也是不可以或缺的:cookie的作用是與伺服器進行互動,作為http規範的一部分而存在 ,而web storage僅僅是為了在本地「儲存」資料而生。

前端面試題

sprites是什麼和為什麼要使用他們?css 精靈 把一堆小的整合到一張大的上,減輕伺服器對的請求數量 有可能替代sprites的方法是什麼?svg圖示,字型圖示,字元編碼等等。1 在div排版的時候,假設現在是100px的寬,我在盒子左側用padding left留個10px的白,div就撐開了...

前端面試題

行內元素有哪些?塊級元素有哪些?空 void 元素有哪些?link和 import的區別是?常見相容性問題?含移動端 html5的離線儲存?描寫一段語義化的html 吧 html5的form如何關閉自動完成功能?什麼是閉包 closure 為什麼要用?localstorage和sessionstor...

前端面試題

朋友碰到的筆試題,在此記錄一下,並且記下碰到的有難點但是自己沒注意的到的面試題!function isnumber x else sum 2,3 5 sum 2 3 5 請寫出sum函式的具體實現。function sum a,c return a c 該題考查的是乙個以前沒接觸過的東西,叫做柯里化...