面試闖關1
在面試過程中,總會被問到一些你用到過、但是記不清一些零碎的知識,現在做一下總結。
第一部分:HTML+CSS
1.常用那幾種瀏覽器測試?有哪些核心(Layout Engine)?
-
主要核心:Trident,Gecko,Presto,Webkit。
-
IE(Trident)、Firefox(Gecko)、Opera(Presto)、Chrome(Webkit)
2.box-sizing常用的屬性有哪些?分別有什麼作用?
-
content-box:在寬度和高度之外繪製元素的內邊距和邊框。
-
border-box:為元素指定的任何內邊距和邊框都將在已設定的寬度和高度內進行繪製。
-
inherit:從父元素繼承 box-sizing 屬性的值。
3.Doctype作用?標準模式與相容模式各有什麼區別?
-
Doctype作用:告知瀏覽器的解析器用什麼文件標準解析這個文件。DOCTYPE不存在或格式不正確會導致文件以相容模式呈現。
-
區別:標準模式的排版和JS運作模式都是以該瀏覽器支援的最高標準執行。在相容模式中,頁面以寬鬆的向後相容的方式顯示,模擬老式瀏覽器的行為以防止站點無法工作。
4.頁面匯入樣式時,使用link和@import 、行內、嵌入中有什麼區別?
-
行內:失去的css的優勢,但是優先順序最高
-
嵌入:style方式,修改起來複雜
-
@inportant:頁面全部載入完成才匯入css,在頁面非常大的情況下會到時頁面載入完成閃一下出現樣式
-
link:在頁面載入之前載入css檔案
<!– more –>
5.介紹一下你對瀏覽器核心的理解?
主要分成兩部分:渲染引擎(layout engineer或Rendering Engine)和js引擎。
渲染引擎:負責取得網頁的內容(HTML、XML、影像等等)、整理訊息(例如加入CSS等),以及計算網頁的顯示方式,然後會輸出至顯示器或印表機。
瀏覽器的核心的不同對於網頁的語法解釋會有不同,所以渲染的效果也不相同。所有網頁瀏覽器、電子郵件客戶端以及其它需要編輯、顯示網路內容的應用程式都需要核心。
JS引擎則:解析和執行javascript來實現網頁的動態效果。
最開始渲染引擎和JS引擎並沒有區分的很明確,後來JS引擎越來越獨立,核心就傾向於只指渲染引擎。
6.html5有哪些新特性?如何處理HTML5新標籤的瀏覽器相容問題?如何區分 HTML 和 HTML5?
HTML5現在已經不是SGML的子集,主要是關於影像,位置,儲存,多工等功能的增加。
-
拖拽釋放(Drag and drop) API
語義化更好的內容標籤(header,nav,footer,aside,article,section)
音訊、視訊API(audio,video)
畫布(Canvas) API
地理(Geolocation) API
本地離線儲存 localStorage 長期儲存資料,瀏覽器關閉後資料不丟失;
sessionStorage 的資料在瀏覽器關閉後自動刪除
表單控制元件,calendar、date、time、email、url、search
新的技術webworker, websocket, Geolocation
-
移除的元素
純表現的元素:basefont,big,center,font, s,strike,tt,u;
對可用性產生負面影響的元素:frame,frameset,noframes;
支援HTML5新標籤:
-
IE8/IE7/IE6支援通過document.createElement方法產生的標籤,
可以利用這一特性讓這些瀏覽器支援HTML5新標籤,
瀏覽器支援新標籤後,還需要新增標籤預設的樣式:
-
當然最好的方式是直接使用成熟的框架、使用最多的是html5shim框架
<!–[if lt IE 9]>
<script> src=”http://html5shim.googlecode.com/svn/trunk/html5.js”</script>
<![endif]–>
7.簡述一下你對HTML語義化的理解?
-
HTML語義化:根據內容的結構化(內容語義化),選擇合適的標籤(程式碼語義化)便於開發者閱讀和寫出更優雅的程式碼的同時讓瀏覽器的爬蟲和機器很好地解析。
8.清除浮動有哪些方式?比較好的方式是哪一種?
第二部分:JS
1.js的基本資料型別?
null 、undefined、boolean、string、number
2.js有哪些內建物件?
資料封裝類物件:Object、Array、Boolean、Number 和 String
其他物件:Function、Arguments、Math、Date、RegExp、Error
3.js中的this、call和apply
-
純函式呼叫,this指向全域性物件global
-
作為物件方法的呼叫:指向呼叫他的物件
-
作為建構函式呼叫,指向新物件
自己做的總結:連結
4.eval是做什麼的?
-
把對應的字串解析成JS程式碼並執行。 alert(eval(`2`+`2`)) //alert(4)
應該避免使用eval,不安全,非常耗效能(2次,一次解析成js語句,一次執行)。
-
JSON字串轉換為JSON物件的時候可以用eval,var obj =eval(`(`+ str +`)`)。
5.null和undefined的區別?
null是一個表示”無”的物件,轉為數值時為0;undefined是一個表示”無”的原始值,轉為數值時為NaN。
undefined:
(1)變數被宣告瞭,但沒有賦值時,就等於undefined。
(2) 呼叫函式時,應該提供的引數沒有提供,該引數等於undefined。
(3)物件沒有賦值的屬性,該屬性的值為undefined。
(4)函式沒有返回值時,預設返回undefined。
null:
(1) 作為函式的引數,表示該函式的引數不是物件。
(2) 作為物件原型鏈的終點。
6.new操作符具體幹了什麼呢?
(1)建立一個空物件,並且 this 變數引用該物件,同時還繼承了該函式的原型。
(2)屬性和方法被加入到 this 引用的物件中。
(3)新建立的物件由 this 所引用,並且最後隱式的返回 this 。
7.JSON 的瞭解?
JSON(JavaScript Object Notation) 是一種輕量級的資料交換格式。它是基於JavaScript的一個子集。資料格式簡單, 易於讀寫, 佔用頻寬小。
格式:採用鍵值對,例如:{`age`:`12`, `name`:`back`}