建站
咨詢
售后
建站咨詢
新聞中心
小編給大家分享一下Vue.js中高級面試題有哪些，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！
Vue-loader 是 Webpack 的加載模塊，它使我們可以用 Vue 文件格式編寫單文件組件。
單文件組件文件有三個(gè)部分，(模板、腳本和樣式)。 vue-loader 模塊允許 webpack 使用單獨(dú)的加載模塊 (例如 SASS 或 SCSS 加載器) 提取和處理每個(gè)人部分。該設(shè)置使我們可以使用 Vue 文件無縫編寫程序。
vue-loader 模塊還允許把靜態(tài)資源視為模塊依賴性，并允許使用 webpack 加載器進(jìn)行處理。 而且還允許還開發(fā)過程中進(jìn)行熱重裝。
2、prop 如何指定其類型要求 ？
通過實(shí)現(xiàn) prop 驗(yàn)證選項(xiàng)，可以單個(gè) prop 指定類型要求。這對生產(chǎn)沒有影響，但是會(huì)在開發(fā)段發(fā)出警告，從而幫助開發(fā)人員識(shí)別傳人數(shù)據(jù)和 prop 的特定類型要求的潛在問題。
配置三個(gè) prop 的例子 ：
props : {
accountNumber:{
type : Number,
required : true
},
name :{
type : String,
required : true
},
favoriteColors : Array
}3、什么是虛擬 DOM ？
文檔對象模型或 DOM 定義一個(gè)接口，該接口允許 JavaScript 之類的語言訪問和操作 HTML 文檔。 元素由樹中的節(jié)點(diǎn)表示，并且接口允許我們操作它們。但是此接口需要付出代價(jià)，大量非常頻繁的 DOM 操作會(huì)使頁面速度變慢。
Vue 通過在內(nèi)存中實(shí)現(xiàn)文檔結(jié)構(gòu)的虛擬表示來解決此問題，其中虛擬節(jié)點(diǎn) (Node) 表示 DOM 樹中的節(jié)點(diǎn)。當(dāng)需要操縱時(shí)，可以在虛擬 DOM 的 內(nèi)存中執(zhí)行計(jì)算和操作，而不是在真實(shí) DOM 上進(jìn)行操縱。這自然會(huì)更快，并且允許 DOM 算法計(jì)算最優(yōu)化算出計(jì)算出最優(yōu)化的方式來更新實(shí)際 DOM 結(jié)構(gòu)。
一旦計(jì)算出，就將其應(yīng)用于實(shí)際的 DOM 樹，這就提高了性能，這就是為什么基于虛擬 DOM 的框架 （例如 Vue 和 React） 如此突出的原因。
4、什么是 Vue 插件 ？
Vue 插件允許開發(fā)人員構(gòu)建全局級別的功能并將其添加到 Vue。用于向程序添加可以全局訪問的方法和屬性、資源、選項(xiàng)，mixin 以及其他自定義 APl。 VueFire 是 Vue 插件的一個(gè)例子，該插件添加了 Firebase 特定的方法并將其綁定到整個(gè)程序。 之后 firebase 函數(shù)可在程序結(jié)構(gòu)中的任何位置的 this 上下文中使用。
5、什么是 mixin ？
Mixin 使我們能夠?yàn)?Vue 組件編寫可插拔和可重用的功能。 如果你希望再多個(gè)組件之間重用一組組件選項(xiàng)，例如生命周期 hook、 方法等，則可以將其編寫為 mixin，并在組件中簡單的引用它。然后將 mixin 的內(nèi)容合并到組件中。如果你要在 mixin 中定義生命周期 hook，那么它在執(zhí)行時(shí)將優(yōu)化于組件自已的 hook。
6、 什么是渲染函數(shù) ？舉個(gè)例子。
Vue 允許我們以多種方式構(gòu)建模板，其中最常見的方式是只把 HTML 與特殊指令和mustache 標(biāo)簽一起用于相響應(yīng)功能。但是你也可以通過 JavaScript 使用特殊的函數(shù)類 （稱為渲染函數(shù)） 來構(gòu)建模板。這些函數(shù)與編譯器非常接近，這意味它們比其他模板類型更高效、快捷。由于你使用 JavaScript 編寫渲染函數(shù)，因此可以在需要的地方自由使用該語言直接添加自定義函數(shù)。
對于標(biāo)準(zhǔn) HTML 模板的高級方案非常有用。
這里是用 HTML 作為模板 Vue 程序
new Vue ({
el: '#app',
data:{
fruits: ['Apples','Oranges','Kiwi']
},
template:
`
Fruit Basket
{{ fruit }}
`
});這里是用渲染函數(shù)開發(fā)的同一個(gè)程序：
new Vue({
el: '#app',
data: {
fruits: ['Apples', 'Oranges', 'Kiwi']
},
render: function(createElement) {
return createElement('div', [
createElement('h2', 'Fruit Basket'),
createElement('ol', this.fruits.map(function(fruit) {
return createElement('li', fruit);
}))
]);
}
});輸出如下：
Fruit Basket
1、Apples 2、Oranges 3、Kiwi
在上面的例子中，我們用了一個(gè)函數(shù)，它返回一系列 createElement() 調(diào)用，每個(gè)調(diào)用負(fù)責(zé)生成一個(gè)元素。盡管 v-for 指令在基于 HTML 的模板中起作用，但是當(dāng)時(shí)用渲染函數(shù)時(shí)，可以簡單的用標(biāo)準(zhǔn)的 .map() 函數(shù)遍歷 fruits 數(shù)據(jù)數(shù)組。
7、哪個(gè)生命周期 hook 最合適從 APl 調(diào)用中獲取數(shù)據(jù) ？
盡管這取決于組件的用途及，但是創(chuàng)建的生命周期 hook 內(nèi)通常非常適合放置 APl 調(diào)用。這時(shí)可以使用組件的數(shù)據(jù)和響應(yīng)性功能，但是該組件尚未渲染。
8、什么時(shí)候調(diào)用 "updated" 生命周期 hook ？
在更新響應(yīng)性數(shù)據(jù)并重新渲染虛擬 DOM 之后，將調(diào)用更新的 hook。它可以用于執(zhí)行與 DOM 相關(guān)的操作，但是 (默認(rèn)情況下) 不能保證子組件會(huì)被渲染，盡管也可以通過在更新函數(shù)中使用 this.$nextTick 來確保。
9、在 Vue 實(shí)例中編寫生命周期 hook 或其他 option/propertie 時(shí)，為什么不使用箭頭函數(shù) ？
箭頭函數(shù)自已沒有定義 this 上下文中。當(dāng)你在 Vue 程序中使用箭頭函數(shù) ( => ) 時(shí)，this 關(guān)鍵字病不會(huì)綁定到 Vue 實(shí)例，因此會(huì)引發(fā)錯(cuò)誤。所以強(qiáng)烈建議改用標(biāo)準(zhǔn)函數(shù)聲明。
10、什么是異步組件 ？
當(dāng)大型程序使用大量組件時(shí)，從服務(wù)器上同時(shí)加載所有組件可能是沒有意義的。在這種情況下，Vue 允許我們在需要時(shí)定義從服務(wù)器異步加載的組件。在聲明或注冊組件時(shí)， Vue 接受提供 Promise 的工廠函數(shù)。然后可以在調(diào)用該組件時(shí)對其進(jìn)行 "解析"。
通過僅加載基本組件并把異步組件的加載推遲到未來的調(diào)用時(shí)間，可以節(jié)省帶寬和程序加載時(shí)間。
這是一個(gè)異步組件的簡單示例。
new Vue({
components: {
'tweet-box': () => import('./components/async/TweetBox')
}
});當(dāng)以這種方式使用時(shí)，Webpack的代碼拆分將用于提供此功能。
以上是“Vue.js中高級面試題有哪些”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對大家有所幫助，如果還想學(xué)習(xí)更多知識(shí)，歡迎關(guān)注創(chuàng)新互聯(lián)成都網(wǎng)站設(shè)計(jì)公司行業(yè)資訊頻道！
另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)scvps.cn，海內(nèi)外云服務(wù)器15元起步，三天無理由+7*72小時(shí)售后在線，公司持有idc許可證，提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國服務(wù)器、虛擬主機(jī)、免備案服務(wù)器”等云主機(jī)租用服務(wù)以及企業(yè)上云的綜合解決方案，具有“安全穩(wěn)定、簡單易用、服務(wù)可用性高、性價(jià)比高”等特點(diǎn)與優(yōu)勢，專為企業(yè)上云打造定制，能夠滿足用戶豐富、多元化的應(yīng)用場景需求。
網(wǎng)站標(biāo)題：Vue.js中高級面試題有哪些-創(chuàng)新互聯(lián)
本文網(wǎng)址：http://www.ef60e0e.cn/article/dsjcch.html
