刷面經筆記2019.02.09

1.ES6中的let，const，var的區別是什麼？

var：聲明全局常量；

let：聲明塊級常量，即局部常量，定之後能夠修改；

const：用於聲明常量，定義後不能再修改值或者引用值的常量，也具備塊級做用域；

2.對數組進行去重，es5或者es6方法

//es5四種方式:

//方式一:
Array.prototype.unique1 = function() {
    // 1. 定義數組
    var temp = [];
    // 2. 遍歷當前數組
    for(var i = 0; i < this.length; i++) {
        // 3.若是當前數組的第i已經保存進了臨時數組，
        // 那麼跳過,不然把當前項push到臨時數組裏面
        if (-1 === temp.indexOf(this[i])) {
            temp.push(this[i]);
        }
    }
    return temp;
};

//方式二:
Array.prototype.unique2 = function() {
    //1. hash爲hash表，r爲臨時數組
    var hash = {}, temp=[];
    // 2.遍歷當前數組
    for(var i = 0; i < this.length; i++)
    {
        // 3. 若是hash表中沒有當前項
        if (!hash[this[i]])
        {
            // 4.存入hash表
            hash[this[i]] = true;
            // 5.把當前數組的當前項
            // push到臨時數組裏面
            temp.push(this[i]);
        }
    }
    return temp;
};

//方式三:
Array.prototype.unique3 = function() {
    var n = [this[0]];
    for(var i = 1; i < this.length; i++){
        if (this.indexOf(this[i]) === i) {
            n.push(this[i]);
        }
    }
    return n;
};

//方式四:
Array.prototype.unique4 = function() {
    this.sort();
    var re=[this[0]];
    for(var i = 1; i < this.length; i++)
    {
        if( this[i] !== re[re.length-1])
        {
            re.push(this[i]);
        }
    }
    return re;
};

//es6實現方式:

Array.prototype.unique =
Array.prototype.unique 
|| function () {
    return [...new Set(this)];
};

 

3.頁面加載過程當中可能觸發哪些事件？它們的順序是？

頁面加載時，大體能夠分爲如下幾個步驟：

1）開始解析HTML文檔結構

2）加載外部樣式表及JavaScript腳本

3）解析執行JavaScript腳本

4）DOM樹渲染完成

5）加載未完成的外部資源（如 圖片）

6）頁面加載成功

執行順序：
1）document readystatechange事件

2）document DOMContentLoaded事件

3）window load事件

 

4.什麼是CDN，CDN對於網絡有什麼意義，它有什麼的缺點？

CDN又稱爲內容分發網絡；本意在於儘量避開互聯網上有可能影響數據傳輸速度和穩定性的瓶頸和環節，使內容傳輸的更快、更穩定。

主要目的：解決因分佈、帶寬、服務器性能帶來的訪問延遲問題，適用於站點的加速、點播、直播等場景。使用戶就近取得所需內容，解決Internet網絡擁擠的情況，提升用戶訪問網站的響應速度和成功率。

缺點：1）實施複雜，投資大

2）目前大部分的CDN還只是對靜態的內容加速，對動態加速效果很差；而雙線對動態加速的效果跟靜態是同樣的。

 

5.vue-router中$route和$router的區別？

1）$route爲當前router跳轉對象裏面能夠獲取name、path、query、params等

2）$router爲VueRouter實例，想要導航到不一樣URL，則使用$router.push方法

返回上一個history也是使用$router.go方法

 

6.vue路由傳參query與params兩種方式的區別

query要用path來引入,例如ths.$router.push({ path:"detail",query:{id:"00"}})，接收參數爲this.$route.query.id，params要用name來引入，例如ths.$router.push({ name:"detail",params:{id:"00"}})，接收參數爲this.$route.params.id。以query傳輸的參數會在相似於get傳參，在瀏覽器地址欄中顯示參數。