改变this指向的三种方式

简介: 改变this指向的三种方式

这周想分享一下我之前考核不知道的一个知识点,即改变this指向的三种方式:

1.call()方法

function.call(thisArg, 参数1, 参数2, 参数3…)

function: 要改变this指向的原函数

thisArg: 要改变到的this指向的目标对象

function fun (name) {
  this.name = name
  console.log(this)
}
var obj = {
  name: 'dpn',
  b: function () {
  console.log(this.name)
  }
}
fun.call(obj, 'dulin') 
//把fun函数的this指向改变到obj函数,改变的name是obj中的name
this输出obj对象,并且name改变为'dulin'

2.apply()方法

function.apply(thisArg, [参数1, 参数2, 参数3…])

function: 要改变this指向的原函数

thisArg: 要改变到的this指向的目标对象

function fun (name) {
  this.name = name
  console.log(this)
}
var obj = {
  name: 'dpn',
  b: function () {
  console.log(this.name)
  }
}
fun.apply(obj, ['dulin'])
//把fun函数的this指向改变到obj函数,改变的name是obj中的name
this输出obj对象,并且name改变为'dulin'

3.bind()方法

funtion.bind(thisArg, 参数1, 参数2, 参数3…)

function: 要改变this指向的原函数

thisArg: 要改变到的this指向的目标对象

该方法并不会调用函数,仅仅改变了this指向

function fun (name) {
  this.name = name
  console.log(this)
}
var obj = {
  name: 'dpn',
  b: function () {
  console.log(this.name)
  }
}
var fun1 = fun.bind(obj, 'dulin')
fun1()
//把fun函数的this指向改变到obj函数,改变的name是obj中的name
this输出obj对象,并且name改变为'dulin'

三种方法的区别

b9618540b3064c2cbe12c3277acc58f5.png

目录
相关文章
|
存储 Cloud Native Linux
C++指针和引用的作用以及区别
C++指针和引用的作用以及区别
|
5月前
|
前端开发 JavaScript
前端基础(九)_this基本使用、this指向判断、改变this指向的方法
本文介绍了JavaScript中this的基本使用、this指向的判断以及改变this指向的方法。
76 1
前端基础(九)_this基本使用、this指向判断、改变this指向的方法
|
6月前
|
JavaScript 前端开发
js中this是指向的哪个全局变量,改变this指向的方法有什么?
js中this是指向的哪个全局变量,改变this指向的方法有什么?
25 0
|
9月前
|
JavaScript 前端开发
js中改变this指向、动态指定函数 this 值的方法
js中改变this指向、动态指定函数 this 值的方法
|
9月前
|
JavaScript 前端开发
this是指向的哪个全局变量,改变this指向的方法有几种
this是指向的哪个全局变量,改变this指向的方法有几种
78 0
|
9月前
|
JavaScript 前端开发
this是指向的哪个全局变量,改变this指向的方法有几种?
this是指向的哪个全局变量,改变this指向的方法有几种?
44 0
|
9月前
|
JavaScript 前端开发
js中this是指向的哪个全局变量,改变this指向的方法有什么
js中this是指向的哪个全局变量,改变this指向的方法有什么
47 0
|
JavaScript
努力说清this的指向和怎么改变this的指向
努力说清this的指向和怎么改变this的指向
98 0