1）get和post請求的區(qū)別
get的參數(shù)通過URL傳遞，post的參數(shù)是放在Request Body中俩滥。
get的參數(shù)通過URL是有長度限制的嘉蕾，post沒有。
get請求更危險霜旧，因?yàn)樗苯颖┞对赨RL上荆针。
get參數(shù)請求會完整的記錄在瀏覽器歷史記錄里面，而post請求參數(shù)不會被保留颁糟。
get請求只能進(jìn)行url編碼航背，而post請求支持多種編碼方式。
get請求瀏覽器會主動cache棱貌，post不會玖媚，除非手動設(shè)置。
總的來說婚脱，get和post本質(zhì)上就是TCP鏈接今魔，但是由于HTTP的規(guī)定和瀏覽器/服務(wù)器的限制，導(dǎo)致它們在應(yīng)用過程中體現(xiàn)出一些不同障贸。對于get方式的請求错森，瀏覽器會把http header和data一并發(fā)送出去，服務(wù)器響應(yīng)200篮洁，即返回?cái)?shù)據(jù)涩维，而對于post，瀏覽器先發(fā)送header袁波，服務(wù)器響應(yīng)100瓦阐，continue，瀏覽器在發(fā)送data篷牌，服務(wù)器響應(yīng)200睡蟋，即返回?cái)?shù)據(jù)。在網(wǎng)絡(luò)環(huán)境好的情況下枷颊，發(fā)一次包的時間和發(fā)兩次包的時間差別基本沒有戳杀，而在網(wǎng)絡(luò)環(huán)境差的情況下，兩次包的TCP在驗(yàn)證數(shù)據(jù)包完整性下夭苗，有非常大的優(yōu)點(diǎn)信卡。
2）http method有哪些
安全方法
HTTP定義了一組被稱為安全方法的方法。get方法和head方法都被認(rèn)為是安全的听诸，這就意味著使用ge或head方法的HTTP請求都不會產(chǎn)生動作坐求。安全方法并不一定什么動作都不執(zhí)行（由開發(fā)者決定）蚕泽，使用安全方法的目的是當(dāng)使用可能引發(fā)某一動作的不安全方法時晌梨，運(yùn)行HTTP應(yīng)用程序開發(fā)者通知用戶桥嗤。
get方法
通常用于請求服務(wù)器發(fā)送某個資源。
head方法
head方法與get方法的行為類似仔蝌，但服務(wù)器在響應(yīng)中只返回首部泛领。不會反回實(shí)體的主體部分。使用head敛惊，可以在不獲取資源的情況下渊鞋，了解資源的情況，通過查看響應(yīng)中的狀態(tài)碼瞧挤，看看某個對象是否存在锡宋，通過查看首部，測試是否被修改特恬，服務(wù)器開發(fā)者必須確保返回的首部與get請求返回的首部完全相同
put方法
與get方法從服務(wù)器讀取文檔相反执俩，put方法會向服務(wù)器寫入文檔。有些發(fā)布系統(tǒng)允許用戶創(chuàng)建web頁面癌刽，并用PUT直接將其安裝到web服務(wù)器上役首。
post方法
post方法起初是用來向服務(wù)器寫入數(shù)據(jù)的。實(shí)際通常會用它來支持HTML的表單显拜。表單中填好的數(shù)據(jù)通常會被發(fā)送給服務(wù)器衡奥，然后服務(wù)器將其發(fā)送到他要去的地方。
trace方法
trace方法只要用于診斷远荠，允許客戶端在最終將請求發(fā)送給服務(wù)器時矮固，看看他變成什么樣子。trance請求最終會在目的服務(wù)器發(fā)起一個回環(huán)診斷譬淳，行程最后一戰(zhàn)的服務(wù)器會回彈一條trance響應(yīng)乏屯，并在響應(yīng)主題中攜帶它收到的原始請求報(bào)文。這樣客戶端就可以查看在所有中間HTTP程序組成的響應(yīng)鏈上瘦赫，原始報(bào)文是否以及如何被毀壞或修改過辰晕。中間應(yīng)用程序會自行決定對trance請求的處理方式，trance請求不能帶有實(shí)體的主題部分确虱。trance響應(yīng)的實(shí)體主體部分包含了響應(yīng)服務(wù)器收到的請求精確副本含友。
option方法
option方法請求web服務(wù)器告知其支持的各種功能⌒１纾可以詢問服務(wù)器通常支持那些方法窘问，或者對某些特殊資源支持哪些方法。使用option方法的請求和響應(yīng)示例：
請求報(bào)文
OPTIONS http://www.cnivi.com.cn/ HTTP/1.1
Accept-Encoding: gzip,deflate
Host: www.cnivi.com.cn
Connection: Keep-Alive
User-Agent: Apache-HttpClient/4.1.1 (java 1.5)
響應(yīng)報(bào)文
HTTP/1.1 200 OK
Server: Apache-Coyote/1.1
Allow: GET, HEAD, POST, PUT, DELETE, TRACE, OPTIONS, PATCH
Content-Length: 0
Date: Thu, 09 Oct 2014 04:20:09 GMT
delete方法
delete方法所做的事情就是請服務(wù)器刪除請求URL所指定的資源宜咒。但是客戶端應(yīng)用程序無法保證刪除操作一定會執(zhí)行惠赫。因?yàn)镠TTP規(guī)范允許服務(wù)器在不通知客戶端的情況下撤銷請求。
lock方法
允許用戶鎖定資源故黑，比如可以再編輯某個資源時將其鎖定儿咱，以防別人同時對其進(jìn)行編輯庭砍。
mkcol方法
允許用戶創(chuàng)建資源
copy方法
便于用戶在服務(wù)器上復(fù)制資源
move方法
在服務(wù)器上移動資源
3）es6變量的解構(gòu)賦值
按照一定的模式，從數(shù)組和對象中提取值混埠，對變量進(jìn)行賦值怠缸，這就是解構(gòu)。
數(shù)組的解構(gòu)賦值
let[foo,[[bar],baz]]=[1,[[2],3]];foo // 1bar // 2baz // 3
注意钳宪，如果等號的右邊不是數(shù)組（或者嚴(yán)格地說揭北，不是可遍歷的結(jié)構(gòu)），那么將會報(bào)錯吏颖。
// 報(bào)錯let[foo]=1;let[foo]=false;let[foo]=NaN;let[foo]=undefined;let[foo]=null;let[foo]={};
注意搔体，ES6 內(nèi)部使用嚴(yán)格相等運(yùn)算符（===），判斷一個位置是否有值半醉。所以嫉柴，只有當(dāng)一個數(shù)組成員嚴(yán)格等于undefined，默認(rèn)值才會生效奉呛。
let[x=1]=[undefined];x // 1let[x=1]=[null];x // null
對象的解構(gòu)賦值
對象的解構(gòu)與數(shù)組有一個重要的不同计螺。數(shù)組的元素是按次序排列的，變量的取值由它的位置決定瞧壮；而對象的屬性沒有次序登馒，變量必須與屬性同名，才能取到正確的值咆槽。
let{bar,foo}={foo:"aaa",bar:"bbb"};foo // "aaa"bar // "bbb"let{baz}={foo:"aaa",bar:"bbb"};baz // undefined
字符串解構(gòu)賦值
字符串也可以解構(gòu)賦值陈轿。這是因?yàn)榇藭r，字符串被轉(zhuǎn)換成了一個類似數(shù)組的對象秦忿。
const [a, b, c, d, e]='hello';a // "h"b // "e"c // "l"d // "l"e // "o"
類似數(shù)組的對象都有一個length屬性麦射，因此還可以對這個屬性解構(gòu)賦值。
let {length: len}='hello';len // 5
數(shù)值和布爾型解構(gòu)賦值
解構(gòu)賦值時灯谣，如果等號右邊是數(shù)值和布爾值潜秋，則會先轉(zhuǎn)為對象。
let {toString: s}=123;s===Number.prototype.toString // truelet{toString:s}=true;s===Boolean.prototype.toString // true
解構(gòu)賦值的規(guī)則是胎许，只要等號右邊的值不是對象或數(shù)組峻呛，就先將其轉(zhuǎn)為對象。由于undefined和null無法轉(zhuǎn)為對象辜窑，所以對它們進(jìn)行解構(gòu)賦值钩述，都會報(bào)錯。
let{prop:x}=undefined; // TypeErrorlet{prop:y}=null; // TypeError
函數(shù)參數(shù)的解構(gòu)賦值
函數(shù)的參數(shù)也可以使用解構(gòu)賦值穆碎。
[[1,2],[3,4]].map(([a,b])=>a+b);// [ 3, 7 ]
function add([x, y]){? return x + y;}add([1, 2]); // 3
4）什么是閉包牙勘，閉包的作用是什么？
閉包就是能夠讀取其他函數(shù)內(nèi)部變量的函數(shù),另一個就是讓變量的值始終保持在內(nèi)存當(dāng)中所禀，不會因?yàn)楸徽{(diào)用后自動清除方面。
var f1 = function(){
? ? ? ? var a=1;
? ? ? ? return function f2(){
? ? ? ? ? ? a++;
? ? ? ? ? ? console.log(a);
? ? ? ? }
? ? }
? ? var b = f1();
? ? b();? ? ? ? ? ? // 2
? ? b();? ? ? ? ? ? // 3
5）客戶端存儲localstorage和sessionstorage的區(qū)別
localstorage的生命周期是永久放钦，sessionstorage生命周期為當(dāng)前窗口或者標(biāo)簽頁，一旦窗口或者標(biāo)簽頁被關(guān)閉了葡幸，那么通過sessionstorage存儲的數(shù)據(jù)也會被清空最筒。
6）JavaScript有哪幾種方法定義函數(shù)
函數(shù)有三種定義方法贺氓，函數(shù)定義語句蔚叨，函數(shù)直接量表達(dá)式和function()構(gòu)造函數(shù)。
函數(shù)定義語句
function sum(a, b){
? return a+b;
}
函數(shù)直接量表達(dá)式
//求階乘的函數(shù)
var factorial = function fact(x){? //將函數(shù)賦值給一個變量
? ? if(x<0) {return NaN;}
? ? else if(x===0) {return 1;}
? ? else
? ? return x*fact(x-1);? ? //遞歸函數(shù)
};
console.log(factorial(3));
function()構(gòu)造函數(shù)
var f =new Function("x","y","return x+y");//Function()構(gòu)造函數(shù)
var f =function(x, y){return x+y};
7）如何判斷一個對象是否為函數(shù)
調(diào)用object原聲方法不存在兼容問題辙培，可以用typeof蔑水，但是存在瀏覽器兼容問題。
Object.propotype.toString.call(object) === "[object Function]"
8）編寫JavaScript深度克隆函數(shù)
function clone(obj) {
? var o = obj instanceof Array ? [] : {};
? for(var k in obj)
? ? o[k] = typeof obj[k] === Object ? clone(obj[k]) : obj[k];
? return o;
}
var a = [[1, 2, 3], [4, 5, 6, 7]];
var b = clone(a);
console.log(b);
9）什么是虛擬dom扬蕊，為什么使用虛擬dom搀别？
? 可以看作使用JavaScript模擬了DOM結(jié)構(gòu)的樹形結(jié)構(gòu)，這個樹結(jié)構(gòu)包含整個DOM結(jié)構(gòu)的信息尾抑。VDOM將DOM的對比放在js層歇父，通過對比不同之處來選擇新渲染的DOM節(jié)點(diǎn)，從而提高渲染效率再愈。
10）jsonp的優(yōu)缺點(diǎn)
優(yōu)點(diǎn)：
jsonp可以跨越同源策略榜苫，兼容性很好，請求完畢后可以通過調(diào)用callback的方式回傳結(jié)果翎冲。
缺點(diǎn)：
支持get請求垂睬，只支持跨域http請求，在調(diào)用失敗的時候不會返回各種http狀態(tài)碼抗悍，不夠安全驹饺，存在頁面注入漏洞。
11）React組件的生命周期函數(shù)
一.初始化階段：
getDefaultProps：獲取實(shí)例的默認(rèn)屬性
getInitialState：獲取每個實(shí)例的初始狀態(tài)
componentWillMount：組件即將被裝載缴渊，渲染到頁面上
render：組件在這里生成虛擬dom節(jié)點(diǎn)
componentDidMount：組件在被裝載之后
二.運(yùn)行中：
componentWillReceiveProps：組件將要接收到屬性的時候調(diào)用
shouldComponentUpdate：組件在接收到新屬性或者新狀態(tài)的時候
componentWillUpdate：組件即將更新不能修改屬性和狀態(tài)
render：組件重新描繪
componentDidUpdate：組件已經(jīng)更新
三.銷毀階段：
componentWillUnmount：組件即將銷毀
12）es6數(shù)據(jù)類型
Number,String, Null, Undefined, Symbol, Boolean
13）什么是事件委托赏壹，有什么作用？
? 事件委托也叫事件代理,事件委托就是利用事件冒泡衔沼，只指定一個事件處理程序卡儒，就可以管理某一類型的所有事件。在js中俐巴，添加到頁面上的事件處理程序數(shù)量將直接關(guān)系到頁面整體運(yùn)行性能骨望，因?yàn)樾枰粩嗯cdom節(jié)點(diǎn)進(jìn)行交互，訪問dom的次數(shù)越多欣舵，引起瀏覽器重回與重排的次數(shù)也就越多擎鸠，就會延長整個頁面的交互就緒時間。缘圈，使用事件委托劣光，就會將所有的操作放到j(luò)s程序里面袜蚕，與dom的操作就只需一次，這樣就能大大的減少與dom的交互次數(shù)绢涡，提高性能牲剃。
14）什么是事件冒泡？如何阻止事件冒泡雄可？
事件冒泡就是從目標(biāo)對象到外層的順序觸發(fā)凿傅。
? ? 阻止事件的傳播：在W3C中，使用stopPropagation()方法数苫，在IE下設(shè)置cancelBubble = true聪舒；
阻止事件的默認(rèn)行為：在W3C中，使用preventDefault()方法虐急，在IE下設(shè)置window.event.returnValue = false箱残；
15）什么是async函數(shù)，有什么作用止吁？
async函數(shù)是Generator函數(shù)的語法糖被辑。async函數(shù)返回一個 Promise 對象，可以使用then方法添加回調(diào)函數(shù)敬惦。當(dāng)函數(shù)執(zhí)行的時候盼理，一旦遇到await就會先返回，等到異步操作完成仁热，再接著執(zhí)行函數(shù)體內(nèi)后面的語句榜揖。
16）HTML5的離線存儲怎么使用，工作原理能不能解釋一下抗蠢？
原理：HTML5的離線存儲是基于一個新建的.appcache文件的緩存機(jī)制举哟，通過這個文件上的解析清單離線存儲資源，這些資源就會像cookie一樣存儲下來迅矛。之后當(dāng)網(wǎng)絡(luò)處于離線狀態(tài)下時妨猩，瀏覽器會通過離線存儲的數(shù)據(jù)進(jìn)行頁面展示。
使用：在頁面頭像加入一個manifest的屬性秽褒，在cache.manifest文件的編寫離線存儲資源壶硅，在離線狀態(tài)時，操作window.applicationCache進(jìn)行需求實(shí)現(xiàn)
16）你是如何劃分react組件
通常是根據(jù)組件的指責(zé)來劃分為UI組件和容器組件销斟，UI組件復(fù)雜UI的呈現(xiàn)庐椒，容器組件負(fù)責(zé)管理數(shù)據(jù)和邏輯的。
17）react性能優(yōu)化是哪個周期函數(shù)蚂踊，react性能優(yōu)化方案约谈？
shouldComponentUpdate這個方法用來判斷是否需要調(diào)用render方法重新描繪dom。因?yàn)閐om的描繪非常消耗性能，如果我們能在shouldComponentUpdate方法中能夠?qū)懗龈鼉?yōu)化的dom diff算法棱诱，可以極大的提高性能泼橘。
優(yōu)化方案：重寫shouldComponentUpdate來避免不必要的dom操作，使用production版本的react.js迈勋，使用key來幫助react識別列表中所有子組件的最小變化炬灭。
18）說說前端中的事件流
HTML中的javascript交互是通過事件驅(qū)動來實(shí)現(xiàn)，事件流描述的是從頁面中接受事件的順序靡菇，dom級事件流包括下面幾個階段重归。
事件捕獲階段
處于目標(biāo)階段
事件冒泡階段
19）js的new操作符的作用
new操作符新建了一個控對象，這個對象原型指向構(gòu)造函數(shù)的prototype镰官，執(zhí)行構(gòu)造函數(shù)后返回這個對象提前。
20）bind吗货，apply泳唠，call改變函數(shù)內(nèi)部this的指向的區(qū)別。
1>通過apply和call改變函數(shù)的this指向宙搬，他們兩個函數(shù)的第一個參數(shù)都是一樣的笨腥，表示要改變指向的那個對象，第二個參數(shù)勇垛，apply是數(shù)組脖母，而call則是arg1，arg2...這種形式
2>通過bind改變this作用域會返回一個新的函數(shù)闲孤，這個函數(shù)不會馬上執(zhí)行谆级。
后續(xù)會繼續(xù)更新
