近幾年前端技術棧真是發展的太迅速了，從以前的針對dom操作的框架如jquery，ext.js等框架逐步過渡到當前的mvvm模式，讓前端開發者將注意力從dom操作逐漸解脫出來，專注于邏輯的實現，個人認為開發效率至少提升了1倍，mvvm模式的一個核心便是數據的雙向綁定。

什么是數據的雙向綁定？

上面說的是在vue框架中數據雙向綁定的應用，個人認為這個特性很贊，是大幅提升開發效率的關鍵，那如果脫離mvvm的框架，我也想實現這種數據的雙向綁定，可不可以實現了，該如何實現了？

用原生js模擬數據雙向綁定

實現步驟：

一：用js監聽數據的變化并將變化的數據時時的同步到頁面

為了實現這個功能我們需要用到js的一個方法Object.defineProperty

推薦下我的前端群：524262608，不定期會有干貨分享，初學者還有一套整理好的入門教程，歡迎初學者和進階中的小伙伴。

1.屬性介紹

2.方法介紹

大概的介紹了defineProperty核心的兩個方法，看到這里，你就知道可以利用這兩個內置方法搞事情了，看下面利用該方法實現數據雙向綁定的一個例子

效果如下，當姓名發生變化時后面的輸入框中的值也同步發生變化：

小結：雖然對此屬性沒有太研究，但是感覺還是蠻新鮮的，之前只是用到了mvvm模式帶來的便捷卻不知道如何去實現，完全么有思路的說，但是小伙伴們，你們看完上述代碼，現在心中的疑惑應該會少很多哈，，嘎嘎。