问题场景
在项目中使用如下代码订阅全局事件
AppUtil.getContext().eventHub.on('theme', this.eventFunc);eventFunc(theme:number){ this.xxx }//普通方法
这样实现this 的指向是调用该方法的对象即AppUtil，则不会触发UI的刷新
，找原因找半天原来是this 的问题 还以为是@State的注解使用有问题
正确使用方法如下
AppUtil.getContext().eventHub.on('theme', (t:number)=>{//这里需要使用箭头函数自动继承上下文的this 如果使用普通函数this指向的是调用该方法的对象即AppUtil，则不会触发UI的刷新。 this.xxx= t});
使用箭头函数后刷新UI正常了。
总结回顾
在鸿蒙应用开发（基于ArkTS，即TypeScript的超集）中，普通函数和箭头函数的this指向行为与JavaScript/TypeScript一致，区别如下：
1. 普通函数（Function Declaration）
动态绑定： this的值由函数调用时的上下文决定。常见场景： 直接调用：非严格模式下 this指向全局对象（如window），严格模式下为undefined。对象方法调用： this指向调用该方法的对象。构造函数调用： this指向新创建的实例。通过 call/apply/bind调用：this指向绑定的对象。
示例
class MyClass {
value: string = "Hello";
// 普通函数
printValue() {
console.log(this.value); // 依赖调用时的上下文
}
}
const obj = new MyClass();
const func = obj.printValue;
func(); // 错误：此时`this`指向全局对象，`value`为undefined
2. 箭头函数（Arrow Function）
静态绑定： this继承自定义时的外层作用域，且不可被修改（call/apply/bind无效）。适用场景： 需要固定 this指向（如事件回调、异步操作）。避免因上下文丢失导致的错误。
示例
class MyClass {
value: string = "Hello";
// 箭头函数
printValue = () => {
console.log(this.value); // 始终指向当前类实例
};
}
const obj = new MyClass();
const func = obj.printValue;
func(); // 正确输出"Hello"
核心区别总结
特性 普通函数 箭头函数 thisthiscall/apply修改new）
鸿蒙开发中的实践建议
类方法定义：
class MyComponent {
count: number = 0;
// 推荐：箭头函数绑定正确上下文
handleClick = () => {
this.count++; // 正确访问实例属性
};
}若需确保 this始终指向类实例，优先使用箭头函数。事件回调：
Button()
.onClick(this.handleClick) // 使用箭头函数确保`this`正确事件处理函数（如按钮点击）需用箭头函数，避免 this丢失。避免全局污染：
在模块或类作用域内定义箭头函数，避免 this指向全局对象。
通过合理选择函数类型，可以有效管理this指向，避免运行时错误，提升代码可维护性。
来源：公众号
作者：Android技术之家
原文地址：https://mp.weixin.qq.com/s/DmPNMzOcZzW3SqcXdCsKTQ
来源：
互联网
本文观点不代表码客-全球程序员交流社区立场，不承担法律责任，文章及观点也不构成任何投资意见。
评论列表