<template>
<div id="app">
<input type="text" v-model='msg'>
<div>
<p>{{msg}}</p>
</div>
</div>
</template> <script> class Observer{
static _observe(obj){
for(var key in obj){
//遍历obj对象 var value =obj[key];
if(typeof value ==='object'){
//如果值还是对象,则遍历处理
Observer._observe(value);
}
console.log("========def" ,key);
Object.defineProperty(obj, key, {
enumerable: true,
configurable: true,
set: function (newValue) {
if( value !== newValue ) {
var value = newValue;
console.log('setter:' + newValue);
}
},
get: function () {
console.log('getter:' +value);
return value;
}
}); }
}
} class VM{
constructor(options){
this.$options = options;
this._obverse(this.$options.data);
return Object.assign({data:this.$options.data}, this.$options.methods );
}
_obverse(data) {
return Observer._observe(data);
} }
var vm = new VM({
el: '#app',
data: {
msg:'hello'
},
methods: {
hello:function(){
console.log("hello");
}
}
}) vm.data.msg = "wwww"
var x = vm.data.msg;
vm.hello(); </script>

virtualvm2 观察者模式的更多相关文章

  1. 23种设计模式--观察者模式-Observer Pattern

    一.观察者模式的介绍      观察者模式从字面的意思上理解,肯定有两个对象一个是观察者,另外一个是被观察者,观察者模式就是当被观察者发生改变得时候发送通知给观察者,当然这个观察者可以是多个对象,在项 ...

  2. 谈谈JS的观察者模式(自定义事件)

    呼呼...前不久参加了一个笔试,里面有一到JS编程题,当时看着题目就蒙圈...后来研究了一下,原来就是所谓的观察者模式.就记下来...^_^ 题目 [附加题] 请实现下面的自定义事件 Event 对象 ...

  3. ObserverPattern(观察者模式)

    import java.util.ArrayList; import java.util.List; /** * 观察者模式 * @author TMAC-J * 牵一发而动全身来形容观察者模式在合适 ...

  4. java观察者模式

      像activeMQ等消息队列中,我们经常会使用发布订阅模式,但是你有没有想过,客户端时如何及时得到订阅的主题的信息?其实就里就用到了观察者模式.在软件系统中,当一个对象的行为依赖于另一个对象的状态 ...

  5. Backbone源码解析(六):观察者模式应用

    卤煮在大概一年前写过backbone的源码分析,里面讲的是对一些backbone框架的方法的讲解.这几天重新看了几遍backbone的源码,才发现之前对于它的理解不够深入,只关注了它的一些部分的细节和 ...

  6. PHP 高级编程(3/5) - 使用SPL(标准PHP库)实现观察者模式

    SPL(标准PHP库 - Standard PHP Library)是PHP5面向对象功能中重要的部分.原文解释是这样的“The Standard PHP Library (SPL) is a col ...

  7. 设计模式--观察者模式初探和java Observable模式

    初步认识观察者模式 观察者模式又称为发布/订阅(Publish/Subscribe)模式,因此我们可以用报纸期刊的订阅来形象的说明: 报社方负责出版报纸. 你订阅了该报社的报纸,那么只要报社发布了新报 ...

  8. 学C#之设计模式系列笔记(2)观察者模式

    一.借鉴说明 1.<Head First Design Patterns>(中文名<深入浅出设计模式>) 2.维基百科,观察者模式,https://zh.wikipedia.o ...

  9. PHP 观察者模式

    观察者模式:定义对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都得到通知并被自动更新. [观察者模式中主要角色] 1.抽象主题(Subject)角色: 抽象主题提供了增加 ...

  10. GJM: 设计模式 - 观察者模式

    GJM : 观察者模式 视频地址: http://www.imooc.com/learn/415 本课程通过一个天气预报的发布和订阅案例,来讲解观察者模式在Java项目中的应用.主要包括观察者模式的结 ...

随机推荐

  1. (K8s学习笔记四)常用命令实例

    1.显示Pod的更多信息 kubectl get pod <pod-name> -o wide kubectl get pods -show-all # 查看已经停止的Pod 2.以yam ...

  2. Cloud9 3.0 SDK安装

    Cloud9 IDE是一个基于Node.JS构建的JavaScript程序开发Web IDE.它拥有一个非常快的文本编辑器支持为JS, HTML, CSS和这几种的混合代码进行着色显示.Cloud9 ...

  3. 摩托罗拉IP PBX9000配置指南

    400通话时,按数字键进行选择无效 打开IPB通信板界面,SIP终端参数--应用设置--点击RFC2833数值,默认禁用变更为101,(如有多个勾选批量,填写批量数值)--提交--保存修改 未完待续

  4. C/C++/中宏特殊字符的含义及用法总结(“#”、“##”、"#@"、“\”等等)

    在C/C++中,宏定义是由define完成的,宏定义中有几种常见的特殊字符需要我们了解,常用的特殊字符有以下几种: #:在宏展开的时候会将#后面的参数替换成字符串: 字符串化##:将前后两个的单词拼接 ...

  5. Android开发数据库Sqlite

    创建数据库 首先我们要了解这个类:SQLiteOpenHelper: 1.写一个类继承SQLiteOpenHelper 2.实现里面的方法,创建构造方法 参数解释: /** @param: conte ...

  6. VUE2.0 脚手架搭建项目,如何配置本地IP地址访问项目,详解

    1.首先找到config文件夹目录下的 index.js文件 // Various Dev Server settings //host: 'localhost' //将localhost进行替换成 ...

  7. python实现字典的排序

    var dic = {c:4, a:2, d:3, b:1}; // 定义一个字典 console.log("输出最初的字典元素: "); for(var key in dic){ ...

  8. react native 更改项目包名

    修改工程名,需要以下几个步骤: 修改android/app/build.gradle里的applicationId,为新包名,譬如:com.xxx.yyy.myProject 修改android/ap ...

  9. mac_office2019

    mac_office2019下载 1,链接地址: mac_office2019: https://590m.com/d/28636472-44062040-dc385f (访问密码:7410) 2, ...

  10. leecode编写记录

    记录leecode刷题思路 39.组合总数 39. 组合总和 - 力扣(LeetCode) 给你一个 无重复元素 的整数数组 candidates 和一个目标整数 target ,找出 candida ...