zl程序教程

您现在的位置是:首页 >  后端

当前栏目

关于JS的改变this指向的三个方法【call,apply,bind】的简单理解

JS方法 简单 关于 理解 改变 this 三个
2023-09-11 14:19:18 时间

关于JS的改变this指向的三个方法【call,apply,bind】做一个个人的简单理解

前言: JS中改变this指向的三个方法,基本都是清楚的,但是在使用上面,看了部分博文,感觉都讲的有些高深莫测了,自己试着做了了一个相对简单的demo,理解上应该是很简单的。基本的使用方法代码注释上都做了说明

语法:
function.call ( object , [values] )

function.apply ( object , [array] )

function.bind ( object , [values] ) ()
**[ ]**表示可选参数,object表示函数要绑定this的指定对象,values表示是需要传入函数的参数,array表示需要传入的是一个数组(数组内也是函数的参数)
示例:

function say(arg1,arg2){
  console.log(this.name,arg1,arg2);
};
var obj = {
  name : 'tom',
}
say('one','two') 
//输出:undefined one two ,未绑定this指向,this指向的是全局,全局没有name,因此undefined  
say.call(obj,'one','two');//tom one two
// call的使用方法,第一个参数为需要绑定的对象,后面的参数是当前函数需要传入的参数
say.apply(obj,['one','two']);//tom one two
// apply使用方法大致和call相同,但是第二个参数是一个数组,需要对数组二次解析,因此从中可以得出apply的效率没有call的高
say.bind(obj,'one','two')() //tom one two
// bind的使用方法传入参数和call差不多,但是bind调用后返回的是一个函数,需要再次调用返回的函数才能有输出