call()与apply()的作用与区别?

简介: call()与apply()的作用与区别?


  1. 概念

每个函数都包含两个非继承而来的方法:apply()和call()。 call与apply都属于Function.prototype的一个方法,所以每个function实例都有call、apply属性;

  1. 作用

call()方法和apply()方法的作用相同:改变this指向

  1. 区别

他们的区别在于接收参数的方式不同: call():第一个参数是this值没有变化,变化的是其余参数都直接传递给函数。在使用call()方法时,传递给函数的参数必须逐个列举出来。 apply():传递给函数的是参数数组

  1. 应用
  var name = "Evan";
  var age = 20;
 
  var person = {
    name: "Hillary",
    age: 19,
    sayIntroduce: function () {
      return (
        "Hello, My name is " + this.name +" and I'm " +this.age +" years old."
      );
    },
    sayHobby: function (val1, val2) {
        return "I'm " + this.name + ", I like " + val1 + " and " + val2 + ".";
    }
  };
 
  
  var person1 = {
    name: "Coy",
  };
 
  
  console.log(person.sayIntroduce()); 
  // Hello, My name is Hillary and I'm 19 years old.
  
  // 当我们通过 call 和 apply 来this的指向时,不传任何参数,则默认为将this指向修改为 windows
  console.log(person.sayIntroduce.call()); 
  // Hello, My name is Evan and I'm 20 years old.
  console.log(person.sayIntroduce.apply()); 
  // Hello, My name is Evan and I'm 20 years old.
  
  // 有参数时,this 指向第一个参数:将this指向 person1,由于person1中没有age属性,因此为 undefined
  console.log(person.sayIntroduce.call(person1)); 
  // Hello, My name is Coy and I'm undefined years old.
  console.log(person.sayIntroduce.apply(person1)); 
  // Hello, My name is Coy and I'm undefined years old.
  
  // 当需要传递参数时,call可以直接写多个参数,apply需要用数组方式传递:
  console.log(person.sayHobby.call(person1, 'swimming', 'hiking')); 
  // I'm Coy, I like swimming and hiking. 
  console.log(person.sayHobby.apply(person1, ['swimming', 'hiking'])); 
  // I'm Coy, I like swimming and hiking. 


相关文章
|
4天前
|
云安全 人工智能 算法
以“AI对抗AI”,阿里云验证码进入2.0时代
三层立体防护,用大模型打赢人机攻防战
1315 4
|
4天前
|
机器学习/深度学习 安全 API
MAI-UI 开源:通用 GUI 智能体基座登顶 SOTA!
MAI-UI是通义实验室推出的全尺寸GUI智能体基座模型,原生集成用户交互、MCP工具调用与端云协同能力。支持跨App操作、模糊语义理解与主动提问澄清,通过大规模在线强化学习实现复杂任务自动化,在出行、办公等高频场景中表现卓越,已登顶ScreenSpot-Pro、MobileWorld等多项SOTA评测。
662 3
|
5天前
|
人工智能 Rust 运维
这个神器让你白嫖ClaudeOpus 4.5,Gemini 3!还能接Claude Code等任意平台
加我进AI讨论学习群,公众号右下角“联系方式”文末有老金的 开源知识库地址·全免费
|
11天前
|
编解码 人工智能 自然语言处理
⚽阿里云百炼通义万相 2.6 视频生成玩法手册
通义万相Wan 2.6是全球首个支持角色扮演的AI视频生成模型,可基于参考视频形象与音色生成多角色合拍、多镜头叙事的15秒长视频,实现声画同步、智能分镜,适用于影视创作、营销展示等场景。
766 6
|
8天前
|
物联网 API UED
Qwen-Image-Edit-2511来啦!角色一致性再提升,LoRA能力内置
Qwen-Image-Edit-2511发布!提升角色与多人合照一致性,集成Lora打光、新视角生成,增强工业设计与几何推理能力。已开源,支持魔搭、QwenChat免费体验,本地部署可获最佳效果。
465 3