javascript函数式编程--闭包3 闭包存储器与事件中应用闭包（封装事件）

1.闭包的常见用法 就是  为执行的函数提供参数，例如 为事件传递动作，为定时器传递行为，都是web非常常见的应用

为定时器传递行为

function f(a,b){

    return  function(){

       a(b);

       }

}

var c=f(alert,"hello,World")

var d=setTimeout(c,1000);//把闭包作为参数传递

window.οnlοad=c;//作为值 传递

 

2.通过闭包可以作为缓冲器的数组与依赖他的函数关联起来，实施优雅的打包，同时也能够维持在全局命名空间外制定的缓冲数组的属性名，免除了名称冲突和意外交互的危险

//闭包与数组关联，修改数组缓存器的指定元素

var f=function(){

   var a=[1,2,3,4,5,6,7,8,9,0]

  return function(a1,a2,a3,a4,a5){//返回的闭包函数

    a[0]=a1;

    a[1]=a2;

    a[2]=a3;

    a[3]=a4;

    a[4]=a5;

   return  a.join("-"); //返回的字符串

   }

}();  //

var a=f(11,12,13,14,15);  //动态更新的值 alert(a) //11-12-13-14-15-6-7-8-9-0

var b=f("a","b","c","d","e"); //动态更新的值 alert(b)//a-b-c-d-e-6-7-8-9-0

3.希望为页面中的特定的元素或标签绑定几个事情，使其能够在鼠标经过、离开和单击以后呈现不同的背景颜色

<script>

  function f(o,m){//1、实例对象o与方法m关联处理器

           return   function(e){//返回闭包函数，将作为一个DOM元素的处理器

                      e=e||window.event;

                     return o[m](e,this);   //返回闭包函数，利用传递的必要参数封装事件处理函数

          }

     }

function g(id){//2、封装事件处理函数，以实现在页面初始化事件触发

   return function(){//返回事件处理函数

     var e=document.getElementByTagName(id);

   if(e){

      for(var i in e){

      e[i].οnclick=f(g,"click");//调用关联处理器，把对象与方法捆绑到事件属性中

      e[i].οnclick=f(g,"over");

      e[i].οnclick=f(g,"out");

     }

     }

}

}

//3、为事件处理封装函数定义额外的事件处理方法

g.click=function(event,element){

  element.style.backgroundColor="red"

}

g.over=function(event,element){

  element.style.backgroundColor="blue"

}

g.out=function(event,element){

  element.style.backgroundColor="transparent";

}

window.οnlοad=g("p");//页面初始化事件中绑定事件处理函数

</script>

<p>p1</p>

<p>p2</p>

<p>p3</p>