<!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. 【AutoMapper官方文档】DTO与Domin Model相互转换（上）

    写在前面 AutoMapper目录: [AutoMapper官方文档]DTO与Domin Model相互转换(上) [AutoMapper官方文档]DTO与Domin Model相互转换(中) [Au ...

  2. C语言 · 奇偶判断

    问题描述 能被2整除的数称为偶数,不能被2整除的数称为奇数.给一个整数x,判断x是奇数还是偶数. 输入格式 输入包括一个整数x,0<=x<=100000000. 输出格式 如果x是奇数,则 ...

  3. Js 原型和原型链

    Js中通过原型和原型链实现了继承 Js对象属性的访问,首先会查找自身是否拥有这个属性 如果查到,则返回属性值,如果找不到,就会遍历原型链,一层一层的查找,如果找到就会返回属性值 直到遍历完Object ...

  4. Minor【 PHP框架】1.简介

    1.1 Minor是什么 Minor是一个简单但是优秀的符合PSR4的PHP框架,It just did what a framework should do. 只做一个框架应该做的,简单而又强大! ...

  5. C++中的命名空间

    一,命名空间(namespace)的基本概念以及由来 1.什么是标识符: 在C++中,标识符可以是基本的变量,类,对象,结构体,函数,枚举,宏等. 2.什么是命名空间: 所谓的命名空间是指标识符的可见 ...

  6. 协议森林17 我和你的悄悄话 (SSL/TLS协议)

    作者:Vamei 出处:http://www.cnblogs.com/vamei 转载请先与我联系. TLS名为传输层安全协议(Transport Layer Protocol),这个协议是一套加密的 ...

  7. 奇葩问题－TextView无法获取值

    问题场景 前几天写一个界面的时候,遇到一个非常奇葩的问题.app第一次安装的时候,这里针对用户第一次安装的时候,后来是不会出现这个问题了.我明明是对某个界面的一个textview赋值了,而且服务端也返 ...

  8. C#使用Aspose.Cells导出Excel简单实现

    首先,需要添加引用Aspose.Cells.dll,官网下载地址:http://downloads.aspose.com/cells/net 将DataTable导出Xlsx格式的文件下载(网页输出) ...

  9. MVC还是MVVM？或许VMVC更适合WinForm客户端

    最近开始重构一个稍嫌古老的C/S项目,原先采用的技术栈是『WinForm』+『WCF』+『EF』.相对于现在铺天盖地的B/S架构来说,看上去似乎和Win95一样古老,很多新入行的,可能就没有见过经典的 ...

  10. AspNetPager分页控件样式的使用

    分页是Web应用程序中最常用到的功能之一,AspNetPager  简单实用,应用到项目后台中,棒极了! 自定义样式: <style type="text/css"> ...