19年面試總結

1.懶加載，預加載的實現

　　懶加載：

　　　　原理：使用一張loding圖片做爲佔位圖，噹噹前須要加載的圖片在可視區時等原圖加載完成替換loding圖片

　　預加載：

　　　　原理：使用一張低清晰度小圖頂住原圖片位置，待原圖片下載完成替換成高清原圖

2.前端優化方案

　　1. js/css等使用不一樣地址cdn分發，單個有速度限制

　　2. js/css壓縮/合併/混淆

　　3. 按需加載

　　4.合理利用sync/defer(sync沒法肯定順序異步加載，defer等頁面完成後順序加載css/js)

3.小程序的登陸

　　1.前端使用wx.login 獲取code 

　　2.經過wx.requer將請求回來的code傳遞給後臺

　　3.後臺經過將code和appid，appsecret組合加密後向微信請求open_id  和sesstion_key 

　　4.後臺接收後處理返回給前端，前端存儲在緩存中

　　5.之後每次請求將返回的密鑰附帶提交給後端

4.vue 和react 的異同

　　相同點：都推崇組件開發

　　　　　　只關注視圖部分

　　　　　　都有配套的全家桶

　　　　　　均可以使用構建工具快速構建項目

　　　　　　都有props想子組件傳遞數據的概念

　　差別： vue推崇使用模板語法  react使用jsx語法

　　　　　 vue是數據雙向綁定     react是單向數據流

　　　　　vue的是mvvm              react是mvc

　　　　　　

5.小程序跟vue 對比異同

6.做用域/閉包

　　做用域（即上下文）

　　　　做用域分爲兩種

　　　　　　1.全局做用域（window） 整個程序中均可以訪問到

　　　　　　2.局部做用域 局部做用域能訪問全局做用域，全局做用域訪問局部做用域報錯

　　閉包  是可以讀取其餘函數內部變量的函數

　function closure(){

            let test = 10 ;

            return function(){

                return test++;

            }

        }    

        // 調用函數(該函數調用後由於在返回函數中有test的引用全部計數器並不爲0 因此並未釋放空間)
        let test  = closure();

        // 第一次調用
        test(); // 11

        // 第二次調用
        test(); //12

        // 若並未賦值給變量直接使用則每次使用完後釋放空間
        closure()(); // 11

        closure()(); //11

 

8.cookie,sessionStorage,localStorage區別

　　1.cookie（大小限制4K，且每次提交cookie都會攜帶給後臺）

　　2.sessionStorage  窗口關閉時 緩存數據清空

　　3.localStorage  當前瀏覽器永久緩存（大小比較大5M）

　　　　3.1 在隱私模式下沒法讀取

　　　　3.2 字符串類型

　　　　3.3 佔用內存大小過多頁面容易變卡

　　　　3.4不能被爬蟲抓取