<!DOCTYPE html>

<html lang="en">

<head>

	<meta charset="UTF-8">

	<title>Document</title>

</head>

<body>

	<input type="checkbox" id="1">

	<input type="checkbox" id="2">

	<input type="checkbox" id="3">

	<input type="checkbox" id="4">

	<input type="checkbox" id="5">

	<input type="checkbox" id="6">

	<input type="checkbox" id="7">

	<input type="checkbox" id="8">

	<input type="checkbox" id="9">

	<input type="checkbox" id="10">

	<p id="status"></p>

<script>

	var checkbox = document.getElementsByTagName('input');

	//本体类，同步逻辑处理

	var syncFile = function(id){

		//Ajax等同步代码...

		document.getElementById('status').innerHTML = '正在同步文件'+id;

	}

	//代理类，通过一个闭包结构保存cache和timer

	var syncFileProxy = (function(){

		var cache = [];

		var timer = null;

		return function(id){

			cache.push(id);

			//小于2秒的同步请求，则不会处理

			if(timer){

				return;

			}

			timer = setTimeout(function(){

				syncFile(cache.join(','));

				clearTimeout(timer); //清除定时器

				timer = null; //重置变量

				cache = []; //重置cache数组

			},2000);

		}

	})();

	for(var i = 0; i < checkbox.length; i++){

		checkbox[i].onclick = function(){

			if(this.checked === true){

				syncFileProxy(this.id);

				//可以随时替换成 syncFile(this.id)

			}

		}

	}

</script>

</body>

</html>

Javascript 代理模式模拟一个文件同步功能的更多相关文章

  1. 轻松掌握：JavaScript代理模式、中介者模式

    代理模式.中介者模式 代理模式 在面向对象设计中,有一个单一职责原则,指就一个类(对象.函数)而言,应该仅有一个引起它变化的原因.如果一个对象承担了过多的职责,就意味着它将变得巨大,引起它变化的原因就 ...

  2. JavaScript代理模式

    代理模式的定义,代理是一个对象(proxy)用它来控制目标对象的访问.为此他要是先与目标对象相同的接口,但是他不同于装饰者模式,它对目标对象不进行任何修改,它的目的在于延缓"复杂" ...

  3. 模板模式创建一个poi导出功能

    之前的导出都很乱,直接写在代码中,等到下回还使用导出功能时又不知如何下手,今天用模板模式重写了一个导出功能,方便以后使用: package com.sf.addrCheck.util.export.p ...

  4. 关于 Javascript 严格模式下多文件合并时注意

    Javascript 在第一行使用 "use strict" 声明严格模式. 但是在多个 js 文件合并时就需要注意了,可能你的是严格模式,但别的文件不是,就会造成错误. 为什么使 ...

  5. 编写函数，以读模式打开一个文件，将其内容读入到一个string的vector中，将每一行作为一个对立的元素存于vector中

    #include<iostream> #include<string> #include<vector> #include<fstream> using ...

  6. JavaScript设计模式 - 代理模式

    代理模式是为一个对象提供一个代用品或占位符,以便控制对它的访问 代理模式的用处(个人理解):为了保障当前对象的单一职责(相对独立性),而需要创建另一个对象来处理调用当前对象之前的一些逻辑以提高代码的效 ...

  7. javascript设计模式——代理模式

    前面的话 代理模式是为一个对象提供一个占位符,以便控制对它的访问. 代理模式是一种非常有意义的模式,在生活中可以找到很多代理模式的场景.比如,明星都有经纪人作为代理.如果想请明星来办一场商业演出,只能 ...

  8. 《JavaScript设计模式与开发实践》-- 代理模式

    详情个人博客:https://shengchangwei.github.io/js-shejimoshi-daili/ 代理模式 1.定义 代理模式:代理模式是为一个对象提供一个代用品或占位符,以便控 ...

  9. JavaScript 设计模式之代理模式

    一.代理模式概念解读 1.代理模式概念文字解读 代理,顾名思义就是帮助别人做事,GOF对代理模式的定义如下: 代理模式(Proxy),为其他对象提供一种代理以控制对这个对象的访问.代理模式使得代理对象 ...

随机推荐

  1. 探索ASP.NET MVC5系列之~~~2.视图篇（上）---包含XSS防御和异步分部视图的处理

    其实任何资料里面的任何知识点都无所谓,都是不重要的,重要的是学习方法,自行摸索的过程(不妥之处欢迎指正) 汇总:http://www.cnblogs.com/dunitian/p/4822808.ht ...

  2. 和 Thrift 的一场美丽邂逅

    一. 与 Thrift 的初识 也许大多数人接触 Thrift 是从序列化开始的.每次搜索 “java序列化” + “方式”.“对比” 或 “性能” 等关键字时,搜索引擎总是会返回一大堆有关各种序列化 ...

  3. Linux 添加新磁盘，在线扩充空间

    CentOS 7开发环境中的home 目录空间满了,需要增加空间 到虚拟机上执行"ls /sys/class/scsi_host",然后重新扫描SCSI总线来添加设备.如右图.然后 ...

  4. Hawk 4.4 执行器

    执行器是负责将Hawk的结果传送到外部环境的工具.你可以写入数据表,数据库,甚至执行某个特定的动作,或是生成文件等等. 在调试模式下,执行器都是不工作的.这是为了避免产生副作用.否则,每刷新一遍数据, ...

  5. RSA非对称加密，使用OpenSSL生成证书，iOS加密，java解密

    最近换了一份工作,工作了大概一个多月了吧.差不多得有两个月没有更新博客了吧.在新公司自己写了一个iOS的比较通用的可以架构一个中型应用的不算是框架的一个结构,并已经投入使用.哈哈 说说文章标题的相关的 ...

  6. 通过微信小程序看前端

    前言 2016年9月22日凌晨,微信官方通过“微信公开课”公众号发布了关于微信小程序(微信应用号)的内测通知.整个朋友圈瞬间便像炸开了锅似的,各种揣测.介绍性文章在一夜里诞生.而真正收到内测邀请的公众 ...

  7. JavaScript基础

    JavaScript基础 JavaScript是一门编程语言,浏览器内置了JavaScript语言的解释器,所以在浏览器上按照JavaScript语言的规则编写相应代码之,浏览器可以解释并做出相应的处 ...

  8. listview下拉刷新和上拉加载更多的多种实现方案

    listview经常结合下来刷新和上拉加载更多使用,本文总结了三种常用到的方案分别作出说明. 方案一:添加头布局和脚布局        android系统为listview提供了addfootview ...

  9. 跟着老男孩教育学Python开发【第二篇】：Python基本数据类型

    运算符 设定:a=10,b=20 . 算数运算 2.比较运算 3.赋值运算 4.逻辑运算 5.成员运算 基本数据类型 1.数字 int(整型) 在32位机器上,整数的位数为32位,取值范围为-2**3 ...

  10. 如何开启MySQL 5.7.12 的二进制日志

    1. 打开/etc下的my.cnf文件 2. 编辑它,添加内容: log_bin=binary-log   #二进制日志的文件名 server_id=1  #必须指定server_id,这是MySQL ...