问题:

一:说一下使用 JQuery和使用框架的区别?

二: 说一下对 MVVM的理解

三: Vue中如何实现响应式

四: vue中如何解析模板

五:vue整个实现流程

1。 说一下使用 JQuery和使用框架的区别?

数据和视图的分离

比如jquery, ul 下没有视图元素 li,而是在js中,也就是 视图和数据没有分离。

以数据驱动视图。vue

2 谈一下 mvc mvvc等

mvc : view触发 controller,controller改变 model数据,然后在渲染view(一般用于后端语言)

VUE——MVVC

数据桥的存在 分离了 view 和 数据model

3 vue中如何实现响应式(响应式就是 修改data属性之后,vue立刻能监听到)

Object.defineProperty 是vue中实现响应式的核心函数

说明:

vm实际上是 vue的实例,

1: vue是如何进行监听数据变化的?

2: data的变化如何绑定到 vue上的?

根据核心函数 Object.defineProperty ,第一参数就是vm,第二个参数就是 定义data中的key值,两个回调函数,一个是get 一个是set,在获取vm.name的时候 触发get函数。在设置 vm.name的时候,触发set函数。其中用到了闭包的知识,每次循环的时候,都会有set和get方法。

Object.defineProperty 定义属性方法,主要有两个功能,一 给 vm定义 data中key的属性;二 监听set 和 get方法。

四: vue中如何解析模板

4.1 模板是什么?

4.2 render 函数

4.3 render函数与dom

4.1 模板是什么?

他的特点是: 本质是字符串,有逻辑如v-if v-for 等。与html格式很像,但有很大区别,最终还要转成html;因此,模版最终要转成一个JS函数,render函数

使用了width方法(平时不建议使用,因为逻辑不清晰)

=======================================================================

vue中使用了with方法:左侧模板转换成了右侧的js函数:

模版中所有信息都包含在了render函数中,this即vm,

price==>this.price==>vm.price==>即data中的price

_c

MVVM框架(Vue)的更多相关文章

  1. vue.js学习笔记(一):什么是mvvm框架,vue.js的核心思想

    一:MVVM框架 MVVM框架的应用场景:  1.针对具有复杂交互逻辑的前端应用 2.提供基础的架构抽象 3.提供ajax数据持久化,保证前端用户体验 二:vue.js的核心思想 (一):数据驱动 ( ...

  2. 实现一个类 Vue 的 MVVM 框架

    Vue 一个 MVVM 框架.一个响应式的组件系统,通过把页面抽象成一个个组件来增加复用性.降低复杂性 主要特色就是数据操纵视图变化,一旦数据变化自动更新所有关联组件~ 所以它的一大特性就是一个数据响 ...

  3. 【学习笔记】剖析MVVM框架,简单实现Vue数据双向绑定

    前言: 学习前端也有半年多了,个人的学习欲望还比较强烈,很喜欢那种新知识在自己的演练下一点点实现的过程.最近一直在学vue框架,像网上大佬说的,入门容易深究难.不管是跟着开发文档学还是视频教程,按步骤 ...

  4. 基于vue实现一个简单的MVVM框架(源码分析)

    不知不觉接触前端的时间已经过去半年了,越来越发觉对知识的学习不应该只停留在会用的层面,这在我学jQuery的一段时间后便有这样的体会. 虽然jQuery只是一个JS的代码库,只要会一些JS的基本操作学 ...

  5. Vue.js-----轻量高效的MVVM框架(一、初识Vue.js)

    1.什么是Vue.js? 众所周知,最近几年前端发展非常的迅猛,除各种框架如:backbone.angular.reactjs外,还有模块化开发思想的实现库:sea.js .require.js .w ...

  6. Vue中的MVVM框架

    ViewModel:数据双向绑定 场景: 针对具有复杂交互逻辑的前段应用 提供基础的架构抽象 通过Ajax数据持久化,保证前端用户体验  什么是vue.js? 是一个轻量级的mvvm框架 数据驱动+组 ...

  7. 直播课(1)如何通过数据劫持实现Vue(mvvm)框架

    19.6.28更新: 这篇博客比较完善:将每一部分都分装在单独的js文件中: 剖析Vue原理&实现双向绑定MVVM 半个月前看的直播课,现在才自己敲了一遍,罪过罪过 预览: 思路: 简单实现V ...

  8. 剖析手写Vue,你也可以手写一个MVVM框架

    剖析手写Vue,你也可以手写一个MVVM框架# 邮箱:563995050@qq.com github: https://github.com/xiaoqiuxiong 作者:肖秋雄(eddy) 温馨提 ...

  9. MVVM框架三巨头之Vue的前世今生。

    前端有三宝,Angular,Vue,React.目前这三大主流JS框架已经成三分之势.其中的React框架是由脸书开发的,今天我们就来聊一聊VueJS的前世今生. 前世 在2013年的js开发者大会上 ...

  10. Vue生命周期和MVVM框架

    生命周期 组件从开始到结束的全过程 创建阶段:beforeCreate.created 挂载阶段:beforeMount.mounted 更新阶段:beforeUpdate.updated 销毁阶段: ...

随机推荐

  1. (1) laravel php artisan list make

    php artisan list make Laravel Framework 5.4.36 Usage: command [options] [arguments] Options: -h, --h ...

  2. sas(Serial Attached SCSI)技术详解

    1.什么是SAS 即串行SCSI技术,是一种磁盘连接技术,它综合了并行SCSI和串行连接技术(FC,SSA,IEEE1394)的优势,以串行通讯协议为协议基础架构,采用SCSI-3扩展指令集,并兼容S ...

  3. [转帖]降低 80% 的读写响应延迟!我们测评了 etcd 3.4 新特性(内含读写发展史)

      降低 80% 的读写响应延迟!我们测评了 etcd 3.4 新特性(内含读写发展史) https://www.cnblogs.com/alisystemsoftware/p/11555426.ht ...

  4. VLAN之间通信-三层交换机实现

    1.打开三层交换机的命令行,配置VLAN和设置端口IP enable //进入特权模式 configure terminal //进入全局配置模式 ip routing //启动交换机的路由功能 vl ...

  5. 封装ADO库之MFC应用

    Microsoft Activex Data Objects(ADO)支持用于建立基于客户端/服务器和web的应用程序开发的主要功能.其主要优点是易于使用.高速度.低内存支出和占用磁盘空间较少. 本次 ...

  6. Python习题003

    作业一:将字符串”k:1/k1:2/k2:3/k3:4”处理成字典(比较难) 方法一 list = 'k:1/k1:2/k2:3/k3:4' new_list = list.split("/ ...

  7. Firefox在新标签页打开“书签”和“搜索栏”(无需插件)

    转自   初来灬炸到的博客 前言 每次打开书签前,都需要创建新标签页. 每次搜索前,都需要创建新标签页.  这个真滴很麻烦.下面介绍的方法非常简单,不需要任何插件,通过修改浏览器参数即可. 名词 设置 ...

  8. rm 参数列表过长

    刚摸索了一个小技巧,有时候在删除文件的时候,文件很多,直接用rm -rf * ,会报错误“rm 参数列表过长”. 这时候网上的办法一般都是通过类似的办法:find . -name "&quo ...

  9. SAS学习笔记45 宏系统选项及其他

    关于宏的系统选项 MCOMPILENOTE=NONE|NOAUTOCALL|ALL 该系统选项控制是否在日志当中显示宏程序编译时的信息,默认值为NONE,也就是不显示.其中NOAUTOCALL针对的是 ...

  10. ORA-07445: exception encountered: core dump [opiaba()+639] [SIGSEGV] [ADDR:0x0] [PC:0x1858C3F] [SI_KERNEL(general_protection)] []

    开发反馈应用无法连接数据库,发现数据库实例崩溃,且数据库为11.2.0.4 单实例. 数据库告警日志发现,数据库崩溃之前出现ORA- ORA-: exception encountered: core ...