this的指向问题

来源:3-2 React 中的响应式设计思想和事件绑定

松_

2020-02-05

React中组件是类的形式,那this应该始终指代该组件;
即使在类的事件函数中this应该也能用,
为什么不用bind,事件函数中this就识别不了变成了undefine呢

写回答

3回答

Aaron0128

2020-02-09

const test = {     

name:'jack',    

getJack:function(){ console.log(this.name)    } }

const func = test.getJack; func();

我们没有直接调用对象的方法,而是将方法声明给一个中间变量,之后利用中间变量()调用方法,此时this则失去指向,输出undefined,如果使用node环境执行js文件则输出node相关信息,如嵌入到html中则this指向window对象。

React中的bind同上方原理一致,在JSX中传递的事件不是一个字符串,而是一个函数(如:onClick={this.handleClick}),此时onClick即是中间变量,所以处理函数中的this指向会丢失。解决这个问题就是给调用函数时bind(this),从而使得无论事件处理函数如何传递,this指向都是当前实例化对象。

//img.mukewang.com/szimg/5e3fbdd4099d5b3f24941452.jpg

2
1
Aaron0128
我和老师写的不一样用的箭头函授处理了问题
2020-02-09
共1条回复

AhHaWorld

2020-06-25

没人去调用它,函数内部this默认就是undefined。

0
0

Dell

2020-02-09

因为那个时候this指向不是实例,并不是类中this一定都指向类

0
0

React零基础入门到实战,完成企业级项目简书网站开发

主流新技术 React-redux,React-router4,贯穿基础语法

5275 学习 · 2496 问题

查看课程