Web前端經典面試試題（二）

上次因爲時間有限只分享了一部分的前端面試題，因此本篇繼續分享前端經典面試試題

一. 棧和隊列的區別?

棧的插入和刪除操做都是在一端進行的，而隊列的操做倒是在兩端進行的。
隊列先進先出，棧先進後出。
棧只容許在表尾一端進行插入和刪除，而隊列只容許在表尾一端進行插入，在表頭一端進行刪除。

二. http 和 https 有何區別？如何靈活使用？

a. http是HTTP協議運行在TCP之上。全部傳輸的內容都是明文，客戶端和服務器端都沒法驗證對方的身份。
b. https是HTTP運行在SSL/TLS之上，SSL/TLS運行在TCP之上。全部傳輸的內容都通過加密，加密採用對
   稱加密，但對稱加密的密鑰用服務器方的證書進行了非對稱加密。此外客戶端能夠驗證服務器端的身
   份，若是配置了客戶端驗證，服務器方也能夠驗證客戶端的身份

三. 請你談談Cookie的弊端

cookie雖然在持久保存客戶端數據提供了方便，分擔了服務器存儲的負擔，但仍是有不少侷限性的。 第一：每一個特定的域名下最多生成20個cookie

1.IE6或更低版本最多20個cookie
2.IE7和以後的版本最後能夠有50個cookie。
3.Firefox最多50個cookie
4.chrome和Safari沒有作硬性限制
IE和Opera 會清理近期最少使用的cookie，Firefox會隨機清理cookie。

cookie的最大大約爲4096字節，爲了兼容性，通常不能超過4095字節。

IE 提供了一種存儲能夠持久化用戶數據，叫作userdata，從IE5.0就開始支持。每一個數據最多
128K，每一個域名下最多1M。這個持久化數據放在緩存中，若是緩存沒有清理，那麼會一直存在。

優勢：極高的擴展性和可用性
1.經過良好的編程，控制保存在cookie中的session對象的大小。
2.經過加密和安全傳輸技術（SSL），減小cookie被破解的可能性。
3.只在cookie中存放不敏感數據，即便被盜也不會有重大損失。
4.控制cookie的生命期，使之不會永遠有效。偷盜者極可能拿到一個過時的cookie。
缺點：
1.`Cookie`數量和長度的限制。每一個domain最多隻能有20條cookie，每一個cookie長度不能超過
4KB，不然會被截掉。
2.安全性問題。若是cookie被人攔截了，那人就能夠取得全部的session信息。即便加密也與事
無補，由於攔截者並不須要知道cookie的意義，他只要原樣轉發cookie就能夠達到目的了。
3.有些狀態不可能保存在客戶端。例如，爲了防止重複提交表單，咱們須要在服務器端保存一個
計數器。若是

四. position:absolute和float屬性的異同

共同點：對內聯元素設置`float`和`absolute`屬性，可讓元素脫離文檔流，而且能夠設置其
寬高。
不一樣點：float仍會佔據位置，position會覆蓋文檔流中的其餘元素。

五. CSS 選擇符有哪些？哪些屬性能夠繼承？優先級算法如何計算？

1.id選擇器（ # myid）
2.類選擇器（.myclassname）
3.標籤選擇器（div, h1, p）
4.相鄰選擇器（h1 + p）
5.子選擇器（ul > li）
6.後代選擇器（li a）
7.通配符選擇器（ * ）
8.屬性選擇器（a[rel = "external"]）
9.僞類選擇器（a: hover, li:nth-child）

可繼承的樣式： font-size font-family color, text-indent;
不可繼承的樣式：border padding margin width height ;
優先級就近原則，同權重狀況下樣式定義最近者爲準;
載入樣式以最後載入的定位爲準;

優先級爲:
!important >  id > class > tag  
important 比 內聯優先級高,但內聯比 id 要高

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

（1）link屬於XHTML標籤，除了加載CSS外，還能用於定義RSS,定義rel鏈接屬性等做用；而
@import是CSS提供的，只能用於加載CSS;
（2）頁面被加載的時，link會同時被加載，而@import引用的CSS會等到頁面被加載完再加載;
（3）import是CSS2.1 提出的，只在IE5以上才能被識別，而link是XHTML標籤，無兼容問題;

七. 常見的瀏覽器內核有哪些？

Trident內核：IE,MaxThon,TT,The World,360,搜狗瀏覽器等。[又稱MSHTML]
Gecko內核：Netscape6及以上版本，FF,MozillaSuite/SeaMonkey等
Presto內核：Opera7及以上。      [Opera內核原爲：Presto，現爲：Blink;]
Webkit內核：Safari,Chrome等。   [ Chrome的：Blink（WebKit的分支）]

八. 爲何要初始化CSS樣式。

由於瀏覽器的兼容問題，不一樣瀏覽器對有些標籤的默認值是不一樣的，若是沒對CSS初始化每每會
出現瀏覽器之間的頁面顯示差別。
固然，初始化樣式會對SEO有必定的影響，但魚和熊掌不可兼得，但力求影響最小的狀況下初始
化。

九. js有哪些內置對象？

Object 是 JavaScript 中全部對象的父對象

數據封裝類對象：Object、Array、Boolean、Number 和 String
其餘對象：Function、Arguments、Math、Date、RegExp、Error

十. Javascript做用鏈域?

全局函數沒法查看局部函數的內部細節，但局部函數能夠查看其上層的函數細節，直至全局細
節。當須要從局部函數查找某一屬性或方法時，若是當前做用域沒有找到，就會上溯到上層做
用域查找，直至全局函數，這種組織形式就是做用域鏈。

十一. JSON 的瞭解？

JSON(JavaScript Object Notation) 是一種輕量級的數據交換格式。
它是基於JavaScript的一個子集。數據格式簡單, 易於讀寫, 佔用帶寬小
如：{"age":"12", "name":"back"}

JSON字符串轉換爲JSON對象:
var obj =eval('('+ str +')');
var obj = str.parseJSON();
var obj = JSON.parse(str);

JSON對象轉換爲JSON字符串：
var last=obj.toJSONString();
var last=JSON.stringify(obj);

十二.同步和異步的區別?

同步的概念應該是來自於OS中關於同步的概念:不一樣進程爲協同完成某項工做而在前後次序上調
整(經過阻塞,喚醒等方式).同步強調的是順序性.誰先誰後.異步則不存在這種順序性.

同步：瀏覽器訪問服務器請求，用戶看獲得頁面刷新，從新發請求,等請求完，頁面刷新，新內
容出現，用戶看到新內容,進行下一步操做。

異步：瀏覽器訪問服務器請求，用戶正常操做，瀏覽器後端進行請求。等請求完，頁面不刷新，
新內容也會出現，用戶看到新內容。
（待完善）

十三.position的值， relative和absolute分別是相對於誰進行定位的？

absolute :生成絕對定位的元素， 相對於最近一級的 定位不是 static 的父元素來進行定位。
fixed （老IE不支持）生成絕對定位的元素，一般相對於瀏覽器窗口或 frame 進行定位。
relative 生成相對定位的元素，相對於其在普通流中的位置進行定位。
static 默認值。沒有定位，元素出如今正常的流中
sticky 生成粘性定位的元素，容器的位置根據正常文檔流計算得出

十四. 異步加載和延遲加載

1. 異步加載的方案： 動態插入 script 標籤
2. 經過 ajax 去獲取 js 代碼，而後經過 eval 執行
3. script 標籤上添加 defer 或者 async 屬性
4. 建立並插入 iframe，讓它異步執行 js
5. 延遲加載：有些 js 代碼並非頁面初始化的時候就馬上須要的，而稍後的某些狀況才須要的