zoukankan      html  css  js  c++  java
  • 彻底理解了call()方法,apply()方法和bind()方法

    javascript中的每一个作用域中都有一个this对象,它代表的是调用函数的对象。在全局作用域中,this代表的是全局对象(在web浏览器中指的是window)。如果包含this的函数是一个对象的方法,this指向的就是这个对象。因此在上面例子中就不用直接写对象的名字,而是使用this代替它,例如:

    var human = {
        name: '霍林林',
        sayName: function(){
            console.log(this.name);
    
        }
    }
    
    human.sayName();

    下面这个例子中,我们直接使用person.name,这种做法会增加方法与对象之间的耦合度(它们之间的依赖性变强了)。这样写是有问题的 ,如果我们的变量名修改了,我们必须同时修改方法中的变量名。幸运的是,JavaScript给我们提供了解决这个问题的方法。

    var person = {
            name: '霍林林',
            sayName: function(){
                console.log(person.name);
            }
        }
    
        person.sayName();

    1.改变this

    this通常是被自动赋值的,但是我们可以改变this的指向。JavaScript给我们提供了 3 中 函数方法 来改变this的指向。

    2.call()方法

    这个方法的第一个参数表示this指向的对象,后面的所有参数都是函数的参数。例如:

    function sayName(label) {
    
        console.log(label+'--->'+this.name);
    
    }
    
    
    var name = '张三';
    
    var person1 = {
        name: '李四'
    };
    
    
    var person2 = {
        name: '王二'
    
    };
    sayName.call(window,'global');      //'global--->张三'
    sayName.call(person1,'person1');    //'person1--->李四'
    sayName.call(person2,'person2');    //'person2--->王二'

    3.apply()方法

    這個方法和call方法的作用都是相同的,只不过在传递参数时候,call方法可以传递多个参数,而apply方法只能传递一个方法,并且要求是一个数组。

    function sayName(label) {
    
        console.log(label);
        console.log(this.name);
    
    }
    
    
    var name = '张三';
    
    var person1 = {
        name: '李四'
    };
    
    
    var person2 = {
        name: '王二'
    
    };
    sayName.apply(window,['global']);   //'global--->张三'
    sayName.apply(person1,['person1']); //'person1--->李四'
    sayName.apply(person2,['person2']); //'person2--->王二'

    4.bind()方法

    bind()方法第一个参数是我们希望函数中this指向的对象,后面的参数是我们希望给函数的参数绑定的值。

    var obj = {
                  name:'小明'
                  age:23
                };
    function myName(age,gender){
                  console.log(this.name,age,gender);
                }
    var newName = myName.bind(obj);
                newName();  //小明 undefined undefined
                
                var newName2 = myName.bind(obj,18);
                newName2();  //小明 18 undefined
                
                var newName3 = myName.bind(obj,18,'女');
                newName3();  //小明 18 女
                
                var newName4 = myName.bind(obj);
                newName4(18,'女');  //小明 18 女
  • 相关阅读:
    Windows Mobile开发资源列表
    Windows Mobile获取SIM卡上的所有电话号码
    Windows Mobile手机软件安装卸载方法
    Windows CE跨进程内存注入之原理
    推荐几篇关于Windows Mobile程序安装包制作的文章
    C#智能设备中程序的调用
    Windows Mobile 获得 MAC,IP,IMEI,IMSI
    为什么要使用Base64?
    如何选择正确的SQL Server Compact安装包
    [Drupal] Using the Administrator theme whenever you want.
  • 原文地址:https://www.cnblogs.com/zhoulifeng/p/7519990.html
Copyright © 2011-2022 走看看