千鋒教育web前端高頻面試題視頻教程,kerwin大話前端面試秘籍(附答案)

P5
1.介紹JS有哪些內(nèi)置對(duì)象?
數(shù)據(jù)封裝對(duì)象:Object、Array、Boolean、Number、String
其他對(duì)象:Function、Arguments、Math、Date、RegExp、Error
ES6新增對(duì)象:Symbol(標(biāo)識(shí)唯一性id)、Map、Set、Promises、Proxy、Reflect
2.如何最小化重繪和回流
需要對(duì)元素進(jìn)行復(fù)雜的操作時(shí),可以先隱藏(display:"none"),操作完成后再顯示;
需要?jiǎng)?chuàng)建多個(gè)DOM節(jié)點(diǎn)時(shí),使用DocumentFragment創(chuàng)建完后一次性的加入document;
緩存Layout屬性值,如:var left = elem.offsetLeft;這樣,多次使用left只產(chǎn)生一次回流;
盡量避免用table布局(table元素一旦觸發(fā)回流就會(huì)導(dǎo)致table里所有的其他元素回流);
3.javascript作用鏈域
全局函數(shù)無法查看局部函數(shù)的內(nèi)部細(xì)節(jié),但局部函數(shù)可以查看其上層的函數(shù)細(xì)節(jié),直至全局細(xì)節(jié);
如果當(dāng)前作用域沒有找到屬性或方法,會(huì)向上層作用域[[Scoped]]查找,直至全局函數(shù),這種形式就是作用域鏈
4.網(wǎng)絡(luò)請(qǐng)求
(1)XHR
a.創(chuàng)建一個(gè)XMLHttpRequest對(duì)象
b.通過.open傳入請(qǐng)求方式,地址,以及是否異步
c.send發(fā)送
d.通過onreadyStatechange監(jiān)聽,如果返回是4,則查看狀態(tài)碼分辨是否請(qǐng)求成功
注:xhr請(qǐng)求可以通過abort取消
(2)fetch(w3c)
主要用來解決XHR請(qǐng)求混亂,對(duì)異步處理不友好的問題
第一個(gè).then必須返回一個(gè)res.json(),然后在后面的.then中才能獲得真正的數(shù)據(jù)
需要考慮兼容性問題,取代xhr
(3)jsonp
動(dòng)態(tài)創(chuàng)建script指向沒有跨域限制,onload
后端返回的數(shù)據(jù)格式一定是:test('["111","222","333"]')
前端提前定義好test這個(gè)方法,通過形參就能拿到數(shù)據(jù)了
jsonp可以做get請(qǐng)求,無法做post請(qǐng)求
jsonp不可以取消
5.跨域和同源策略
所謂的同源策略其實(shí)就是瀏覽器的一種機(jī)制,只允許在同源,也就是同協(xié)議、同域名、同端口的情況下才能進(jìn)行數(shù)據(jù)交互,但是我們?cè)陂_發(fā)項(xiàng)目的過程中項(xiàng)目接口不止一個(gè)域,所以往往就需要做跨域處理,通常的跨域方式有這么幾種:
1、jsonp主要依賴script標(biāo)簽不受同源策略影響,src指向某一個(gè)接口的地址,同步需要傳遞callback回調(diào)函數(shù)名字,這樣當(dāng)接口調(diào)用成功之后本地創(chuàng)建的全局回調(diào)函數(shù)會(huì)護(hù)行,并接收到數(shù)據(jù)不使用img標(biāo)簽的原因是,因?yàn)閕mg標(biāo)簽無法執(zhí)行js語句
2、CORS,依賴服務(wù)器對(duì)前端的請(qǐng)求頭信息進(jìn)行放行,不做限制
Access-Contorl-Allow-Origin配置成
3、代理訪問,前端訪問不存在的跨域問題的代理服務(wù)器,代理服務(wù)器再去訪問目標(biāo)服務(wù)器(服務(wù)器之間沒有跨域限制)