zoukankan      html  css  js  c++  java
  • 关于Apply、call、bind的详解

     call方法:

    复制代码
    语法:call(thisObj,'',''........)
    
    定义:调用一个对象的一个方法,以另一个对象替换当前对象
    
    说明:call方法可以用来代替另一个对象调用一个方法。call方法可将一个函数的对象上下文初始的上下文改变为由thisObj指定的新对象,如果没有提供thisObj参数,那么global对象被用做thisObj
    复制代码

    apply方法:

    复制代码
    语法:apply(thisObj,['','',''....])
    
    定义:应用某一个对象的方法,用另一个对象替换当前对象
    
    如果argArray不是一个有效的数组或者不是arguments对象,那么将导致一个TypeError.如果没有提供argArray和thisObj任何一个参数,那么Global对象将用做thisObj,并且无法被传递任何参数
    复制代码

    相同之处:

    复制代码
    1、都是用来改变函数的this对象的指向
    2、第一个参数都是this要指向的对象
    3、都可以利用后续参数传参
    
    不同之处:
    1、call和apply都是对函数的直接调用,而bind方法返回的仍然是一个函数,因此后面需要加上()来进行调用才可以
    复制代码

    案例一:bind与call、apply的区别

    复制代码
    var a={
         name:'阿姨请别把您闺女介绍给我',
         sex:'男',
         age:'24',
         say:function(){
              console.log(this.name+',今年'+this.age+'岁,性别'+this.sex)
         }
    }
    
    var b={
         name:'就要把闺女介绍给你',
         sex:'女',
         age:'18'
    }
    a.say();//阿姨请别把您闺女介绍给我,今年24岁了,性别男
    
    那么我们想一下如何让b用say的方法显示数据呢?
    
    用call方法:a.say.call(b)
    
    用apply方法:a.say.apply(b)
    
    用bind方法:a.say.bind(b)()
    复制代码

    案例二:call与apply的区别

    复制代码
    var a={
         name:'阿姨请不要把您闺女介绍给我',
         sex:'男',
         age:'18',
         say:function(school,grade){
              console.log(this.name+'性别'+this.sex+'年龄'+this.age+school+grade)
         }
    }
    
    var b={
         name:'就喜欢把闺女介绍给你',
         sex:'女',
         age:'18'
    }
    
    现在我们看say方法中多了两个参数,我们通过call和apply的参数进行传参
    
    用call方法:a.say.call(b,'清华','三年级')
    
    用apply方法:a.say.apply(b,['清华','六年级'])
    
    call后面的参数与say方法中是一一对应的,而apply第二个参数是一个数组
    
    用bind方法:a.say.bind(b,'清华','三年级')
    但是由于bind返回的仍然是一个函数,所以我们可以在调用的时候在进行传参
    a.say.bind(b)('清华','三年级')
    复制代码
    由于IE6-IE8不支持该方法,所以若想在不同浏览器中使用所以我们要做下处理
    兼容处理bind方式
    复制代码
    if(!Function.prototype.bind){
         Function.prototype.bind=function(obj){
              var This=this;
              var args=arguments;
              return function(){
                   This.apply(obj,Array.prototype.slice.call(args,1))
              }
         }
    }
     
  • 相关阅读:
    php,asp.net web开发B/S编程语言函数|参数|使用手册
    [share]深入探讨PHP中的内存管理问题
    Nginx环境下Php安装
    熟悉iWebSNS开发规约
    php判断浏览器和语言
    PHP实现动态生成饼状图、柱状图和折线图(转)
    cloudServer Amazon EC2 / AWS / SWS / yunjisuan / yunfuwu / yuncunchu
    read_humor_video
    pics
    JAVA XML / dom / jdom / dom4j / sax / stax / StAX Stream / StAX Event
  • 原文地址:https://www.cnblogs.com/liuhaov/p/13488168.html
Copyright © 2011-2022 走看看