1：下面的代碼輸出什么
var y = 1;
if (function f(){}) {
y += typeof f;
}
console.log(y); // 1undefined
/*
function f(){}) 是函數(shù)定義并沒(méi)有執(zhí)行 所以會(huì)被轉(zhuǎn)化為對(duì)象 而對(duì)象在if判斷中結(jié)果為 true
在js中直接使用為聲明的變量會(huì)報(bào)錯(cuò) 但是在 typeof 這會(huì)直接返回undefinde
*/
2:webpack loader和plugin的區(qū)別
Loader：
用于對(duì)模塊源碼的轉(zhuǎn)換，loader描述了webpack如何處理非javascript模塊，并且在build中引入這些依賴(lài)。loader可以將文件從不同的語(yǔ)言（如TypeScript）轉(zhuǎn)換為JavaScript，或者將內(nèi)聯(lián)圖像轉(zhuǎn)換為data URL。比如說(shuō)：CSS-Loader，Style-Loader等。
loader的使用很簡(jiǎn)單：在webpack.config.js中指定loader。module.rules可以指定多個(gè)loader，對(duì)項(xiàng)目中的各個(gè)loader有個(gè)全局概覽。
loader是運(yùn)行在NodeJS中，可以用options對(duì)象進(jìn)行配置。plugin可以為loader帶來(lái)更多特性。loader可以進(jìn)行壓縮，打包，語(yǔ)言翻譯等等。
loader從模板路徑解析，npm install node_modules。也可以自定義loader，命名XXX-loader。
語(yǔ)言類(lèi)的處理器loader：CoffeeScript，TypeScript，ESNext（Bable）,Sass,Less,Stylus。任何開(kāi)發(fā)技術(shù)棧都可以使用webpack。
Plugin：
目的在于解決loader無(wú)法實(shí)現(xiàn)的其他事，從打包優(yōu)化和壓縮，到重新定義環(huán)境變量，功能強(qiáng)大到可以用來(lái)處理各種各樣的任務(wù)。webpack提供了很多插件：CommonChunkPlugin主要用于提取第三方庫(kù)和公共模塊，避免首屏加載的bundle文件，或者按需加載的bundle文件體積過(guò)大，導(dǎo)致加載時(shí)間過(guò)長(zhǎng)，是一把優(yōu)化的利器。而在多頁(yè)面應(yīng)用中，更是能夠?yàn)槊總€(gè)頁(yè)面間的應(yīng)用程序共享代碼創(chuàng)建bundle。
webpack功能強(qiáng)大，難點(diǎn)在于它的配置文件，webpack4默認(rèn)不需要配置文件，可以通過(guò)mode選項(xiàng)為webpack指定了一些默認(rèn)的配置，mode分為：development/production，默認(rèn)是production。
插件可以攜帶參數(shù)，所以在plugins屬性傳入new實(shí)例。
3:填空題
輸出對(duì)象中大于2的key的數(shù)組
let data = {a:1,b:2,c:3,d:4}
Object.keys(data).filter((x)=>{return ? ;})
/*
let data = {a:1,b:2,c:3,d:4}
Object.keys(data).filter((x)=>{return data[x] > 2;})
Object.keys 會(huì)獲取對(duì)象中的key并生成一個(gè)數(shù)組
得到key的數(shù)組后使用filter遍歷每個(gè)值
通過(guò)動(dòng)態(tài)的key從data中查找對(duì)應(yīng)的value進(jìn)行運(yùn)算即可
*/
4:vue v-model的原理是什么
vue的過(guò)程中發(fā)現(xiàn)v-model的雙向數(shù)據(jù)綁定很好用，v-model不過(guò)是一個(gè)語(yǔ)法糖
<input v-model="sth">
其實(shí)他相當(dāng)于下面這個(gè)：
<input v-bind:value="sth" v-on:input="sth=$event.target.value">
自從html5開(kāi)始input每次輸入都會(huì)觸發(fā)oninput事件，所以輸入時(shí)input的內(nèi)容會(huì)綁定到sth中，于是sth的值就被改變
5: a,b輸出的值是什么
let a = {n:1}
let b = a
a.x = a = {n:2}
console.log(a.x)
console.log(b.x)
/*
console.log(a.x) //undefined
console.log(b.x) //{n: 2}
*/
分析:
1:b = a 是淺拷貝，所以在堆棧中引用的是一個(gè)對(duì)象地址。
2:let a=1，b=2，c=3；
a = b = c；
輸出的a，b，c結(jié)果都為3。 因?yàn)橘x值運(yùn)算從右向左執(zhí)行。
而我們這道題 a.x = a = {n: 2}
. 的運(yùn)算優(yōu)先級(jí)大于賦值運(yùn)算的優(yōu)先級(jí)。
所以先計(jì)算a.x var a=1，b=2，c=3；
a = b = c；
輸出的a，b，c結(jié)果都為3。 因?yàn)橘x值運(yùn)算從右向左執(zhí)行。
而我們這道題 a.x = a = {n: 2}
. 的運(yùn)算優(yōu)先級(jí)大于賦值運(yùn)算的優(yōu)先級(jí)。
所以先計(jì)算a.x
再計(jì)算 a = {n:2}
所以截止到現(xiàn)在
a的輸出值：{ n:2 };
b的輸出值：{ n:1 , x={n:2} }
6: 手寫(xiě)一個(gè)閉包
let foo =()=>{
let a = 20
let bar =()=>{
a = a*2
return a
}
return bar
}
let b = foo()
let b2 = foo()
console.log('222',b()) //40
console.log('222',b()) //80
console.log('222',b()) //160
console.log('222',b2()) //40
