zy幫 - 二面

• 推動(dòng)代碼規(guī)范化，你借助了什么工具？是怎么思考的？

  • 什么是規(guī)范化
  1. 看起來像一個(gè)人寫的
  • 代碼風(fēng)格、文件命名、目錄結(jié)構(gòu)、提交規(guī)范等規(guī)范化的具體落地
  • 目的：為了項(xiàng)目的可維護(hù)性、一致性、可讀性而努力，最終能夠提高團(tuán)隊(duì)協(xié)作的效率
  2. 細(xì)化
  • 文件結(jié)構(gòu)
  • 代碼規(guī)范，變量命名，函數(shù)，風(fēng)格統(tǒng)一，eslint + prettier + stylelint
  • 提交規(guī)范
  • 單詞拼寫規(guī)范

  操作代碼、解析代碼（babel），eslint parser 轉(zhuǎn)化代碼以后再對代碼操作（規(guī)范、格式化）

  • js 規(guī)范化
    eslint，專門來做語言質(zhì)量檢查
    eslint 首先依然要構(gòu)建 ast

• eslint 規(guī)范約定

  • 規(guī)范等級
  • off
  • warn
  • error
  • 核心規(guī)則
    • 語法檢查
    • 風(fēng)格一致性
    • 最佳實(shí)踐
  • 大量的規(guī)范來控制這些代碼編寫
  • eslint + prettier 集成

zxg際 - 二面

• diff 算法
  它主要是比較新舊虛擬 DOM 樹來找出差異。首先，它會對兩棵樹的根節(jié)點(diǎn)進(jìn)行比較。如果根節(jié)點(diǎn)類型不同，就直接替換整個(gè) DOM 樹。若根節(jié)點(diǎn)類型相同，就開始比較屬性和子節(jié)點(diǎn)。
  在比較子節(jié)點(diǎn)時(shí)，它采用了多種策略。簡單的情況是，新舊子節(jié)點(diǎn)都是文本節(jié)點(diǎn)，那就直接比較文本內(nèi)容是否變化。對于多個(gè)節(jié)點(diǎn)的比較，它會盡量采用最少的操作來更新 DOM。通過為節(jié)點(diǎn)添加 key 屬性，它能更精準(zhǔn)地復(fù)用和更新節(jié)點(diǎn)，而不是盲目地重新創(chuàng)建。比如，一個(gè)列表更新，有了 key 就能快速定位哪些元素新增、刪除或者修改，然后高效地把這些變化應(yīng)用到真實(shí) DOM 上，減少不必要的 DOM 操作，提升性能。

• 虛擬 dom
  Vue 的虛擬 DOM 是真實(shí) DOM 的 JavaScript 對象表示。創(chuàng)建時(shí)依據(jù)模板或渲染函數(shù)生成初始虛擬 DOM 樹；數(shù)據(jù)變化就重造新樹并用 Diff 算法找差異，分層、依節(jié)點(diǎn)屬性對比；最后批量將差異應(yīng)用到真實(shí) DOM，提升性能、優(yōu)化開發(fā)體驗(yàn)。

• 父組件傳的值改變了，子組件一定會重新渲染嗎

• 如何排查數(shù)據(jù)改變了，但是頁面沒有刷新的問題

• vue 組件之間數(shù)據(jù)通信底層原理

  • 觀察者模式

• 觀察者模式、訂閱發(fā)布模式

  1. 觀察者模式

• 對產(chǎn)品來說什么樣的原型圖是合格的

  1. 清晰展示功能流程與布局
  2. 準(zhǔn)確傳達(dá)交互設(shè)計(jì)細(xì)節(jié)
  3. 包含必要的注釋與說明

• 如何保證項(xiàng)目交付質(zhì)量

  1. 明確的項(xiàng)目目標(biāo)和需求定義
  2. 有效的項(xiàng)目計(jì)劃和進(jìn)度管理
  3. 嚴(yán)格的質(zhì)量控制措施
  4. 團(tuán)隊(duì)協(xié)作和溝通優(yōu)化

• 和后端有沖突如何解決

  1. 明確職責(zé)分工（項(xiàng)目啟動(dòng)會議）
  2. 建立有效的溝通機(jī)制（項(xiàng)目進(jìn)度會議）
  3. 理解對方的工作內(nèi)容和技術(shù)難點(diǎn)（技術(shù)分享）
  4. 通過接口文檔來協(xié)作

• 期望總包
  我相信自己的專業(yè)技能和工作經(jīng)驗(yàn)?zāi)軌驗(yàn)楣驹陧?xiàng)目推進(jìn)、業(yè)務(wù)拓展等方面帶來顯著的收益，我期望的總包也是基于我能夠?yàn)楣咀龀龅呢暙I(xiàn)來考慮的