<!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. ABP入门系列（1）——学习Abp框架之实操演练

    作为.Net工地搬砖长工一名,一直致力于挖坑(Bug)填坑(Debug),但技术却不见长进.也曾热情于新技术的学习,憧憬过成为技术大拿.从前端到后端,从bootstrap到javascript,从py ...

  2. 用scikit-learn学习BIRCH聚类

    在BIRCH聚类算法原理中,我们对BIRCH聚类算法的原理做了总结,本文就对scikit-learn中BIRCH算法的使用做一个总结. 1. scikit-learn之BIRCH类 在scikit-l ...

  3. RabbitMq应用一的补充（RabbitMQ的应用场景）

    直接进入正题. 一.异步处理 场景:发送手机验证码,邮件 传统古老处理方式如下图 这个流程,全部在主线程完成,注册->入库->发送邮件->发送短信,由于都在主线程,所以要等待每一步完 ...

  4. .NET CoreCLR开发人员指南(上)

    1.为什么每一个CLR开发人员都需要读这篇文章 和所有的其他的大型代码库相比,CLR代码库有很多而且比较成熟的代码调试工具去检测BUG.对于程序员来说,理解这些规则和习惯写法非常的重要. 这篇文章让所 ...

  5. spring boot 实战：我们的第一款开源软件

    在信息爆炸时代,如何避免持续性信息过剩,使自己变得专注而不是被纷繁的信息所累?每天会看到各种各样的新闻,各种新潮的技术层出不穷,如何筛选出自己所关心的? 各位看官会想,我们是来看开源软件的,你给我扯什 ...

  6. mongodb

    修改所有的记录: > db.t_express_apply.update({},{$set:{"isStatus" : 0}},{multi:true})WriteResul ...

  7. ActionContext.getContext().getSession()

    ActionContext.getContext().getSession() 获取的是session,然后用put存入相应的值,只要在session有效状态下,这个值一直可用 ActionConte ...

  8. H3 BPM让天下没有难用的流程之技术特性

    一.集成性  H3 BPM可以与其它系统进行多个层面的集成,满足企业的针对不同系统的集成需求. 图:多种集成维度 Ø  用户集成 可与企业现有系统进行组织架构同步或调用,也可以直接与AD 进行集成. ...

  9. 深入理解 Android 之 View 的绘制流程

    概述 本篇文章会从源码(基于Android 6.0)角度分析Android中View的绘制流程,侧重于对整体流程的分析,对一些难以理解的点加以重点阐述,目的是把View绘制的整个流程把握好,而对于特定 ...

  10. 最新的 cocoaPods 安装方法

    经过努力终于发现了最新的 解决cocoaPods安装的办法: taobao Gems 源已停止维护,现由 ruby-china 提供镜像服务 第一步:安装rvm, 不管需不需要升级ruby,rvm可以 ...