js閉包概念：在函數(shù)內(nèi)壁定義一個(gè)子函數(shù)，可以用子函數(shù)訪問(wèn)父函數(shù)的私有變量蠢护，執(zhí)行完成操作后將函數(shù)通過(guò)return對(duì)象返回禀挫。

閉包作用:訪問(wèn)函數(shù)的私有變量：將函數(shù)的變量始終存于內(nèi)存中不釋放；

繼承概念：使用一個(gè)子類繼承父類税肪，子類可以自動(dòng)擁有父類的屬性和方法晾浴；

繼承的三種實(shí)現(xiàn)方式：object的protype實(shí)現(xiàn)繼承负乡，使用call和apply實(shí)現(xiàn)繼承，使用原型鏈繼承脊凰；

潛拷貝：雙向改變抖棘，指向統(tǒng)一內(nèi)存空間；改變其中一方的內(nèi)容狸涌，都是在原來(lái)的內(nèi)存上做修改切省，會(huì)導(dǎo)致拷貝對(duì)象和源對(duì)象發(fā)生修改；

潛拷貝實(shí)現(xiàn)：1簡(jiǎn)單的復(fù)用杈抢；2：Object.assign()；方法可以把任意多個(gè)的源對(duì)象自身的可枚舉屬性拷貝給目標(biāo)對(duì)象仑性，然后返回目標(biāo)對(duì)象惶楼。Object.assign會(huì)跳過(guò)那些值為 null 或 undefined 的源對(duì)象。

深拷貝：開(kāi)辟新的內(nèi)存地址诊杆，象的各個(gè)屬性逐個(gè)復(fù)制進(jìn)去歼捐。對(duì)拷貝對(duì)象和源對(duì)象各自的操作互不影響。

深拷貝實(shí)現(xiàn)方法：.1晨汹、Array的slice和concat方法豹储；2JSON對(duì)象的parse和stringify；jQuery.extend()方法源碼實(shí)現(xiàn)淘这；

作用域鏈：剥扣；

vue問(wèn)題：

vue綁定失效的原因：1對(duì)于數(shù)組來(lái)說(shuō)是沒(méi)有g(shù)et和set的方法巩剖，所以需要手動(dòng)設(shè)置；

vue綁定圖片失效的原因：

其中文字內(nèi)容能夠正常顯示钠怯，說(shuō)明傳遞的數(shù)據(jù)沒(méi)有錯(cuò)

但是由于在div中顯示之前佳魔，webpack并沒(méi)有去編譯我的imgsrc

解決方法:??

加個(gè)require()就可以了

? <img :src="require('../assets/images/'+imgsrc+'.png')"/>

快速解決vue動(dòng)態(tài)綁定多個(gè)class的官方實(shí)例語(yǔ)法無(wú)效的問(wèn)題

<a :class="{ 'active': hash==='finish','nav-link':true}"href="#/finish"rel="external nofollow">已完成</a>

1、active-class是哪個(gè)組件的屬性晦炊？嵌套路由怎么定義鞠鲜？

答：vue-router模塊的router-link組件。

2断国、怎么定義vue-router的動(dòng)態(tài)路由贤姆？怎么獲取傳過(guò)來(lái)的動(dòng)態(tài)參數(shù)？?

答：在router目錄下的index.js文件中稳衬，對(duì)path屬性加上/:id霞捡。? 使用router對(duì)象的params.id

3、vue-router有哪幾種導(dǎo)航鉤子宋彼？?? ?

答：三種弄砍，一種是全局導(dǎo)航鉤子：router.beforeEach(to,from,next)，作用：跳轉(zhuǎn)前進(jìn)行判斷攔截输涕。第二種：組件內(nèi)的鉤子音婶；第三種：?jiǎn)为?dú)路由獨(dú)享組件

4、scss是什么莱坎？安裝使用的步驟是衣式？有哪幾大特性？

答：預(yù)處理css檐什，把css當(dāng)前函數(shù)編寫碴卧，定義變量,嵌套。 先裝css-loader乃正、node-loader住册、sass-loader等加載器模塊，在webpack-base.config.js配置文件中加多一個(gè)拓展:extenstion瓮具，再加多一個(gè)模塊：module里面test荧飞、loader

4.1、scss是什么名党？在vue.cli中的安裝使用步驟是叹阔？有哪幾大特性？

答：css的預(yù)編譯传睹。

使用步驟：

第一步：用npm 下三個(gè)loader（sass-loader耳幢、css-loader、node-sass）

第二步：在build目錄找到webpack.base.config.js欧啤，在那個(gè)extends屬性中加一個(gè)拓展.scss

第三步：還是在同一個(gè)文件睛藻，配置一個(gè)module屬性

第四步：然后在組件的style標(biāo)簽加上lang屬性 启上，例如：lang=”scss”

有哪幾大特性:

1、可以用變量修档，例如（$變量名稱=值）碧绞；

2、可以用混合器吱窝，例如（）

3讥邻、可以嵌套

5、mint-ui是什么院峡？怎么使用兴使？說(shuō)出至少三個(gè)組件使用方法？

答：基于vue的前端組件庫(kù)照激。npm安裝发魄，然后import樣式和js，vue.use（mintUi）全局引入俩垃。在單個(gè)組件局部引入：import {Toast} from ‘mint-ui’励幼。組件一：Toast(‘登錄成功’)；組件二：mint-header口柳；組件三：mint-swiper

6苹粟、v-model是什么？怎么使用跃闹？ vue中標(biāo)簽怎么綁定事件嵌削？

答：可以實(shí)現(xiàn)雙向綁定，指令（v-class望艺、v-for苛秕、v-if、v-show找默、v-on）艇劫。vue的model層的data屬性。綁定事件：

7惩激、axios是什么店煞？怎么使用？描述使用它實(shí)現(xiàn)登錄功能的流程咧欣？

答：請(qǐng)求后臺(tái)資源的模塊浅缸。npm install axios -S裝好轨帜，然后發(fā)送的是跨域魄咕，需在配置文件中config/index.js進(jìn)行設(shè)置。后臺(tái)如果是Tp5則定義一個(gè)資源路由蚌父。js中使用import進(jìn)來(lái)哮兰，然后.get或.post毛萌。返回在.then函數(shù)中如果成功，失敗則是在.catch函數(shù)中

8喝滞、axios+tp5進(jìn)階中阁将，調(diào)用axios.post(‘a(chǎn)pi/user’)是進(jìn)行的什么操作？axios.put(‘a(chǎn)pi/user/8′)呢右遭？

答：跨域做盅，添加用戶操作，更新操作窘哈。

9吹榴、什么是RESTful API？怎么使用?

答：是一個(gè)api的標(biāo)準(zhǔn)滚婉，無(wú)狀態(tài)請(qǐng)求图筹。請(qǐng)求的路由地址是固定的，如果是tp5則先路由配置中把資源路由配置好让腹。標(biāo)準(zhǔn)有：.post .put .delete

10远剩、vuex是什么？怎么使用骇窍？哪種功能場(chǎng)景使用它瓜晤？

答：vue框架中狀態(tài)管理。在main.js引入store像鸡，注入活鹰。新建了一個(gè)目錄store，….. export 只估。場(chǎng)景有：?jiǎn)雾?yè)應(yīng)用中志群，組件之間的狀態(tài)。音樂(lè)播放蛔钙、登錄狀態(tài)锌云、加入購(gòu)物車

11、mvvm框架是什么吁脱？它和其它框架（jquery）的區(qū)別是什么桑涎？哪些場(chǎng)景適合？

答：一個(gè)model+view+viewModel框架兼贡，數(shù)據(jù)模型model攻冷，viewModel連接兩個(gè)

區(qū)別：vue數(shù)據(jù)驅(qū)動(dòng)，通過(guò)數(shù)據(jù)來(lái)顯示視圖層而不是節(jié)點(diǎn)操作遍希。

場(chǎng)景：數(shù)據(jù)操作比較多的場(chǎng)景等曼，更加便捷

12、自定義指令（v-check、v-focus）的方法有哪些禁谦？它有哪些鉤子函數(shù)胁黑？還有哪些鉤子函數(shù)參數(shù)？

答：全局定義指令：在vue對(duì)象的directive方法里面有兩個(gè)參數(shù)州泊，一個(gè)是指令名稱丧蘸，另外一個(gè)是函數(shù)。組件內(nèi)定義指令：directives

鉤子函數(shù)：bind（綁定事件觸發(fā)）遥皂、inserted(節(jié)點(diǎn)插入的時(shí)候觸發(fā))力喷、update（組件內(nèi)相關(guān)更新）

鉤子函數(shù)參數(shù)：el、binding

13演训、說(shuō)出至少4種vue當(dāng)中的指令和它的用法冗懦？

答：v-if：判斷是否隱藏；v-for：數(shù)據(jù)循環(huán)出來(lái)仇祭；v-bind:class：綁定一個(gè)屬性披蕉；v-model：實(shí)現(xiàn)雙向綁定

14、vue-router是什么乌奇？它有哪些組件没讲？

答：vue用來(lái)寫路由一個(gè)插件。router-link礁苗、router-view

15爬凑、導(dǎo)航鉤子有哪些？它們有哪些參數(shù)试伙？

答：導(dǎo)航鉤子有：a/全局鉤子和組件內(nèi)獨(dú)享的鉤子嘁信。b/beforeRouteEnter、afterEnter疏叨、beforeRouterUpdate潘靖、beforeRouteLeave

參數(shù)：有to（去的那個(gè)路由）、from（離開(kāi)的路由）蚤蔓、next（一定要用這個(gè)函數(shù)才能去到下一個(gè)路由卦溢，如果不用就攔截）最常用就這幾種

16、Vue的雙向數(shù)據(jù)綁定原理是什么秀又？

答：vue.js 是采用數(shù)據(jù)劫持結(jié)合發(fā)布者-訂閱者模式的方式单寂，通過(guò)Object.defineProperty()來(lái)劫持各個(gè)屬性的setter，getter吐辙，在數(shù)據(jù)變動(dòng)時(shí)發(fā)布消息給訂閱者宣决，觸發(fā)相應(yīng)的監(jiān)聽(tīng)回調(diào)。

具體步驟：

第一步：需要observe的數(shù)據(jù)對(duì)象進(jìn)行遞歸遍歷昏苏，包括子屬性對(duì)象的屬性尊沸，都加上setter和getter

這樣的話昵时，給這個(gè)對(duì)象的某個(gè)值賦值，就會(huì)觸發(fā)setter椒丧，那么就能監(jiān)聽(tīng)到了數(shù)據(jù)變化

第二步：compile解析模板指令，將模板中的變量替換成數(shù)據(jù)救巷，然后初始化渲染頁(yè)面視圖壶熏，并將每個(gè)指令對(duì)應(yīng)的節(jié)點(diǎn)綁定更新函數(shù)，添加監(jiān)聽(tīng)數(shù)據(jù)的訂閱者浦译，一旦數(shù)據(jù)有變動(dòng)棒假，收到通知，更新視圖

第三步：Watcher訂閱者是Observer和Compile之間通信的橋梁精盅，主要做的事情是:

1帽哑、在自身實(shí)例化時(shí)往屬性訂閱器(dep)里面添加自己

2、自身必須有一個(gè)update()方法

3叹俏、待屬性變動(dòng)dep.notice()通知時(shí)妻枕，能調(diào)用自身的update()方法，并觸發(fā)Compile中綁定的回調(diào)粘驰，則功成身退屡谐。

第四步：MVVM作為數(shù)據(jù)綁定的入口，整合Observer蝌数、Compile和Watcher三者愕掏，通過(guò)Observer來(lái)監(jiān)聽(tīng)自己的model數(shù)據(jù)變化，通過(guò)Compile來(lái)解析編譯模板指令顶伞，最終利用Watcher搭起Observer和Compile之間的通信橋梁饵撑，達(dá)到數(shù)據(jù)變化 -> 視圖更新；視圖交互變化(input) -> 數(shù)據(jù)model變更的雙向綁定效果唆貌。

ps：16題答案同樣適合”vue data是怎么實(shí)現(xiàn)的滑潘？”此面試題。

17锨咙、請(qǐng)?jiān)敿?xì)說(shuō)下你對(duì)vue生命周期的理解众羡？

答：總共分為8個(gè)階段創(chuàng)建前/后，載入前/后蓖租，更新前/后粱侣，銷毀前/后。

創(chuàng)建前/后：在beforeCreated階段蓖宦，vue實(shí)例的掛載元素$el和數(shù)據(jù)對(duì)象data都為undefined齐婴，還未初始化。在created階段稠茂，vue實(shí)例的數(shù)據(jù)對(duì)象data有了柠偶，$el還沒(méi)有情妖。

載入前/后：在beforeMount階段，vue實(shí)例的$el和data都初始化了诱担，但還是掛載之前為虛擬的dom節(jié)點(diǎn)毡证，data.message還未替換。在mounted階段蔫仙，vue實(shí)例掛載完成料睛，data.message成功渲染。

更新前/后：當(dāng)data變化時(shí)摇邦，會(huì)觸發(fā)beforeUpdate和updated方法恤煞。

銷毀前/后：在執(zhí)行destroy方法后，對(duì)data的改變不會(huì)再觸發(fā)周期函數(shù)施籍，說(shuō)明此時(shí)vue實(shí)例已經(jīng)解除了事件監(jiān)聽(tīng)以及和dom的綁定居扒，但是dom結(jié)構(gòu)依然存在

18、請(qǐng)說(shuō)下封裝?vue?組件的過(guò)程丑慎？

答：首先喜喂，組件可以提升整個(gè)項(xiàng)目的開(kāi)發(fā)效率。能夠把頁(yè)面抽象成多個(gè)相對(duì)獨(dú)立的模塊竿裂，解決了我們傳統(tǒng)項(xiàng)目開(kāi)發(fā)：效率低夜惭、難維護(hù)、復(fù)用性等問(wèn)題铛绰。

然后诈茧，使用Vue.extend方法創(chuàng)建一個(gè)組件，然后使用Vue.component方法注冊(cè)組件捂掰。子組件需要數(shù)據(jù)敢会，可以在props中接受定義。而子組件修改好數(shù)據(jù)后这嚣，想把數(shù)據(jù)傳遞給父組件鸥昏。可以采用emit方法姐帚。

19吏垮、你是怎么認(rèn)識(shí)vuex的？

答：vuex可以理解為一種開(kāi)發(fā)模式或框架。比如PHP有thinkphp，java有spring等渺贤。

通過(guò)狀態(tài)（數(shù)據(jù)源）集中管理驅(qū)動(dòng)組件的變化（好比spring的IOC容器對(duì)bean進(jìn)行集中管理）。

應(yīng)用級(jí)的狀態(tài)集中放在store中遗嗽； 改變狀態(tài)的方式是提交mutations，這是個(gè)同步的事物鼓蜒； 異步邏輯應(yīng)該封裝在action中痹换。

20征字、vue-loader是什么？使用它的用途有哪些娇豫？

答：解析.vue文件的一個(gè)加載器匙姜，跟template/js/style轉(zhuǎn)換成js模塊。

用途：js可以寫es6冯痢、style樣式可以scss或less氮昧、template可以加jade等

21、請(qǐng)說(shuō)出vue.cli項(xiàng)目中src目錄每個(gè)文件夾和文件的用法系羞？

答：assets文件夾是放靜態(tài)資源；components是放組件霸琴；router是定義路由相關(guān)的配置;view視圖椒振；app.vue是一個(gè)應(yīng)用主組件；main.js是入口文件

22梧乘、vue.cli中怎樣使用自定義的組件澎迎？有遇到過(guò)哪些問(wèn)題嗎？

答：第一步：在components目錄新建你的組件文件（smithButton.vue）选调，script一定要export default {

第二步：在需要用的頁(yè)面（組件）中導(dǎo)入：import smithButton from ‘../components/smithButton.vue’

第三步：注入到vue的子組件的components屬性上面,components:{smithButton}

第四步：在template視圖view中使用夹供，?

問(wèn)題有：smithButton命名，使用的時(shí)候則smith-button仁堪。

23哮洽、聊聊你對(duì)Vue.js的template編譯的理解？

答：簡(jiǎn)而言之弦聂，就是先轉(zhuǎn)化成AST樹(shù)鸟辅，再得到的render函數(shù)返回VNode（Vue的虛擬DOM節(jié)點(diǎn)）

詳情步驟：

首先，通過(guò)compile編譯器把template編譯成AST語(yǔ)法樹(shù)（abstract syntax tree 即 源代碼的抽象語(yǔ)法結(jié)構(gòu)的樹(shù)狀表現(xiàn)形式）莺葫，compile是createCompiler的返回值匪凉，createCompiler是用以創(chuàng)建編譯器的。另外compile還負(fù)責(zé)合并option捺檬。

然后再层，AST會(huì)經(jīng)過(guò)generate（將AST語(yǔ)法樹(shù)轉(zhuǎn)化成render funtion字符串的過(guò)程）得到render函數(shù)，render的返回值是VNode堡纬，VNode是Vue的虛擬DOM節(jié)點(diǎn)聂受，里面有（標(biāo)簽名、子節(jié)點(diǎn)烤镐、文本等等）

24：css消除inline-block間隙饺饭；加上這個(gè)標(biāo)簽

.fontsize0{

font-size: 0;

-webkit-text-size-adjust:none;

}

25：但是某些對(duì)象還是和其他對(duì)象不太一樣。為了區(qū)分對(duì)象的類型职车，我們用typeof操作符獲取對(duì)象的類型瘫俊，它總是返回一個(gè)字符串：