vue（1）

1、前言概述

• 前言：最進剛剛瞭解了前端的三大框架vue、angular、react，簡單談談對三大框架的認識；

  1. 對於vue，目前在國內十分受歡迎，國外仍是比較喜歡其餘框架，react國內也有許多公司使用。瞭解一門框架首先知道爲何產生，框架是什麼樣是東西，爲何須要用到他以及如何正確用好它。
  2. vue是一個漸進式的框架：漸進式就是不須要使用vue提供全部的功能，好比任何一個html文件只須要引入vue.js文件就能夠使用vue的功能（vue有哪些功能，等下一一介紹），引入vue.js文件就至關於爲該html文件中添加一個Vue對象；
  3. Vue對象：Vue對象中包含兩個部分（1）Vue()構造函數，能夠經過該方法生成無數個Vue的實例;(2)prototype原型對象：該對象中存在許多個實例方法，也即Vue的任何一個實例均可以使用原型對象中方法

  4. vue的實現的原理：採用的是MVVM設計模式實現三部分：

     • model：模型中存儲的都是數據
     • view ：視圖中顯示數據
     • modelview：實現業務邏輯處理

  5. 兩大核心繫統：監聽系統與虛擬DOM樹

     • 監聽系統：vue框架爲model（也即就是下方代碼中data中的數據）中的變量都添加了一對get/set方法，有點相似es5中的訪問器屬性【訪問器屬性不能直接定義，要經過Object.defineProperty()這個方法來定義。】，當試圖修改model中的數據時，vue自動調用set方法，獲取數據時，又自動調用get方法

     • 虛擬DOM樹：當試圖修改model中的數據時，此時虛擬DOM樹要作的事就是遍歷虛擬DOM樹找出視圖中綁定該數據的部分，而且更新真實DOM樹（前提：該DOM樹必須被監視（以下方的代碼中：el:"#app"）,也即就是隻有在id爲app的節點下的節點被監視

       //代碼：
       var vm = new Vue({
       el:"#app",
       data:{
       uname:"field",
       age:20
       },
       methods:{
       
       }
       })

未完待續（第一次寫文章給本身看的）