第二十课:HarmonyOS Next异步编程实战:Promise与async/await深度解析

一、异步编程核心概念

HarmonyOS Next基于ArkTS的‌单线程模型‌实现高效异步编程,通过Promise与async/await解决传统回调地狱问题,提升代码可维护性‌

其核心优势包括:

  1. ‌非阻塞执行‌:异步任务挂起后主线程继续响应UI操作‌
  2. ‌简化并发逻辑‌:链式调用替代多层嵌套回调‌
  3. ‌统一错误处理‌:通过catch或try/catch集中管理异常‌

二、Promise核心用法

1. 状态与基本语法

Promise包含三种状态:

‌Pending‌:异步操作进行中‌

‌Fulfilled‌:任务成功完成‌

‌Rejected‌:任务执行失败‌

代码示例:创建Promise对象

javascript 复制代码
const fetchData = new Promise<string>((resolve, reject) => {  
  setTimeout(() => {  
    const success = Math.random() > 0.5;  
    success ? resolve('数据加载成功') : reject('请求超时');  
  }, 1000);  
});  

fetchData  
  .then(result => console.log(result))  
  .catch(error => console.error(error));  

2. 链式调用与错误处理

通过.then()串联多个异步任务,避免回调嵌套:

css 复制代码
// 模拟用户登录流程  
login(userId: string)  
  .then(token => getUserInfo(token))  
  .then(info => saveLocalStorage(info))  
  .catch(error => showToast('流程失败:' + error));  

三、async/await进阶开发

1. 基础语法与执行流程

‌async标记函数‌:声明异步函数隐式返回Promise‌37

‌await暂停执行‌:等待Promise完成后再继续后续代码‌36

代码示例:网络请求封装

vbnet 复制代码
async function loadUserData() {  
  try {  
    const token = await fetchToken();  
    const data = await fetchUserInfo(token);  
    return processData(data);  
  } catch (error) {  
    console.error('加载失败:', error);  
    throw error;  
  }  
}  

2. 并发执行优化

使用Promise.all提升多个独立任务的执行效率:

javascript 复制代码
// 并行加载图片与配置  
async function initApp() {  
  const [images, config] = await Promise.all([  
    fetchImageList(),  
    loadAppConfig()  
  ]);  
  // 合并结果后渲染  
}  

四、异步数据加载实战

1. 网络请求场景

封装HTTP请求模块实现统一拦截:

javascript 复制代码
async function safeFetch(url: string) {  
  const response = await fetch(url);  
  if (!response.ok) throw new Error(`HTTP ${response.status}`);  
  return response.json();  
}  

// 使用示例  
async function loadNews() {  
  const news = await safeFetch('https://api.example.com/news');  
  updateUI(news);  
}  

2. 文件读写场景

结合@ohos.fileio实现异步文件操作:

javascript 复制代码
async function writeLog(message: string) {  
  const filePath = 'logs/app.log';  
  try {  
    await fileio.writeText(filePath, message + '\n', { append: true });  
  } catch (e) {  
    console.error('日志写入失败:', e);  
  }  
}  
相关推荐
qq_177767371 小时前
React Native鸿蒙跨平台剧集管理应用实现,包含主应用组件、剧集列表、分类筛选、搜索排序等功能模块
javascript·react native·react.js·交互·harmonyos
qq_177767371 小时前
React Native鸿蒙跨平台自定义复选框组件,通过样式数组实现选中/未选中状态的样式切换,使用链式调用替代样式数组,实现状态驱动的样式变化
javascript·react native·react.js·架构·ecmascript·harmonyos·媒体
烬头88212 小时前
React Native鸿蒙跨平台采用了函数式组件的形式,通过 props 接收分类数据,使用 TouchableOpacity实现了点击交互效果
javascript·react native·react.js·ecmascript·交互·harmonyos
qq_177767372 小时前
React Native鸿蒙跨平台通过Animated.Value.interpolate实现滚动距离到动画属性的映射
javascript·react native·react.js·harmonyos
qq_177767373 小时前
React Native鸿蒙跨平台实现消息列表用于存储所有消息数据,筛选状态用于控制消息筛选结果
javascript·react native·react.js·ecmascript·harmonyos
ujainu4 小时前
Flutter + OpenHarmony 实战:从零开发小游戏(三)——CustomPainter 实现拖尾与相机跟随
flutter·游戏·harmonyos
拉轰小郑郑5 小时前
鸿蒙ArkTS中Object类型与类型断言的理解
华为·harmonyos·arkts·openharmony·object·类型断言
2601_949593655 小时前
基础入门 React Native 鸿蒙跨平台开发:Animated 动画按钮组件 鸿蒙实战
react native·react.js·harmonyos
菜鸟小芯5 小时前
【开源鸿蒙跨平台开发先锋训练营】DAY8~DAY13 底部选项卡&推荐功能实现
flutter·harmonyos
星辰徐哥5 小时前
鸿蒙APP开发从入门到精通:页面路由与组件跳转
华为·harmonyos