js观察者模式学习

      function Events(){
            var obj = {};
            this.on=function(key,fn){
               var stack;
               stack = obj[key] || (obj[key] =[]);

               return stack.push(fn);
            }
            this.off=function(key){

                var stack;
                return (stack=obj[key]) != null ? stack.length=0 : void 0;//此处stack.length=0不等同于stack=[],如果设置stack=[],并不能作用于object[key]
            }
            this.once=function(key,fn){
                this.off(key);
                return this.on(key,fn);
            }
            this.trigger=function(){
                var key,stack,i;
                key = [].shift.call(arguments);
                stack = obj[key]||(obj[key] = []);
                for(i=0;i<stack.length;i++){
                    stack[i].apply(this,arguments);
                }
            }
        }
        var events = new Events();
        events.on("play",function(data){
            console.log(data.name)
        });
        events.on("play",function(data){
            console.log(data.age)
        });
        events.trigger("play",{name:"dpd",age:13})
时间: 2024-12-25 02:28:40

js观察者模式学习的相关文章

JS入门学习,写一个时钟~

<!-- 耽搁了几天,于是又继续回到JS的学习了~~ 各种头大,加油吧... --> <!doctype html><html><head> <title>数码时钟</title> <meta charset="gb2312"> <style type="text/css"> *{ padding:0; margin:0;} body{background:rgb(0,2

观察者模式学习--使用jdk的工具类简单实现

观察者模式学习之二:使用jdk的自带的工具类实现,与自己实现相比,两者有以下的区别: 1,自己实现,需要定义观察者的接口类和目标对象的接口类.使用java util的工具类,则不需要自己定义观察者和目标对象的接口类了,jdk已经定义好了. 2,自己实现,具体的目标对象类中,实现了接口方法后,还必须要自己实现维护观察者的注册删除信息.但是使用jdk,则不需要了,在 jdk的util下的observable类里面已经帮忙维护好了. 3,目标对象触发观察者的update的通知方式有了变化,自己的实现,

Vue.js 基础学习

今天我开始了Vue.js 的学习. 那么什么是Vue.js 呢? Vue.js是一套开发Web页面的JavaScript脚本框架.听起来感觉很难,不过据说,Vue.js是Web-Javascript脚本框架中最容易上手的框架.所以我便选择了先来学习这个. 要学习Vue.js首先就要获取库文件了,在网上有很多地方可以找到,我是在bootcdn上找到的 接下来我们通过Vue输出一串Hello World ! 首先引入vue. <script src="https://cdn.bootcss.c

Node.js知识点学习

Node.js知识点学习 一.基本概念 Node.js,或者 Node,是一个可以让 JavaScript 运行在服务器端的平台.可以说,Node.js开创了javascript模块化开发的先河,早期的javascript需求都很简单,基本都是写成函数的,然后是面向过程的写法,后来慢慢的引入面向对象开发思想,再后来就慢慢写成 类.最后node.js的出现才开始有了js模块化开发的概念,这使得臃肿的js代码免去了命名冲突等一系列开发难题. Node最大的特点就是采用了异步式I/O与事件驱动的架构设

&lt;&lt;Head First设计模式&gt;&gt;之观察者模式学习

1.概念 定义了对象之间的一对多依赖关系,当一个对象(主题对象)的状态改变时,它的所有依赖者(观察者对象)都会收到通知并自动更新. 2.优势 观察者模式实现了主题对象与观察者对象之间的松耦合,当有新的观察者时,无需修改主题对象的代码,只需要新的观察者对象实现接口.在程序运行的过程中,可以随时注册和删除观察者而不影响主体对象. 观察者模式使主题(Subject)对象和观察者(Observer)对象都可以被轻易地复用. 3.Java中观察者模式 Java API有内置的观察者模式,java.util

js数组学习整理

原文地址:js数组学习整理 常用的js数组操作方法及原理 1.声明数组的方式 var colors = new Array();//空的数组 var colors = new Array(3); //长度为3 var colors = new Array('red','blue');//初始化 其中,在声明数组的时候,去掉new操作符,也可以. 还有一种初始化数组的方式,使用数组字面量表示法 . 数组字面量由一对包含数组项的方括号表示,多个数组项之间用逗号隔开. var colors = [ '

js入门学习~ 运动应用小例

要实现的效果如下: 鼠标移入各个小方块,实现对应的效果(变宽,变高,移入透明,移出恢复)~~ (且各运动相互之前不干扰)  主要是练习多个物体的运动框架~~ ----------------------------------------------------js代码如下 ----------------------------------------------------- //执行函数window.onload = function(){ //声明控制变量 var aDiv = docu

js Array 学习

摘抄自<JavaScript权威指南> 1.join()返回生成的字符串.数组元素转化为字符串,拼接.默认分隔符:“,”. 2.reverse()返回逆序的数组,替换.数组中的元素倒序. 3.sort()返回排序后的数组,替换.数组中的元素排序.无参数:按字母表排序,undefined元素尾部:参数为比较函数: 4.concat()创建并返回一个新数组.新数组的元素:调用concat()的原始数组的元素,concat()的每个参数.参数自身是数组,则连接数组的元素,而非数组本身.不会递归扁平化

js基础学习笔记(二)

2.1  输出内容(document.write) document.write() 可用于直接向 HTML 输出流写内容.简单的说就是直接在网页中输出内容. 第一种:输出内容用“”括起,直接输出""号内的内容. <script type="text/javascript"> document.write("I love JavaScript!"); //内容用""括起来,""里的内容直接输出.