zoukankan      html  css  js  c++  java
  • this

    用自然语言的角度理解JavaScript中的this关键字:http://blog.leapoahead.com/2015/08/31/understanding-js-this-keyword/

    使用Function.prototype.bind把function绑定到某个对象:
    //每个函数都有一个bind方法:Function.prototype.bind
    xiaoming.run = xiaoming.run.bind(xiaoming);
    多次bind之后,this对象是第一次绑定的obj;
    使用call和apply也是可以的;
    call/apply 和 bind避免混用;
    严格模式下,调用方法没有主语,this为undefined

    没法看到定义的函数是被谁调用的:

    window.val = 'window val';
    
    var obj = {
      val: 'obj val',
      foo: function() {
        $('#text').bind('click', function() {
        //this为$('#text') console.log(this.val); }); } }; obj.foo();

    想要在上面的回调函数里面使用obj的val值,除了直接写obj.val之外,还可以在foo方法中用一个新的变量that来保存foo运行时this的值:

    window.val = 'window val';
    
    var obj = {
      val: 'obj val',
      foo: function() {
        var that = this; // 保存this的引用到that,这里的this实际上就是obj
        $('#text').bind('click', function() {
          console.log(that.val); // 输出:obj val
        });
      }
    };
    
    obj.foo();
    

    另外一种方法就是为该匿名函数bind:

    window.val = 'window val';
    
    var obj = {
      val: 'obj val',
      foo: function() {
        $('#text').bind('click', function() {
          console.log(this.val); // 输出:obj val
        }.bind(this));
      }
    };
    
    obj.foo();
    

      

      

      

  • 相关阅读:
    Python运算符及逻辑运算
    Python编码、流程控制、格式化输出
    Docker私有仓库Harbor部署与使用
    react
    理事会
    关于elementui form表单过长,看不到未填项
    js
    vue 父子传值
    养生
    html知识点
  • 原文地址:https://www.cnblogs.com/wang-jing/p/4777388.html
Copyright © 2011-2022 走看看