撩課-Web大前端天天5道面試題-Day12

1. 請寫出至少5個html5新增的標籤，並說明其語義和應用場景？

section：定義文檔中的一個章節;

nav：定義只包含導航連接的章節;
header：定義頁面或章節的頭部;
它常常包含 logo、頁面標題和導航性的目錄。

footer：定義頁面或章節的尾部;
它常常包含版權信息、法律信息連接和反饋建議用的地址。

aside：定義和頁面內容關聯度較低的內容，
若是被刪除，剩下的內容仍然很合理。

複製代碼

2. get和post請求在緩存方面的區別？

get請求相似於查找的過程，用戶獲取數據，
能夠不用每次都與數據庫鏈接，因此可使用緩存。

post不一樣，post作的通常是修改和刪除的工做，
因此必須與數據庫交互，因此不能使用緩存。

所以get請求適合於請求緩存。
複製代碼

3. 如何解決異步回調地獄?

promise、generator、async/await
複製代碼

4. 圖片的懶加載和預加載?

預加載：提早加載圖片，
當用戶須要查看時可直接
從本地緩存中渲染。

懶加載：懶加載的主要目的
是做爲服務器前端的優化，
減小請求數或延遲請求數。

兩種技術的本質：
二者的行爲是相反的，
一個是提早加載，
一個是遲緩甚至不加載。

懶加載對服務器前端有必定
的緩解壓力做用，
預加載則會增長服務器前端壓力。
複製代碼

5. bind，apply，call的區別?

經過apply和call改變函數的this指向，
這兩個函數的第一個參數都是同樣的，
表示要改變指向的那個對象，
第二個參數，apply是數組，
而call則是arg1,arg2...這種形式。

經過bind改變this做用域
會返回一個新的函數，
這個函數不會立刻執行。

複製代碼

6. js怎麼控制一次加載一張圖片，加載完後再加載下一張？

方法一:
<script type="text/javascript">
var obj=new Image();
obj.src="http://www.itlike.com/21.jpg";
obj.onload=function(){
    document.getElementById("pic")
    .innnerHTML="<img src='"+this.src+"' />";
}
</script>
<div id="pic">加載中……</div>


方法二:
<script type="text/javascript">
var obj=new Image();
obj.src="http://www.itlike.com/21.jpg";
obj.onreadystatechange=function(){
   if(this.readyState=="complete"){
       document.getElementById("pic")
       .innnerHTML="<img src='"+this.src+"' />";
  }
} 
</script>
<div id="pic">加載中……</div>
複製代碼