js中apply和call方法浅析

最近重新温习的时候发现对于apply和call方法的区分以及使用时忘得差不多了,所以简单记录巩固一下 基本语法 函数名.apply(Object,[参数1,参数2,...]) 函数名.call(Object,参数1,参数2,...

最近重新温习的时候发现对于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
//
  • 发表于 2020-04-06 00:26
  • 阅读 ( 98 )
  • 分类:网络文章

条评论

请先 登录 后评论
不写代码的码农
小编

篇文章

作家榜 »

  1. 小编 文章
返回顶部
部分文章转自于网络,若有侵权请联系我们删除