實(shí)現(xiàn)一個(gè)小盒子在另一個(gè)大盒子里面水平垂直居中

方法一：彈性盒子

.box1 {
    width: 100%;
    height: 500px;
    background-color: pink;
    /* 方法一：flex彈性盒子 */
    display: flex;
    justify-content: center;
    align-items: center; 
}

.box2 {
    width: 200px;
    height: 200px;
    background-color: skyblue;
}

方法二：絕對(duì)定位

.box1 {
    width: 100%;
    height: 500px;
    background-color: pink;
    position: relative;
}

.box2 {
    width: 200px;
    height: 200px;
    background-color: skyblue;
    /* 絕對(duì)定位 */
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

方法三：彈性盒子泌神，外邊距自動(dòng)

.box1 {
    width: 100%;
    height: 500px;
    background-color: pink;
    display: flex;
}

.box2 {
    width: 200px;
    height: 200px;
    background-color: skyblue;
    margin: auto;
}

js有幾種類(lèi)型

兩種：簡(jiǎn)單數(shù)據(jù)類(lèi)型和復(fù)雜數(shù)據(jù)類(lèi)型

簡(jiǎn)單數(shù)據(jù)類(lèi)型包括：Number良漱、String舞虱、Boolean、Null母市、 Undefined矾兜、Symbol（ES6）

引用數(shù)據(jù)類(lèi)型包括：數(shù)組，對(duì)象患久，函數(shù)

簡(jiǎn)單數(shù)據(jù)類(lèi)型與引用數(shù)據(jù)類(lèi)型的區(qū)別

簡(jiǎn)單數(shù)據(jù)類(lèi)型包括：Number椅寺、String、Boolean蒋失、Null返帕、 Undefined、Symbol（ES6）

引用數(shù)據(jù)類(lèi)型包括：數(shù)組篙挽，對(duì)象荆萤，函數(shù)

區(qū)別：簡(jiǎn)單數(shù)據(jù)類(lèi)型是直接按值存放在棧中，也可以直接按值訪(fǎng)問(wèn)铣卡；復(fù)雜數(shù)據(jù)類(lèi)型是存放在堆里的對(duì)象，它在棧中存放的是堆里面的引用地址梧油，訪(fǎng)問(wèn)也是訪(fǎng)問(wèn)引用地址州邢，不是直接訪(fǎng)問(wèn)值量淌。

堆和棧的區(qū)別

棧(stack)會(huì)自動(dòng)分配內(nèi)存空間嫌褪，會(huì)自動(dòng)釋放笼痛。堆(heap)動(dòng)態(tài)分配的內(nèi)存，大小不定也不會(huì)自動(dòng)釋放摘刑。

深淺拷貝以及實(shí)現(xiàn)深淺拷貝的方法

深拷貝：拷貝數(shù)據(jù)枷恕，改變舊對(duì)象的數(shù)據(jù)的時(shí)候徐块，新對(duì)象的數(shù)據(jù)不會(huì)改變

淺拷貝：拷貝引用地址，改變舊對(duì)象的數(shù)據(jù)的時(shí)候胡控，新對(duì)象的數(shù)據(jù)也會(huì)跟著改變

實(shí)現(xiàn)深拷貝的方法: 1. JSON.parse(JSON.stringify()) 2. 遞歸for-in 3. jQuery $.extend() 4. _.cloneDeep()

實(shí)現(xiàn)淺拷貝的方法: 1. 剩余(擴(kuò)展)運(yùn)算符 2. concat() 3. Object.assign() 4. slice()

防抖和節(jié)流

防抖和節(jié)流都是為了阻止某項(xiàng)操作高頻觸發(fā)

防抖是讓用戶(hù)多次觸發(fā)昼激，只生效最后一次，適用于只需要一次觸發(fā)生效的場(chǎng)景
防抖應(yīng)用場(chǎng)景：表單里的按鈕敛劝，用戶(hù)點(diǎn)擊過(guò)快纷宇，發(fā)送多次請(qǐng)求

節(jié)流是讓用戶(hù)的操作像捶，每隔一段時(shí)間觸發(fā)一次，適用于多次觸發(fā)要多次生效的場(chǎng)景
節(jié)流應(yīng)用場(chǎng)景：監(jiān)聽(tīng)滾動(dòng)事件

事件循環(huán)

同步任務(wù)和異步任務(wù)分別進(jìn)入不同的執(zhí)行"場(chǎng)所"; 同步任務(wù)進(jìn)入主線(xiàn)程释簿，異步任務(wù)進(jìn)入Event Table并注冊(cè)回調(diào)函數(shù)庶溶。
當(dāng)指定的事情完成時(shí)懂鸵，Event Table會(huì)將這個(gè)函數(shù)移入任務(wù)隊(duì)列(task quene)匆光，等待主線(xiàn)程的任務(wù)執(zhí)行完畢;
當(dāng)棧中的代碼執(zhí)行完畢，執(zhí)行棧(call stack)中的任務(wù)為空時(shí)夺巩，就會(huì)讀取任務(wù)隊(duì)列(task quene)中的任務(wù)柳譬，去執(zhí)行對(duì)應(yīng)的回調(diào);
如此循環(huán)休傍，就形成js的事件循環(huán)機(jī)制(Event Loop)。

new操作符做了那些事情柴墩？

開(kāi)辟一個(gè)內(nèi)存存放新創(chuàng)建的對(duì)象--創(chuàng)建實(shí)例對(duì)象

將構(gòu)造函數(shù)里的this指向?qū)嵗龑?duì)象

給實(shí)例對(duì)象新增屬性和方法

隱式的返回了實(shí)例對(duì)象

如果后臺(tái)沒(méi)做分頁(yè)江咳，沒(méi)傳size和pagination哥放，給你傳一萬(wàn)條數(shù)據(jù)甥雕，你怎么優(yōu)化性能

先按照需求前端自己實(shí)現(xiàn)分頁(yè)，設(shè)置查看更多啥的

閉包

閉包是指一個(gè)內(nèi)部函數(shù)了引用外部函數(shù)的局部變量挟阻。閉包延長(zhǎng)了外部函數(shù)的局部變量的作用域附鸽。

rem和em的區(qū)別

rem和em都是相對(duì)單位瞒瘸，rem是相對(duì)于html根元素情臭；em是根據(jù)父元素或者祖先元素，也會(huì)受自己的影響丁侄。

css常用選擇器

基本選擇器：元素選擇器(div)朝巫，id選擇器(#)劈猿，類(lèi)選擇器(.)潮孽，通配符選擇器(*)
復(fù)合選擇器：交集選擇器往史，并集選擇器(,)
關(guān)系選擇器：后代選擇器(空格)，子代選擇器(>)
屬性選擇器
偽類(lèi)選擇器(:link,:hover,:focus,:visited)

js有哪些內(nèi)置對(duì)象

常用的有：Math對(duì)象,Date對(duì)象,Array對(duì)象,String對(duì)象等

隱藏元素有幾種方法

visibility:hidden （占空間）
display:none（不會(huì)占用空間）
opacity:0 （占空間请祖，透明度為0）
寬高設(shè)為0脖祈，然后再overflow：hidden

var,let,const的區(qū)別

let和const是es6新增的用于聲明變量的特性
const是聲明常量盖高，不可更改
var可以重復(fù)聲明，let和const不可以重復(fù)聲明
var有變量提升和預(yù)解析席纽，let和const沒(méi)有
let和const具有塊級(jí)作用域胆筒，var沒(méi)有

this關(guān)鍵字的指向你是怎么理解的诈豌？具體有哪些情況矫渔？

1.獨(dú)立的函數(shù)中的this指向window
2,對(duì)象的方法中的this指向該對(duì)象
3,事件處理函數(shù)中的this 指向事件源（綁定事件元素）
4，構(gòu)造函數(shù)中的this指向new創(chuàng)建的空對(duì)象
5顿痪，定時(shí)器中的this指向window
6.箭頭函數(shù)中的this指向上下文中的this

列舉數(shù)組的遍歷方法并簡(jiǎn)述用法蚁袭，最少5個(gè)

foEach——遍歷數(shù)組
map——指定條件處理數(shù)組元素石咬，返回由處理過(guò)后的元素組成的新數(shù)組
filter——篩選出滿(mǎn)足指定條件的數(shù)組元素鬼悠，返回滿(mǎn)足條件的元素組成的新數(shù)組
some——判斷數(shù)組中的元素是否滿(mǎn)足指定條件，只要有一個(gè)滿(mǎn)足就返回true
every——判斷數(shù)組中的元素是否滿(mǎn)足指定條件蹬挺，只要有一個(gè)不滿(mǎn)足就返回false

什么是跨域?如何解決跨域?

指的是瀏覽器不能執(zhí)行其他網(wǎng)站的腳本巴帮。它是由瀏覽器的同源策略造成的，是瀏覽器對(duì)javascript施加的安全限制发乔。
jsonp script標(biāo)簽不受同源策略的限制栏尚≈缓蓿可以動(dòng)態(tài)生成script標(biāo)簽，通過(guò)回調(diào)函數(shù)的形式獲取到接口中的數(shù)據(jù)纵菌，缺點(diǎn)是：只能用于get請(qǐng)求
Cors 跨域資源共享 app.all(‘*’)
使用反向代理服務(wù)器nginix咱圆，服務(wù)器通信不受同源策略限制

get和post的區(qū)別

1.效率
GET的意思是『得』功氨，從服務(wù)器獲取數(shù)據(jù)（也可以上傳數(shù)據(jù)捷凄，參數(shù)就是），效率較高
POST的意思是『給』匈睁，但可以向服務(wù)器發(fā)送數(shù)據(jù)和下載數(shù)據(jù)航唆，效率不如GET
2.緩存
GET 請(qǐng)求能夠被緩存院刁，默認(rèn)的請(qǐng)求方式也是有緩存的
POST請(qǐng)求默認(rèn)不會(huì)緩存
3.安全性
GET的所有參數(shù)全部包裝在URL中，明文顯示超营，且服務(wù)器的訪(fǎng)問(wèn)日志會(huì)記錄阅虫，非常不安全
POST的URL中只有資源路徑颓帝，不包含參數(shù)，參數(shù)封裝在二進(jìn)制的數(shù)據(jù)體中吕座，服務(wù)器也不會(huì)記錄參數(shù)吴趴，相對(duì)安全侮攀。所有涉及用戶(hù)隱私的數(shù)據(jù)都要用POST傳輸
4.數(shù)據(jù)量
HTTP協(xié)議中均沒(méi)有對(duì)GET和POST請(qǐng)求的數(shù)據(jù)大小進(jìn)行限制，但是實(shí)際應(yīng)用中它們通常受限于軟硬件平臺(tái)的設(shè)計(jì)和性能撇叁。
GET：不同的瀏覽器和服務(wù)器不同畦贸，一般限制在2~8K之間薄坏，更加常見(jiàn)的是1k以?xún)?nèi)
POST方法提交的數(shù)據(jù)比較大，大小靠服務(wù)器的設(shè)定值限制胶坠，PHP默認(rèn)是2M（具體的話(huà)大家以后看后端給的開(kāi)發(fā)文檔就行了）