你會寫Vue?來試試這10道Vue筆試題?
近日,有十道關(guān)于 Vue 的選擇題,在群里引出了一眾社區(qū)知名人士競折腰,最后釣出了 @尤雨溪 本人親自挑戰(zhàn)……
然后他自己也做錯了(其中的某兩道)。
魯迅會做錯魯迅文選的閱讀理解?有截圖為證:

所以,只要答對這十道題里的九道以上,你就實打?qū)嵉兀ㄔ谧鲱}這個維度上)超越了尤大,比他更懂 Vue 了噢!是不是很心動?
其實要求都不用這么高,只要做對六七道,就已經(jīng)可以吊打一群小有名氣的社區(qū)選手了。
所以到底都是些什么問題呢?你可以點擊 [原題傳送門] 前往觀光,但為了表示敬意,這里特地手打了一遍搬運過來:
1. Vue 實例的 data 屬性,可以在哪些生命周期中獲取到?
A. beforeCreate
B. created
C. beforeMount
D. mounted
2. 下列對 Vue 原理的敘述,哪些是正確的?
A. Vue 中的數(shù)組變更通知,通過攔截數(shù)組操作方法而實現(xiàn)
B. 編譯器目標(biāo)是創(chuàng)建渲染函數(shù),渲染函數(shù)執(zhí)行后將得到 VNode 樹
C. 組件內(nèi) data 發(fā)生變化時會通知其對應(yīng) watcher,執(zhí)行異步更新
D. patching 算法首先進(jìn)行同層級比較,可能執(zhí)行的操作是節(jié)點的增加、刪除和更新
3. 對于 Vue 中響應(yīng)式數(shù)據(jù)原理的說法,下列哪項是不正確的?
A. 采用數(shù)據(jù)劫持方式,即 Object.defineProperty() 劫持 data 中各屬性,實現(xiàn)響應(yīng)式數(shù)據(jù)
B. 視圖中的變化會通過 watcher 更新 data 中的數(shù)據(jù)
C. 若 data 中某屬性多次發(fā)生變化,watcher 僅會進(jìn)入更新隊列一次
D. 通過編譯過程進(jìn)行依賴收集
4. 下列說法不正確的是哪項?
A. key 的作用主要是為了高效地更新虛擬 DOM
B. 若指定了組件的 template 選項,render 函數(shù)不會執(zhí)行
C. 使用 vm.$nextTick 可以確保獲得 DOM 異步更新的結(jié)果
D. 若沒有 el 選項,vm.$mount(dom) 可將 Vue 實例掛載于指定元素上
5. 下列關(guān)于 Vuex 的描述,不正確的是哪項?
A. Vuex 通過 Vue 實現(xiàn)響應(yīng)式狀態(tài),因此只能用于 Vue
B. Vuex 是一個狀態(tài)管理模式
C. Vuex 主要用于多視圖間狀態(tài)全局共享與管理
D. 在 Vuex 中改變狀態(tài),可以通過 mutations 和 actions
6. 關(guān)于 Vue 組件間的參數(shù)傳遞,下列哪項是不正確的?
A. 若子組件給父組件傳值,可使用 $emit 方法
B. 祖孫組件之間可以使用 provide 和 inject 方式跨層級相互傳值
C. 若子組件使用 $emit('say') 派發(fā)事件,父組件可使用 @say 監(jiān)聽
D. 若父組件給子組件傳值,子組件可通過 props 接受數(shù)據(jù)
7. 下列關(guān)于 vue-router 的描述,不正確的是哪項?
A. vue-router 的常用模式有 hash 和 history 兩種
B. 可通過 addRoutes 方法動態(tài)添加路由
C. 可通過 beforeEnter 對單個組件進(jìn)行路由守衛(wèi)
D. vue-router 借助 Vue 實現(xiàn)響應(yīng)式的路由,因此只能用于 Vue
8. 下列說法不正確的是哪項?
A. 可通過 this.$parent 查找當(dāng)前組件的父組件
B. 可使用 this.$refs 查找命名子組件
C. 可使用 this.$children 按順序查找當(dāng)前組件的直接子組件
D. 可使用 $root 查找根組件,并可配合 children 遍歷全部組件
9. 下列關(guān)于 v-model 的說法,哪項是不正確的?
A. v-model 能實現(xiàn)雙向綁定
B. v-model 本質(zhì)上是語法糖,它負(fù)責(zé)監(jiān)聽用戶的輸入事件以更新數(shù)據(jù)
C. v-model 是內(nèi)置指令,不能用在自定義組件上
D. 對 input 使用 v-model,實際上是指定其 :value 和 :input
10. 關(guān)于 Vue 的生命周期,下列哪項是不正確的?
A. DOM 渲染在 mounted 中就已經(jīng)完成了
B. Vue 實例從創(chuàng)建到銷毀的過程,就是生命周期
C. created 表示完成數(shù)據(jù)觀測、屬性和方法的運算和初始化事件,此時 $el 屬性還未顯示出來
D. 頁面首次加載過程中,會依次觸發(fā) beforeCreate,created,beforeMount,mounted,beforeUpdate,updated
明碼標(biāo)價,童叟無欺!做對九題即可成為前端懂王,比 Evan 懂,更比他們懂:
TC39 代表?@賀師俊?50 分,他是不是走后門送禮進(jìn)的 TC39 啊?
Vue Core Team 的?@胖茶?40 分,可能說明帶他的 mentor 不懂 Vue?不過他第二次做就拿了 90 分……這很贅婿逆襲啊。
搞 react-lite 和 react-imvc 的?@工業(yè)聚?做了兩次,第一次 50 分第二次 30 分。怪不得他最近這么低調(diào),看來是越來越做不動題了。
久仰的白學(xué)家程序媛?@敖天羽?第一次拿了 60 分,然后鍥而不舍(沒有靈魂)地刷到了 100 分。這種精益求精的態(tài)度值得贊賞。
我(純屬厚臉皮湊數(shù))60 分。
好在拜天哥所賜,我們還是刷出了「權(quán)威的」參考答案,請查收:
1. BCD
2. ABCD
3. BD
4. B
5. C // 據(jù)出題人勘誤說應(yīng)該是 D
6. B
7. C
8. C
9. C
10. D
對照參考答案,尤大還進(jìn)行了認(rèn)真的復(fù)盤反省,查缺補漏:

唉,身為 Vue 的作者,居然連 Vue 的原理都沒有搞清楚,實在太不應(yīng)該了。應(yīng)該讓出題人好好教育一下他,幫他分析一下 Vue 的源碼,教他怎么通過筆試面試,趁現(xiàn)在金九銀十找份 P6 的好工作。工作以后也要記得充電,學(xué)一學(xué) Vue 3.0 的視頻教程(狗頭)。
所以按照今天的掘金體,本文完全可以起這么個標(biāo)題:《一步登天!答對這十道 Vue 題,你就能超越尤雨溪,傲視前端群雄!》
——但這不是很荒唐嗎?
如果一個人某道題沒答對,就能證明他不懂 Vue 了嗎?

看看這些題,它們能準(zhǔn)確反映答題者的水平嗎?使用它們作為考察依據(jù)時,這兩種情況都再常見不過了:
假陽性?- 只會背題庫的做題家也能混到好 offer。
假陰性?- 公認(rèn)的資深人士無法體現(xiàn)出優(yōu)勢。
這里不會去展開討論具體哪題應(yīng)該選什么,因為這早已不是這幾道題的問題,而是國內(nèi)整個「造火箭、擰螺絲」式面試文化的問題了。我曾經(jīng)寫過一個回答,逐條判定為什么 Dan Abramov 配不上阿里 P7。你看身為 Redux 作者的 Dan 就很樂意告訴你:「我其實不懂很多東西,這沒有什么關(guān)系」。而今天的例子里,我們則收集到了更多國內(nèi)一線的業(yè)界玩家們坦誠地告訴你:「這些題我也不會,這沒有什么關(guān)系」——畢竟他們的核心競爭力,可都不是做題呀。
并不是否認(rèn)這些題目對初學(xué)者有一定的幫助作用。然而實際上,越是高級和資深的崗位,需要的越不是做題,而是對開放性(技術(shù)與非技術(shù))問題的?Problem Solving?技能:
應(yīng)該怎樣在框架設(shè)計上有所突破?
應(yīng)該怎樣在幾個性能指標(biāo)間取舍平衡?
應(yīng)該怎樣靠自己的開源項目盈利?
應(yīng)該怎樣帶領(lǐng)團(tuán)隊設(shè)定計劃,完成目標(biāo)?
你當(dāng)然可以逃避這些「靈魂的拷問」,一直靠研究(或制造)那些已經(jīng)被翻來覆去解答過無數(shù)遍的題來「磨練水平」。但無可否認(rèn)的是,正是靠一群不停迎接真實世界挑戰(zhàn),持續(xù)解決開放問題的人們,才創(chuàng)造了今天業(yè)界繁榮生態(tài)的輝煌。
做題對于鍛煉思維當(dāng)然重要,但它終歸只是個跳板,不要把應(yīng)試教育的思維套用在職業(yè)生涯上。比做題更有價值的,最終一定還是去做事——
去業(yè)界前沿,去落地靈感!
去參與社區(qū),去貢獻(xiàn)代碼!
去解決問題,去把手弄臟!
相比之下,十道咬文嚼字的題里對了幾道錯了幾道,又有什么關(guān)系呢?
做題不至于誤國,但一定是實干才能興邦。
文中幾位參與者的分?jǐn)?shù),公開前均征求過本人同意。希望不要因此誤解他們的真實水平 :D
小伙伴們要不要再復(fù)習(xí)一遍Vue呢?評論回復(fù)“666”即可獲取~更有尚學(xué)堂最新最全的教程哦
