刷前端面經筆記（九）

1.JavaScript實現二分法查找？

二分法查找，也稱折半查找，是一種在有序數組中查找特定元素的搜索算法。 查找過程能夠分爲如下步驟： （1）首先，從有序數組的中間的元素開始搜索， 若是該元素正好是目標元素（即要查找的元素），則搜索過程結束，不然進行下一步。 （2）若是目標元素大於或者小於中間元素， 則在數組大於或小於中間元素的那一半區域查找，而後重複第一步的操做。 （3）若是某一步數組爲空，則表示找不到目標元素。 代碼:

// 非遞歸算法
 function binary_search(arr, key) {
   var low = 0,
   high = arr.length - 1;
   while(low <= high){
        var mid = parseInt((high + low) / 2);
        if(key == arr[mid]){
            return  mid;
        }else if(key > arr[mid]){
            low = mid + 1;
        }else if(key < arr[mid]){
            high = mid -1;
        }
    }
    return -1
};

 var arr = [1,2,3,4,5,6,7,8,9,10,11,23,44,86];
 var result = binary_search(arr,10);
 alert(result); // 9 返回目標元素的索引值

 // 遞歸算法
 function binary_search(arr,low, high, key) {
     if (low > high){
       return -1;
        }
     var mid = parseInt((high + low) / 2);
      if(arr[mid] == key){
        return mid;
     }else if (arr[mid] > key){
        high = mid - 1;
        return binary_search(arr, low, high, key);
     }else if (arr[mid] < key){
        low = mid + 1;
        return binary_search(arr, low, high, key);
     }
};

 var arr = [1,2,3,4,5,6,7,8,9,10,11,23,44,86];
 var result = binary_search(arr, 0, 13, 10);
 alert(result); // 9 返回目標元素的索引值
複製代碼

2.有一樓梯共M級，剛開始時你在第一級，若每次只能跨上一級或二級，要走上第M級，共有多少種走法？

這個問題要倒過來看，要到達n級樓梯，只有兩種方式，從（n-1）級 或 （n-2）級到達的。 因此能夠用遞推的思想去想這題，假設有一個數組s[n], 那麼s[1] = 1（因爲一開始就在第一級，只有一種方法），s[2] = 1（只能從s[1]上去 沒有其餘方法）。 那麼就能夠推出s[3] ~ s[n]了。 下面繼續模擬一下，s[3] = s[1] + s[2]， 由於只能從第一級跨兩步， 或者第二級跨一步。

function cStairs(n) {
    if(n === 1 || n === 2) {
        return 1;
    } else {
        return cStairs(n-1) + cStairs(n-2)
    }
}
複製代碼

3.遞歸設計。 實現一個函數，給該函數一個DOM節點，函數訪問其全部子元素(全部子元素，不只僅是直接子元素)，每次訪問子元素的時候，併爲其傳一個callback?

//訪問一個DOM tree，是一個經典的深度優先搜索的算法

function Traverse(DOM,callback) {
    callback(DOM);
    var list = DOM.children;
    Array.prototype.forEach.apply(list,(item)=>{
        Traverse(item,callback); //遞歸
    })
}
複製代碼

4.介紹一下對webpack的認識？

WebPack是一個模塊打包工具，可使用WebPack管理模塊依賴，並編繹輸出模塊們所需的靜態文件。 它可以很好地管理、打包Web開發中所用到的HTML、javaScript、CSS以及各類靜態文件（圖片、字體等），讓開發過程更加高效。 對於不一樣類型的資源，webpack 有對應的模塊加載器。webpack模塊打包器會分析模塊間的依賴關係，最後 生成了優化且合併後的靜態資源。 webpack的兩大特點： 1）code splitting（能夠自動完成） 2）loader 能夠處理各類類型的靜態文件，而且支持串聯操做 webpack 是以commonJS的形式來書寫腳本，但對 AMD/CMD的支持也很全面，方便舊項目進行代碼遷移。 webpack具備requireJs和browserify的功能，但仍有不少本身的新特性： 1） 對CommonJS、 AMD 、ES6的語法作了兼容 2） 對js、css、圖片等資源文件都支持打包 3） 串聯式模塊加載器以及插件機制，讓其具備更好的靈活性和擴展性，例如提供對CoffeeScript、ES6的支持 4） 有獨立的配置文件webpack.config.js 5） 能夠將代碼切割成不一樣的chunk，實現按需加載，下降了初始化時間 6） 支持 SourceUrls 和 SourceMaps，易於調試 7） 具備強大的Plugin接口，大可能是內部插件，使用起來比較靈活 8）webpack 使用異步 IO並具備多級緩存。這使得 webpack 很快且在增量編譯上更加快

5.關於HTTP2.0的認識

HTTP/2引入了「服務端推（server push）」的概念，它容許服務端在客戶端須要數據以前就主動地將數據發送到客戶端緩存中，從而提升性能。 HTTP/2提供更多的加密支持，HTTP/2使用多路技術，容許多個消息在一個鏈接上同時交差。 它增長了頭壓縮（header compression），所以即便很是小的請求，其請求和響應的header都只會佔用很小比例的帶寬。

6.對AMD和Commonjs的理解?

CommonJS是服務器端模塊的規範，nodejs採用了這個規範。 CommonJS規範加載模塊是同步的，也就是說，只有加載完成，才能執行後面的操做。 AMD規範則是非同步加載模塊，容許指定回調函數。 AMD推薦的風格經過返回一個對象作爲模塊對象，CommonJS的風格經過對module.exports或exports的 屬性賦值來達到暴露模塊對象的目的。

7.mongoDB和MySQL的區別?

MySQL是傳統的關係型數據庫，MongoDB則是非關係型數據庫 mongodb以JSON結構（二進制）進行存儲，對海量數據存儲有着很明顯的優點。 對比傳統關係型數據庫,NoSQL有着很是顯著的性能和擴展性優點，與關係型數據庫相比，MongoDB的優勢有： ①弱一致性（最終一致），更能保證用戶的訪問速度： ②文檔結構的存儲方式，可以更便捷的獲取數據。

8.講講304緩存的原理?

服務器首先產生ETag，服務器可在稍後使用它來判斷頁面是否已經被修改。 本質上，客戶端經過將該記號傳回服務器，要求服務器驗證其（客戶端）緩存。 304是HTTP狀態碼，服務器用來標識這個文件沒修改，不返回內容，瀏覽器在接收到個狀態碼後，會使用瀏覽器已緩存的文件。 客戶端請求一個頁面A。 服務器返回頁面A，並在給A加上一個ETag。 客戶端展示該頁面，並將頁面連同ETag一塊兒緩存。 客戶再次請求頁面A，並將上次請求時服務器返回的ETag一塊兒傳遞給服務器。 服務器檢查該ETag，並判斷出該頁面自上次客戶端請求以後還未被修改，直接返回響應304（未修改——Not Modified）和一個空的響應體。

9.用node模擬客戶端發起請求?

var http = require("http");
var request = http.request({
    host:"localhost",
    port:"8080",
    path:"/request",
    method:"post"
},function(res){
    res.on("data",function(chunk){
        console.log(chunk.toString());
    });
});
request.write("user=zhang&pass=111");
request.end("請求結束");//結束本次請求
複製代碼

10.CommonJS 中的 require/exports 和 ES6 中的 import/export 區別？

CommonJS模塊的重要特性是加載時執行，即腳本代碼在 require的時候，就會所有執行。 一旦出現某個模塊被」循環加載」，就只輸出已經執行的部分，還未執行的部分不會輸出。 ES6 模塊是動態引用，若是使用 import 從一個模塊加載變量，那些變量不會被緩存，而是成爲一個指向被加載模塊的引用，須要開發者本身保證，真正取值的時候可以取到值。 import/export 最終都是編譯爲require/exports 來執行的。 CommonJS 規範規定，每一個模塊內部，module 變量表明當前模塊。 這個變量是一個對象，它的 exports屬性（即module.exports）是對外的接口。 加載某個模塊，實際上是加載該模塊的module.exports屬性。 export 命令規定的是對外的接口，必須與模塊內部的變量創建一一對應關係。