js中改变this指向的操作有哪些?
首先了解的是,从面向对象的角度考虑,我们函数的this正常应该是指向调用者:
js
例如:person.say();
say函数中的 this 就是指向 person
常见的有下面几个:
- 最常见的 new Object()
创建一个对象,即创建一个空对象,并将构造函数中的this指向这个空对象,如果构造函数中没有返回,则默认返回这个 this,这个比较是比较常用的,但是大家对这个知识点不一定常见罢了 call、apply、bind这三个则是比较常见、常听到的函数,能明确控制函数的 this 指向,前两个是通过函数直接传递this给函数内部,bind 则是直接通过返回改变 this 后的函数给外部使用箭头函数,这个是最常见的了,大家都在使用,但箭头函数是没有自己的this,因此内部的this默认使用的是其上下文的this,这也算是改变this的一种方式了- Reflect系列,Reflect实际上有很多都是一些原有实现的,比如
Reflect.call、Reflect.apply、Reflect.bind这个就不多说了,跟上面的一样,其使用最多的就是Reflect.set、Reflect.get了,这两个的最后一个参数是 receiver ,这个就是传入的this,他是谁,里面的this就指向谁,这个也是 vue3中的代理中出现的问题的解决方案- Reflect.get(target, key, receiver) 获取对象属性值
- Reflect.set(target, key, value, receiver) 设置对象属性值
最后
这期我们就介绍到这里了
顺便来一句,你能hook组件中能写出使用this的操作么(不推荐)
实际上一般人可能第一时间想不到,但是很快也会有思路,当然之前在一个同事的前同事的离职代码中看到的(有人故意搞事的哈,所以不推荐)
我们能使用this的地方就是就是类和成员函数的声明实现了了,那么我们只需要快速创建一个类,里面设置成员函数,在里面使用this就行了,就是这么简单😂