zoukankan      html  css  js  c++  java
  • 高级函数之函数绑定

         

         函数绑定技巧是一个非常流行的高级技巧。

         函数绑定要创建一个函数,可以在特定的this环境中以制定参数调用另一个函数。该技巧常常和回调函数与实践处理程序一起使用,以便在将函数作为变量传递的同时保留代码执行环境。例1如下:

       

        var handler = {
               message: 'Event handled',
    
               handleClick: function(e){
                   alert(this.message);
               }
           }
        var btn = document.getElementById('button');
        btn.addEventListener('click', handler.handlerClick);

    当点击按钮的时候,就调用该函数,显示一个警告框,但是实际显示的内容是undefined而不是Event Handled,这个问题在于没有保存handler.handleClick()的环境,所以this对象是指向了DOM按钮而非handler这个对象。如下使用闭包来修正这个问题。

         var handler = {
               message: 'Event handled',
    
               handleClick: function(e){
                   alert(this.message);
               }
           }
        var btn = document.getElementById('button');
        btn.addEventListener('click', function(e){
            handler.handleClick(e);
        });

        var handler = {
               message: 'Event handled',
    
               handleClick: function(e){
                   alert(this.message);
               }
           }
        var btn = document.getElementById('button');
        btn.addEventListener('click', handler.handleClick.bind(handler));;

    原生的bind()方法和如下的自定义的bind()方法类似,需要传入做为this值的对象,支持原生bind())方法有IE9+,FireFox 4+和Chrome浏览器。

        var handler = {
               message: 'Event handled',
    
               handleClick: function(e){
                   alert(this.message);
               }
           }
        var btn = document.getElementById('button');
        
        btn.addEventListener('click', bind(handler.handleClick, handler));
        function bind(fn, context){
            return function(){
                return fn.apply(context, arguments);
            }
        }
  • 相关阅读:
    5.抽象工厂模式-abstractfactory
    java-code优化(持续更新)
    4.工厂方法模式-factoryMethod
    3.单例模式-singleton
    2.适配器模式-adapter
    1.外观模式-facade
    Hibernate(七)多对一单向关联映射
    Hibernate(六)一对一双向关联映射
    Hibernate(五)一对一单向关联映射
    Hibernate(四)基本映射
  • 原文地址:https://www.cnblogs.com/xuzhudong/p/8280831.html
Copyright © 2011-2022 走看看