web前端-經典面試整理（持續更新）【分類】

瀏覽器相關

瀏覽器最大並發量限制是多少個？及如何去突破這個限制？

瀏覽器最大並發量限制

瀏覽器的並發連接數是有限的，一般是4到6個，在10個以內。

如果你的網站打開加載的資源過多，一般可以用按需加載，分步延時加載等機制，但如果需要同時加載，我們可以把資源分布到不同的域名下。缺點是需要DNS解析更多的域名。

因為瀏覽器並發連接數限制是針對於同一個域名的。這樣就實現了並發量的限制，例如一個域名的並發量是10，那么兩個域名的並發量就是20。

在火狐瀏覽器中輸入about:config，然后 輸入network.http.max可以看到個服務器的最大持久連接

network.http.max-persistent-connections-per-server // 6

其它說明：針對瀏覽器最大並發量有限制，還有一個原因是HTTP/1.1的Keep alive，keep alive技術的存在使得瀏覽器復用現有連接和服務器通信比創建新連接的性能要更好一些。

什么是Keep-Alive模式？

我們知道HTTP協議采用“請求-應答”模式，當使用普通模式，即非KeepAlive模式時，每個請求/應答客戶和服務器都要新建一個連接，完成之后立即斷開連接（HTTP協議為無連接的協議）；當使用Keep-Alive模式（又稱持久連接、連接重用）時，Keep-Alive功能使客戶端到服務器端的連接持續有效，當出現對服務器的后繼請求時，Keep-Alive功能避免了建立或者重新建立連接。

http 1.0中默認是關閉的，需要在http頭加入"Connection: Keep-Alive"，才能啟用Keep-Alive；http 1.1中默認啟用Keep-Alive，如果加入"Connection: close "，才關閉。目前大部分瀏覽器都是用http1.1協議，也就是說默認都會發起Keep-Alive的連接請求了，所以是否能完成一個完整的Keep-Alive連接就看服務器設置情況。

其它參考：

• 瀏覽器允許的並發請求資源數是什么意思？
• HTTP Keep-Alive模式

JavaScript

數組去重的方法有哪些？

方法一：for...of + Object

利用對象的屬性不能相同的特點進行去重，代碼如下：

function distinct(a, b) {
    let arr = a.concat(b)
    let result = []
    let obj = {}

    for (let i of arr) {
        if (!obj[i]) {
            result.push(i)
            obj[i] = 1
        }
    }

    return result
}

方法二：ES6的new Set()

Set數據結構，它類似於數組，其成員的值都是唯一的。

利用Array.from將Set結構轉換成數組。

function distinct(a, b) {
    return Array.from(new Set([...a, ...b]))
}

更多方法可參考：《JS實現數組去重方法整理》

怎樣判斷一個對象是否為數組？

let temporaryArray3 = [1,2,1,2,3];
console.log(temporaryArray3 instanceof Array);
console.log(temporaryArray3.constructor == Array);
console.log(Array.isArray(temporaryArray3));
console.log(Object.prototype.toString.call(temporaryArray3) === "[object Array]");

怎樣判斷一個對象是否為空？

方法一：將json對象轉化成json字符串，然后進行判斷是否等於字符串'{}'

let isObject = {};
console.log(JSON.stringify(isObject) === '{}');  // true

方法二：使用for...in，若不為空，則返回false

let isObject = {};
function isEmptyObject(obj) {
    for(let key in obj) {
        return false;
    }
    return true;
}
console.log(isEmptyObject(isObject)); // true

方法三：使用Object.keys()來判斷，返回的是一個數組，根據數組長度來判斷

function isEmptyObject2(obj) {
    return Object.keys(obj).length == 0;
}
console.log(isEmptyObject2(isObject));

方法四：對這個對象中一定存在的屬性進行判斷

console.log(isObject.id == null);

 

其它

開發中遇到最大的難題是什么及如何去解決的？

答案：略