（守望_2019）

1.說說MVC和MVVM分別是什么合溺？

MVC全名是Model View 劲弦。是Controller模型(model)－視圖(view)－控制器(controller)的縮寫置尔。MVC是比較直觀的架構模式妄讯，用戶操作->View（負責接收用戶的輸入操作）->Controller（業(yè)務邏輯處理）->Model（數(shù)據(jù)持久化）->View（將結果反饋給View）趋惨。

MVVM是Model-View-ViewModel的簡寫鸟顺，MVVM是將“數(shù)據(jù)模型數(shù)據(jù)雙向綁定”的思想作為核心，因此在View和Model之間沒有聯(lián)系器虾，通過ViewModel進行交互讯嫂，而且Model和ViewModel之間的交互是雙向的，因此視圖的數(shù)據(jù)的變化會同時修改數(shù)據(jù)源兆沙，而數(shù)據(jù)源數(shù)據(jù)的變化也會立即反應view欧芽。

2.請描述你所熟悉的Web服務器框架(如Django)作為一個成熟的Web框架，需要提供哪些重要的功能模塊葛圃？

提供了網站開發(fā)的常用模塊：處理用戶請求千扔、操作數(shù)據(jù)庫憎妙、模板渲染、配置文件管理等

image.png

Node

3.Node.js的適用場景曲楚？

高并發(fā)尚氛、聊天、實時消息推送

實時應用：如在線聊天洞渤，實時通知推送等等（如socket.io）

分布式應用：通過高效的并行I/O使用已有的數(shù)據(jù)

工具類應用：海量的工具阅嘶，小到前端壓縮部署（如grunt），大到桌面圖形界面應用程序

游戲類應用：游戲領域對實時和并發(fā)有很高的要求（如網易的pomelo框架）

利用穩(wěn)定接口提升Web渲染能力

前后端編程語言環(huán)境統(tǒng)一：前端開發(fā)人員可以非吃仄快速地切入到服務器端的開發(fā)（如著名的純Javascript全棧式MEAN架構）

?g是什么讯柔？

在Node.js中-g表示全局安裝模塊

4.了解npm，spm护昧，nodejs嗎魂迄，請簡要描述？

NPM便于JavaScript開發(fā)者共享和重用代碼惋耙，它可以很容易地更新你的代碼捣炬；再分享。是全球最大的開源庫生態(tài)系統(tǒng)绽榛。

SPM是淘寶社區(qū)電商業(yè)務（xTao）為外部合作伙伴（外站）提供的一套跟蹤引導成交效果數(shù)據(jù)的解決方案湿酸。

Node.js 是一個基于 Chrome V8 引擎的 JavaScript 運行環(huán)境。Node.js 使用了一個事件驅動灭美、非阻塞式 I/O 的模型推溃，使其輕量又高效。它使我們能夠在本地運行javascript届腐。

(如果會用node)知道route, middleware, cluster, nodemon, pm2, server-side rendering么?

服務器Node.js和瀏覽器js的區(qū)別是什么铁坎？Node.js把js從客戶端遷移了到服務端、主要做了哪些工作犁苏？為什么說Node.js適合做高并發(fā)的互聯(lián)網應用硬萍？

Node采用一系列“非阻塞”庫來支持事件循環(huán)的方式。本質上就是為文件系統(tǒng)围详、數(shù)據(jù)庫之類的資源提供接口朴乖。Node.js 使用事件驅動，非阻塞I/O 模型而得以輕量和高效短曾，非常適合在分布式設備上運行數(shù)據(jù)密集型的實時應用寒砖。

對Node的優(yōu)點和缺點提出了自己的看法？

*（優(yōu)點）因為Node是基于事件驅動和無阻塞的嫉拐，所以非常適合處理并發(fā)請求哩都，

因此構建在Node上的代理服務器相比其他技術實現(xiàn)（如Ruby）的服務器表現(xiàn)要好得多。

此外婉徘，與Node代理服務器交互的客戶端代碼是由javascript語言編寫的漠嵌，

因此客戶端和服務器端都用同一種語言編寫咐汞，這是非常美妙的事情。

*（缺點）Node是一個相對新的開源項目儒鹿，所以不太穩(wěn)定化撕，它總是一直在變，

而且缺少足夠多的第三方庫支持约炎≈惨酰看起來，就像是Ruby/Rails當年的樣子圾浅。

image.png

React

react虛擬DOM運行機制是什么掠手？

在React中，render執(zhí)行的結果得到的并不是真正的DOM節(jié)點狸捕，結果僅僅是輕量級的JavaScript對象喷鸽，我們稱之為virtual DOM（虛擬dom）

react中prop和state的區(qū)別？

需要理解的是灸拍，props是一個父組件傳遞給子組件的數(shù)據(jù)流做祝，這個數(shù)據(jù)流可以一直傳遞到子孫組件。而state代表的是一個組件內部自身的狀態(tài)（可以是父組件鸡岗、子孫組件）混槐。

redux的原理？

Redux 把一個應用程序中纤房，所有應用模塊之間需要共享訪問的數(shù)據(jù)纵隔，都應該放在 State 對象中翻诉。這個應用模塊可能是指 React Components炮姨，也可能是你自己訪問 AJAX API 的代理模塊，具體是什么并沒有一定的限制碰煌。State 以 “樹形” 的方式保存應用程序的不同部分的數(shù)據(jù)舒岸。這些數(shù)據(jù)可能來自于網絡調用、本地數(shù)據(jù)庫查詢芦圾、甚至包括當前某個 UI 組件的臨時執(zhí)行狀態(tài)（只要是需要被不同模塊訪問）

react和vue有哪些不同蛾派，說說你對這兩個框架的看法

相同點

都支持服務器端渲染

都有Virtual DOM,組件化開發(fā),通過props參數(shù)進行父子組件數(shù)據(jù)的傳遞,都實現(xiàn)webComponent規(guī)范

數(shù)據(jù)驅動視圖

都有支持native的方案,React的React native,Vue的weex

不同點

React嚴格上只針對MVC的view層,Vue則是MVVM模式

virtual DOM不一樣,vue會跟蹤每一個組件的依賴關系,不需要重新渲染整個組件樹.而對于React而言,每當應用的狀態(tài)被改變時,全部組件都會重新渲染,所以react中會需要shouldComponentUpdate這個生命周期函數(shù)方法來進行控制

組件寫法不一樣, React推薦的做法是 JSX + inline style, 也就是把HTML和CSS全都寫進JavaScript了,即’all in js’; Vue推薦的做法是webpack+vue-loader的單文件組件格式,即html,css,js寫在同一個文件;

數(shù)據(jù)綁定: vue實現(xiàn)了數(shù)據(jù)的雙向綁定,react數(shù)據(jù)流動是單向的

state對象在react應用中不可變的,需要使用setState方法更新狀態(tài);在vue中,state對象不是必須的,數(shù)據(jù)由data屬性在vue對象中管理

image.png

Vue

怎么定義vue-router的動態(tài)路由？怎么獲取傳過來的動態(tài)參數(shù)?

在router目錄下的index.js文件中个少，對path屬性加上/:id洪乍。 使用router對象的params.id

vue-router有哪幾種導航鉤子?

三種，一種是全局導航鉤子：router.beforeEach(to,from,next)夜焦，作用：跳轉前進行判斷攔截壳澳。第二種：組件內的鉤子；第三種：單獨路由獨享組件

vuex是什么茫经？怎么使用巷波？哪種功能場景使用它萎津？

vue框架中狀態(tài)管理。在main.js引入store抹镊，注入锉屈。新建了一個目錄store，….. export 垮耳。場景有：單頁應用中颈渊，組件之間的狀態(tài)。音樂播放终佛、登錄狀態(tài)儡炼、加入購物車

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

vue.js 是采用數(shù)據(jù)劫持結合發(fā)布者-訂閱者模式的方式查蓉，通過Object.defineProperty()來劫持各個屬性的setter乌询，getter，在數(shù)據(jù)變動時發(fā)布消息給訂閱者豌研，觸發(fā)相應的監(jiān)聽回調妹田。

請詳細說下你對vue生命周期的理解？

總共分為8個階段創(chuàng)建前/后鹃共，載入前/后鬼佣，更新前/后，銷毀前/后霜浴。

創(chuàng)建前/后： 在beforeCreated階段晶衷，vue實例的掛載元素$el和數(shù)據(jù)對象data都為undefined，還未初始化阴孟。在created階段晌纫，vue實例的數(shù)據(jù)對象data有了，$el還沒有永丝。

載入前/后：在beforeMount階段锹漱，vue實例的$el和data都初始化了，但還是掛載之前為虛擬的dom節(jié)點慕嚷，data.message還未替換哥牍。在mounted階段，vue實例掛載完成喝检，data.message成功渲染嗅辣。

更新前/后：當data變化時，會觸發(fā)beforeUpdate和updated方法挠说。

銷毀前/后：在執(zhí)行destroy方法后澡谭，對data的改變不會再觸發(fā)周期函數(shù)，說明此時vue實例已經解除了事件監(jiān)聽以及和dom的綁定纺涤，但是dom結構依然存在

說下vue組件之間的通信译暂？

非父子組件間通信抠忘，Vue 有提供 Vuex，以狀態(tài)共享方式來實現(xiàn)同信外永，對于這一點崎脉，應該注意考慮平衡，從整體設計角度去考量伯顶，確保引入她的必要囚灼。

父傳子: this.$refs.xxx 子傳父: this.$parent.xxx

還可以通過$emit方法出發(fā)一個消息，然后$on接收這個消息

什么是RESTful API祭衩？怎么使用?

是一個api的標準灶体，無狀態(tài)請求。請求的路由地址是固定的掐暮，如果是tp5則先路由配置中把資源路由配置好蝎抽。標準有：.post .put .delete

image.png

Webpack

談談你對webpack的看法

WebPack 是一個模塊打包工具，你可以使用WebPack管理你的模塊依賴路克，并編繹輸出模塊們所需的靜態(tài)文件樟结。它能夠很好地管理、打包Web開發(fā)中所用到的HTML精算、JavaScript瓢宦、CSS以及各種靜態(tài)文件（圖片、字體等）灰羽，讓開發(fā)過程更加高效驮履。對于不同類型的資源，webpack有對應的模塊加載器廉嚼。webpack模塊打包器會分析模塊間的依賴關系玫镐，最后 生成了優(yōu)化且合并后的靜態(tài)資源。

webpack的兩大特色：

code splitting（可以自動完成）

loader 可以處理各種類型的靜態(tài)文件前鹅，并且支持串聯(lián)操作

webpack 是以commonJS的形式來書寫腳本滴摘悴，但對 AMD/CMD 的支持也很全面，方便舊項目進行代碼遷移舰绘。

webpack具有requireJs和browserify的功能，但仍有很多自己的新特性：

對 CommonJS 葱椭、 AMD 捂寿、ES6的語法做了兼容

對js、css孵运、圖片等資源文件都支持打包

串聯(lián)式模塊加載器以及插件機制秦陋，讓其具有更好的靈活性和擴展性，例如提供對CoffeeScript治笨、ES6的支持

有獨立的配置文件webpack.config.js

可以將代碼切割成不同的chunk驳概，實現(xiàn)按需加載赤嚼，降低了初始化時間

支持 SourceUrls 和 SourceMaps，易于調試

具有強大的Plugin接口顺又，大多是內部插件更卒，使用起來比較靈活

webpack 使用異步 IO 并具有多級緩存。這使得 webpack 很快且在增量編譯上更加快