整理的一些常见问题
1、 什么是閉包？閉包有什么作用？
var a=1; function (){a++;return a; }復(fù)制代碼一個(gè)變量，一個(gè)函數(shù)，在函數(shù)里可以訪問(wèn)到變量，這就叫閉包，即如果一個(gè)函數(shù)引用了除了它自身內(nèi)部變量外的變量，這個(gè)外部變量和這個(gè)函數(shù)就形成了一個(gè)閉包。
閉包的作用：
從外部讀取函數(shù)內(nèi)部變量，讓這些變量始終保持在內(nèi)存中：
閉包使內(nèi)部變量記住上一次的運(yùn)算結(jié)果，不會(huì)因?yàn)闆](méi)有被直接引用而被瀏覽器的垃圾回收機(jī)制回收。
同時(shí)閉包也可以用來(lái)封裝對(duì)象的私有屬性和方法：
function fn1(n){return function fn2(){return n++;} } var fn3=fn1(1); fn3()//1 var fn4=fn1(2); fn4()//2 //fn3和fn4互不影響，各自返回不同的數(shù)值復(fù)制代碼2、call、apply、bind 的用法分別是什么？
相同點(diǎn)：
接受的第一個(gè)參數(shù)都是this，都能改變this 的指向。
區(qū)別：
call可以接受第二個(gè)，第三個(gè)，第N個(gè)參數(shù)，apply接受的第二個(gè)參數(shù)是一個(gè)數(shù)組，bind和call可以接受的參數(shù)一樣，但是bind的返回值是一個(gè)函數(shù)，也就是就算傳參數(shù)進(jìn)去也不會(huì)立即執(zhí)行，還需要再次調(diào)用執(zhí)行一次函數(shù)才算真正的執(zhí)行。
3、幾個(gè)常用的HTTP狀態(tài)碼
狀態(tài)碼200表示請(qǐng)求成功
狀態(tài)碼202表示服務(wù)器成功接收請(qǐng)求
狀態(tài)碼301表示被請(qǐng)求的資源已經(jīng)永久移動(dòng)到新位置
狀態(tài)碼302表示被請(qǐng)求的資源暫時(shí)不可以訪問(wèn)，以后可以再訪問(wèn)
狀態(tài)碼400表示請(qǐng)求報(bào)文中存在語(yǔ)法錯(cuò)誤
狀態(tài)碼404表示請(qǐng)求失敗，請(qǐng)求所希望得到的資源沒(méi)有在服務(wù)器上找到
狀態(tài)碼500表示服務(wù)器錯(cuò)誤
狀態(tài)碼502表示作為網(wǎng)關(guān)或代理工作的服務(wù)器嘗試執(zhí)行請(qǐng)求時(shí)，從上游服務(wù)器得到無(wú)效的響應(yīng)
4、寫出一個(gè)http請(qǐng)求和響應(yīng)
HTTP請(qǐng)求常見格式,分為四部分：
第一部分：請(qǐng)求方式（get/post）? 路徑（/path）? 協(xié)議/版本號(hào)（HTTP/1.1）
第二部分：鍵值對(duì)（key:value）
第三部分：回車符
第四部分：請(qǐng)求的數(shù)據(jù)
1 POST /path HTTP/1.1 2 Host:www.baidu.com 2 Content-Length: 24 2 Content-Type: application/x-www-form-urlencoded 3 4 username=ff&password=123復(fù)制代碼HTTP響應(yīng)常見格式,分為四部分：
第一部分：協(xié)議/版本號(hào)（HTTP/1.1） 狀態(tài)碼? ?狀態(tài)碼解釋?
第二部分：鍵值對(duì)（key:value）
第三部分：回車符
第四部分：響應(yīng)數(shù)據(jù)（根據(jù)第二部分的Content-Type決定該部分的內(nèi)容格式）
1 HTTP/1.1 200 ok 2 Content-Length: 200 2 Content-Type: text/html 3 4 <html>...</html>復(fù)制代碼5、一個(gè)頁(yè)面從輸入 URL 到頁(yè)面加載顯示完成，這個(gè)過(guò)程中都發(fā)生了什么？
5-1.DNS解析：瀏覽器根據(jù)URL中的域名查找對(duì)應(yīng)的IP地址。
5-2.TCP連接：瀏覽器根據(jù)IP地址向服務(wù)器發(fā)起TCP連接，產(chǎn)生三次握手：
（1）瀏覽器向服務(wù)器發(fā)起連接請(qǐng)求
（2）服務(wù)器接到請(qǐng)求，回復(fù)同意連接
（3）瀏覽器接到服務(wù)器返回的確認(rèn)連接信息，再次確認(rèn)，正式建立連接。
5-3.發(fā)送http請(qǐng)求：建立連接后，瀏覽器發(fā)送http請(qǐng)求，包括請(qǐng)求行，請(qǐng)求頭，請(qǐng)求數(shù)據(jù)內(nèi)容
5-4.服務(wù)器處理請(qǐng)求并返回響應(yīng)內(nèi)容
5-5.瀏覽器渲染頁(yè)面：瀏覽器收到響應(yīng)開始解析渲染頁(yè)面，先解析html構(gòu)建DOM樹，再解析? css構(gòu)建規(guī)則樹，根據(jù)樹然后繪制頁(yè)面。
5-6.關(guān)閉連接或者繼續(xù)保持連接
6、如何實(shí)現(xiàn)數(shù)組去重？
假設(shè)有數(shù)組 array = [1,5,2,3,4,2,3,1,3,4]
你要寫一個(gè)函數(shù) unique，使得
unique(array) 的值為 [1,5,2,3,4]
也就是把重復(fù)的值都去掉，只保留不重復(fù)的值。
要求：
ES5：
var array = [1,5,2,3,4,2,3,1,3,4]; function unique(arr){var newArray = [];var hasharr={};for (var i = 0; i < arr.length; i++) {if (hasharr[arr[i] ]===undefined) {newArray.push(arr[i]);hasharr[arr[i]]=1;}}return newArray; } unique(array); 復(fù)制代碼ES6：
var array = [1,5,2,3,4,2,3,1,3,4]; function unique(arr){return Array.from(new Set(arr)); } unique(array);復(fù)制代碼7、JSON 和 JavaScript 是什么關(guān)系？JSON 和 JavaScript 的區(qū)別有哪些？
關(guān)系：JSON 是一門借鑒 JavaScript 的語(yǔ)言，同時(shí)也是一種數(shù)據(jù)交互格式，JSON 是 JavaScript 的子集（或者說(shuō) JSON 只借鑒了一部分 JavaScript 語(yǔ)法，而且沒(méi)有新增任何原創(chuàng)的語(yǔ)法）
區(qū)別：JSON 不支持函數(shù)、undefined、變量、引用、單引號(hào)字符串、對(duì)象的key不支持單引號(hào)也不支持不加引號(hào)、沒(méi)有內(nèi)置的 Date、Math、RegExp 等。
而 JavaScript 全都支持。
8、什么是 JSONP？
JSONP是一種跨域請(qǐng)求數(shù)據(jù)方式，原理是動(dòng)態(tài)創(chuàng)建script標(biāo)簽，利用script發(fā)送請(qǐng)求不受同源策略限制的特性，實(shí)現(xiàn)的過(guò)程是：
1.請(qǐng)求方即瀏覽器在頁(yè)面創(chuàng)建一個(gè)script標(biāo)簽指向響應(yīng)地址，同時(shí)傳遞一個(gè)查詢參數(shù)callback=函數(shù)名，這個(gè)函數(shù)里可以自己定義處理參數(shù)的過(guò)程
2.響應(yīng)方根據(jù)前端頁(yè)面?zhèn)鬟^(guò)來(lái)的查詢參數(shù)，創(chuàng)建一個(gè)形如：函數(shù)名.call('undefined',{key:value,key:value,......})或者 函數(shù)名({key:value,key:value,......})這樣的響應(yīng)
3.瀏覽器收到響應(yīng)，調(diào)用函數(shù)，按照自己定義的方式來(lái)處理接收到的數(shù)據(jù)
9、JSONP 為什么不支持 POST
因?yàn)镴SONP的使用原理是動(dòng)態(tài)創(chuàng)建script標(biāo)簽,利用script發(fā)送請(qǐng)求不受同源策略限制的特性來(lái)實(shí)現(xiàn)跨域請(qǐng)求數(shù)據(jù)，而動(dòng)態(tài)創(chuàng)建的script標(biāo)簽只能發(fā)送get請(qǐng)求，不支持post。
10、有哪些可以發(fā)請(qǐng)求的標(biāo)簽？
form可以發(fā)post和get請(qǐng)求，會(huì)刷新或新打開頁(yè)面 。a只能發(fā)get，會(huì)刷新或新打開頁(yè)面。 img只能發(fā)get，只能以圖片形式顯示。 link只能發(fā)get，必須放在頁(yè)面里才能發(fā)，只能以css或者favicon形式展示 。script只能發(fā)get，必須放在頁(yè)面里，但是只能以腳本的形式運(yùn)行。
11、什么是前端MVC？
Model(模型)-- View(視圖)--Controller(控制器)
MVC 就是一種有規(guī)律的代碼規(guī)范，把代碼按照三層的結(jié)構(gòu)進(jìn)行梳理，更清晰易懂，具體就是：
Model 數(shù)據(jù)管理，包括數(shù)據(jù)邏輯、數(shù)據(jù)請(qǐng)求、數(shù)據(jù)存儲(chǔ)等功能。前端 Model 主要負(fù)責(zé) AJAX 請(qǐng)求或者 LocalStorage 存儲(chǔ)
View 負(fù)責(zé)用戶界面，前端 View 主要負(fù)責(zé) HTML 渲染。
Controller 負(fù)責(zé)處理 View 的事件，并更新 Model；也負(fù)責(zé)監(jiān)聽 Model 的變化，并更新 View，Controller 控制其他的所有流程。
流程：
用戶在視圖層進(jìn)行操作，然后控制器監(jiān)聽到視圖層的操作，向模型層請(qǐng)求調(diào)用數(shù)據(jù)，模型層收到請(qǐng)求向服務(wù)器發(fā)出請(qǐng)求調(diào)用數(shù)據(jù)，服務(wù)器把數(shù)據(jù)響應(yīng)給模型層，模型層再把數(shù)據(jù)返回給控制器，控制器更新視圖層數(shù)據(jù)。
12、在 ES5 中如何用函數(shù)模擬一個(gè)類？
function Person(options){// 此處可以添加不同的私有屬性this.name=namethis.age=age... } // 此處設(shè)置Person類的公有屬性 Person.prototype.walk=function(){console.log('walk')} Person.prototype.gender="woman"var person1=new Person({name:'hi',age:'18'})復(fù)制代碼13、怎樣使用Promise？
window.myFunction=function(options){return new Promise(function(resolve,reject){if(success){resolve.call(this,responseText)}else{reject.call(this,errorText)}}) }window.myFunction(options).then((responseText)=>console.log(responseText),//resolve(errorText)=>console.log(errorText)//reject )復(fù)制代碼14、請(qǐng)使用原生 JS 寫出一個(gè) AJAX 請(qǐng)求（代碼中必須出現(xiàn) XMLHttpRequest）
let request=new XMLHttpRequest(); request.open('GET','/path'); request.send(); request.onreadystatechange=function(){if(request.readyState===4){if(request.status>=200&&request.status<300){console.log('success');}else if(request.status>=400){console.log('failed');}} }復(fù)制代碼15、關(guān)于Cookie、Session和Localstorage
cookie和session的關(guān)系 ：一般來(lái)說(shuō)，session是基于cookie實(shí)現(xiàn)的??
cookie和Localstorage的區(qū)別 ：cookie每次都會(huì)被帶給服務(wù)器，帶給每個(gè)頁(yè)面，但是localstorage不會(huì)，跟http無(wú)關(guān)，只被存儲(chǔ)在本地 cookie一般最大4K左右，localstorage最大5MB 跟瀏覽器有關(guān)?
Localstorage和sessionStorage的區(qū)別 ：sessionStorage在用戶關(guān)閉頁(yè)面以后即Session（會(huì)話）結(jié)束以后就會(huì)失效，Localstorage只要用戶不主動(dòng)清理緩存就會(huì)永久有效?
expries和cache-control區(qū)別：expries是以前的用法，expires表示什么時(shí)候過(guò)期，cache-control表示過(guò)多久過(guò)期，expires表示的時(shí)間是用戶本地時(shí)間，如果用戶本地時(shí)間錯(cuò)亂就會(huì)出問(wèn)題，所以優(yōu)先使用cache-control?
ETAG和cache-control區(qū)別 ：cache-control直接不請(qǐng)求，ETAG請(qǐng)求但是不下載
總結(jié)
- 上一篇： Spring+ Spring cloud
- 下一篇： Shiro初识