zoukankan      html  css  js  c++  java
  • js中apply和call方法浅析

    最近重新温习的时候发现对于apply和call方法的区分以及使用时忘得差不多了,所以简单记录巩固一下

    基本语法

    函数名.apply(Object,[参数1,参数2,...])

    函数名.call(Object,参数1,参数2,...)

    共同点:都可以用来改变this的指向

    不同点:两者中第一个参数均为Object,apply只有两个参数,其中第二个参数为数组;call为多个参数

    接下来通过一个例子使用并分析apply和call

    var obj1 = {
      name:"张三",
      age:20
    };
    var obj2 = {
      name:"李四",
      age:30,
      fun:function(name,todo){
        console.log(this.name+"已经"+this.age+",他准备去和"+name+todo)
      }
    };

    obj2.fun.apply(obj1,['小红','相亲'])//张三已经20,他准备去和小红相亲
    obj2.fun.call(obj1,'小红','相亲')//张三已经20,他准备去和小红相亲
    //这两句的得出来的结果是一样的,参数传递也只有是按照数组去传递还是以多个函数去传递,
    //根据结果我们也可以看出,obj1调用了obj2的fun方法(不然显示的数据也不会是obj1的属性值)
    //可以看出函数的第一个参数是用来指代上下文的this指向,
    //既然两个函数可以改变this指向,那么接下来我们看几组不同的代码
    //
    obj2.fun.apply(obj2,['小红','相亲'])//李四已经30,他准备去和小红相亲
    obj2.fun.call(obj2,'小红','相亲')//李四已经30,他准备去和小红相亲
    //
    //我们从结果可以得出,第一参数由于是obj2,
    //故结果得出来是指是obj2的属性值
    //
    
    obj2.fun.apply(null,['小红','相亲'])//已经undefined,他准备去和小红相亲
    obj2.fun.call(null,'小红','相亲')//已经undefined,他准备去和小红相亲
    obj2.fun.apply(undefined,['小红','相亲'])//已经undefined,他准备去和小红相亲
    obj2.fun.call(undefined,'小红','相亲')//已经undefined,他准备去和小红相亲
    
    //
    //由于指向的this为空,所以得出来的值为undefined
    //
    
  • 相关阅读:
    微信浏览器取消缓存的方法
    iphone safari浏览器CSS兼容性的解决方案集合
    配置iis支持.json格式的文件
    win7下使用IIS服务器及自定义服务器端包含模块(SSI)步骤
    前端组件库集合
    ClientValidationFunction
    java 查询solr时间格式
    为何大量网站不能抓取?爬虫突破封禁的6种常见方法
    反爬虫四个基本策略
    ScheduledExecutorService 定时器用法
  • 原文地址:https://www.cnblogs.com/kongbaifeiye/p/12639443.html
Copyright © 2011-2022 走看看