mvvm分為model、view、viewmodel三者。
model 代表資料模型，資料和業務邏輯都在model層中定義；
view 代表ui檢視，負責資料的展示；
viewmodel 負責監聽 model 中資料的改變並且控制檢視的更新，處理使用者互動操作；
model 和 view 並無直接關聯，而是通過 viewmodel 來進行聯絡的，model 和 viewmodel 之間有著雙向資料繫結的聯絡。因此當 model 中的資料改變時會觸發 view 層的重新整理，view 中由於使用者互動操作而改變的資料也會在 model 中同步。
這種模式實現了 model 和 view 的資料自動同步，因此開發者只需要專注對資料的維護操作即可，而不需要自己操作 dom。
v-html、v-show、v-if、v-for等等
v-show 僅僅控制元素的顯示方式，將 display 屬性在 block 和 none 來回切換；而v-if會控制這個 dom 節點的存在與否。當我們需要經常切換某個元素的顯示/隱藏時，使用v-show會更加節省效能上的開銷；當只需要一次顯示或隱藏時，使用v-if更加合理。
當乙個vue例項建立時，vue會遍歷data選項的屬性，用 object.defineproperty 將它們轉為 getter/setter並且在內部追蹤相關依賴，在屬性被訪問和修改時通知變化。
每個元件例項都有相應的 watcher 程式例項，它會在元件渲染的過程中把屬性記錄為依賴，之後當依賴項的 setter 被呼叫時，會通知 watcher 重新計算，從而致使它關聯的元件得以更新。
假設有乙個輸入框元件，使用者輸入時，同步父元件頁面中的資料
具體思路：父元件通過 props 傳值給子元件，子元件通過 $emit 來通知父元件修改相應的props值，具體實現如下：
import vue from 『vue』
const component =
},methods: }}
new vue(,
el: 『#root』,
template:
,
data () }})
可以看到，當輸入資料時，父子元件中的資料是同步改變的:
我們在父元件中做了兩件事，一是給子元件傳入props，二是監聽input事件並同步自己的value屬性。那麼這兩步操作能否再精簡一下呢？答案是可以的，你只需要修改父元件：
template:
v-model 實際上會幫我們完成上面的兩步操作。
比如現在需要監控data中，obj.a 的變化。vue中監控物件屬性的變化你可以這樣：
watch: ,
deep: true}}
deep屬性表示深層遍歷，但是這麼寫會監控obj的所有屬性變化，並不是我們想要的效果，所以做點修改：
watch: }}
還有一種方法，可以通過computed 來實現，只需要：
computed:
}利用計算屬性的特性來實現，當依賴改變時，便會重新計算乙個新值。
示例：
原因在於在vue例項建立時，obj.b並未宣告，因此就沒有被vue轉換為響應式的屬性，自然就不會觸發檢視的更新，這時就需要使用vue的全域性api $set()：
addobjb ()
$set()方法相當於手動的去把obj.b處理成乙個響應式的屬性，此時檢視也會跟著改變了：
delete只是被刪除的元素變成了 empty/undefined 其他的元素的鍵值還是不變。
vue.delete直接刪除了陣列 改變了陣列的鍵值。
var a=[1,2,3,4]
var b=[1,2,3,4]
delete a[1]
console.log(a)
this.$delete(b,1)
console.log(b)
加乙個首屏 loading 圖，提公升使用者體驗；
減少 http 請求數量
在瀏覽器與伺服器進行通訊時，主要是通過 http 進行通訊。瀏覽器與伺服器需要經過三次握手，每次握手需要花費大量時間。而且不同瀏覽器對資源檔案併發請求數量有限（不同瀏覽器允許併發數），一旦 http 請求數量達到一定數量，資源請求就存在等待狀態，這是很致命的，因此減少 http 的請求數量可以很大程度上對**效能進行優化。
css sprites：國內俗稱 css 精靈，這是將多張合併成一張達到減少 http 請求的一種解決方案，可以通過 css background 屬性來訪問內容。這種方案同時還可以減少總位元組數。
合併 css 和 js 檔案：現在前端有很多任務程化打包工具，如：grunt、gulp、webpack等。為了減少 http 請求數量，可以通過這些工具再發布前將多個 css 或者 多個 js 合併成乙個檔案。
採用 lazyload：俗稱懶載入，可以控制網頁上的內容在一開始無需載入，不需要發請求，等到使用者操作真正需要的時候立即載入出內容。這樣就控制了網頁資源一次性請求數量。
控制資源檔案載入優先順序
瀏覽器在載入 html 內容時，是將 html 內容從上至下依次解析，解析到 link 或者 script 標籤就會載入 href 或者 src 對應鏈結內容，為了第一時間展示頁面給使用者，就需要將 css 提前載入，不要受 js 載入影響。
一般情況下都是 css 在頭部，js 在底部。
利用瀏覽器快取
瀏覽器快取是將網路資源儲存在本地，等待下次請求該資源時，如果資源已經存在就不需要到伺服器重新請求該資源，直接在本地讀取該資源。
減少重排（reflow）
基本原理：重排是 dom 的變化影響到了元素的幾何屬性（寬和高），瀏覽器會重新計算元素的幾何屬性，會使渲染樹中受到影響的部分失效，瀏覽器會驗證 dom 樹上的所有其它結點的 visibility 屬性，這也是 reflow 低效的原因。如果 reflow 的過於頻繁，cpu 使用率就會急劇上公升。
減少 reflow，如果需要在 dom 操作時新增樣式，盡量使用 增加 class 屬性，而不是通過 style 操作樣式。
減少 dom 操作
圖示使用 iconfont 替換
. 網頁從輸入**到渲染完成經歷了哪些過程？)
大致可以分為如下7步：
](12. jquery獲取的dom物件和原生的dom物件有何區別？)
js原生獲取的dom是乙個物件，jquery物件就是乙個陣列物件，其實就是選擇出來的元素的陣列集合，所以說他們兩者是不同的物件型別不等價。
原生dom物件轉jquery物件：
var box = document.getelementbyid(『box』);
var $box = $(box);
jquery物件轉原生dom物件：
var $box = $(』#box』);
var box = $box[0];
如何擴充套件自定義方法)
(jquery.fn.mymethod=function () )
// 或者：
(function ($)
})})(jquery)
使用：$("#div").mymethod();
2019前端面試題彙總（主要為Vue）
新增obj.b 加乙個首屏 loading 圖，提公升使用者體驗 合併 css 和 js 檔案 現在前端有很多任務程化打包工具，如 grunt gulp webpack等。為了減少 http 請求數量，可以通過這些工具再發布前將多個 css 或者 多個 js 合併成乙個檔案。採用 lazyload ...
前端面試題2019
2.下列哪個方法可以 物件的讀和寫？object.defineproperty proxy object.frzee object.assign 3.請選出 執行後列印的輸出 4.選出可以阻止 form 的 submit 的方法？onsubmit function event onsubmit fu...
2019前端面試大廠面試題
後面題目是我從各大廠面試題總結的一些經驗 需要key的原因是 使用v for更新已經渲染的元素列表時，預設採用 就地復用 策略，列表中資料發生改變時，此時的key就開始工作，根據key值去判斷某個值是否被修改，如果修改了的話，則重新渲染這一項，否則復用之前的元素 根據這個原因，我們可以知道，key值...