async/await和Promise，手写Promise

Hello_MyDream

于 2025-05-19 02:04:31 发布

阅读量999

点赞数 8

CC 4.0 BY-SA版权

分类专栏：鸿蒙开发文章标签： harmonyos 华为 ArkTS

本文链接：https://blog.youkuaiyun.com/Hello_MyDream/article/details/148053158

鸿蒙开发专栏收录该内容

5 篇文章

订阅专栏

async/await本质上是Promise的语法糖，使用async/await时暂停的是当前异步函数，而非整个线程，其他任务仍可执行。

在鸿蒙（HarmonyOS）开发中，await 是 async/await 异步编程模式的关键字，用于简化异步代码的编写，使其逻辑更接近同步代码风格。以下是具体说明：

async 函数：用 async 修饰的函数会自动返回 Promise 对象，表示异步操作。
await 表达式：只能在 async 函数内部使用，用于暂停当前函数的执行，等待 Promise 完成（成功或失败），并返回解析值。
示例代码（网络请求场景）：

async function fetchData() {
  try {
    const response = await http.request("https://api.example.com/data"); // 等待请求完成
    console.info(JSON.stringify(response.result));
  } catch (error) {
    console.error("请求失败:", error);
  }
}

底层依赖 Promise：await 本质是 Promise 的语法糖，需配合返回 Promise 的 API 使用。

线程管理：耗时任务建议结合 taskPool（线程池）或 Worker（独立线程）执行，避免主线程卡顿。

非阻塞：await 暂停的是当前异步函数，而非整个线程，其他任务仍可执行。

**性能优化：**合理使用可提升应用响应速度，尤其在 UI 交互场景。

继续讲解一下功能中的promise对象

在鸿蒙（HarmonyOS）开发中，Promise 是处理异步操作的核心对象，它通过状态管理和链式调用简化了异步编程。以下是详细解析：

Promise 的核心特性
• 三种状态：

• Pending（待定）：初始状态，异步操作未完成。

• Fulfilled（已兑现）：操作成功完成，通过 resolve(value) 触发。

• Rejected（已拒绝）：操作失败，通过 reject(error) 触发。

• 状态不可逆：一旦从 Pending 转为 Fulfilled 或 Rejected，状态将不再改变。

基本用法
创建 Promise

const promise = new Promise((resolve, reject) => {
  // 异步操作（如网络请求）
  setTimeout(() => {
    const success = Math.random() > 0.5;
    success ? resolve("成功数据") : reject("失败原因");
  }, 1000);
});

• resolve：传递成功结果，触发后续 .then()。

• reject：传递错误信息，触发 .catch() 或 .then() 的第二个参数。

处理结果

promise
  .then(result => console.log("成功:", result))
  .catch(error => console.error("失败:", error))
  .finally(() => console.log("无论成败都会执行"));

• .then()：处理成功状态，可链式调用。

• .catch()：捕获失败或异常。

• .finally()：无论成功与否都会执行（适用于清理逻辑）。

鸿蒙中的特殊应用
• 与异步任务结合：封装网络请求、文件读写等 I/O 操作，避免阻塞主线程。

• 并行处理：通过 Promise.all() 同时执行多个异步任务，等待全部完成：

Promise.all([fetchData1(), fetchData2()])
  .then(results => console.log("所有任务完成:", results));

与 async/await 的关系
async/await 是 Promise 的语法糖，例如：

async function loadData() {
  try {
    const data = await promise; // 等待 Promise 完成
    console.log(data);
  } catch (error) {
    console.error(error);
  }
}

• 优势：代码更接近同步风格，可读性更强。

注意事项
• 错误处理：未捕获的 reject 可能导致静默失败，务必使用 .catch() 或 try/catch。

• 性能优化：CPU 密集型任务建议结合 taskPool 或 Worker 线程池。

如需进一步了解，可参考鸿蒙官方文档中的异步并发开发指南。

什么是语法糖？

语法糖（Syntactic Sugar），也称为糖衣语法，是由英国计算机科学家彼得·约翰·兰达（Peter J. Landin）提出的术语，指编程语言中添加的某种语法结构，这种语法不改变语言的功能，但能让代码更简洁、易读或符合开发者的直觉。以下是核心要点：

本质与特点
• 功能等价性：语法糖在编译后会被转换为更基础的语法，运行时行为与原始写法完全一致。例如：

• C语言中 a[i] 是 *(a+i) 的语法糖。

• JavaScript的箭头函数 (a, b) => a + b 是传统匿名函数的简写。

• 开发效率：减少样板代码，提升可读性。如Java的 for-each 循环比传统 for 循环更简洁。

常见示例
• 异步编程：async/await 是 Promise 的语法糖，用同步风格写异步代码。

• 面向对象：C++的类可视为C语言结构体+指针操作的语法糖。

• 现代语言特性：

• PHP的短数组语法 [1, 2, 3] 替代 array(1, 2, 3)。

• Go的 := 自动类型推断简化变量声明。

意义与争议
• 优势：

• 降低认知负担，如Python的 with 语句自动管理资源。

• 促进最佳实践，如Java的 try-with-resources 避免资源泄漏。

• 争议：

• 过度使用可能掩盖底层逻辑（如泛型擦除导致运行时类型信息丢失）。

• 部分学者认为只有机器指令“非语法糖”，高级语言均为抽象层。

与编译器的关系
语法糖依赖编译器或解释器的“解糖”（Desugaring）过程。例如：
• Java的 lambda 表达式会被编译为匿名类。

• C#的 LINQ 转换为方法调用链。

总结：语法糖是编程语言设计的“用户体验优化”，平衡了表达力与简洁性。合理使用能提升效率，但需理解其底层实现以避免陷阱。

介绍一下promise的原本写法，和语法糖写法

在JavaScript中，Promise的原本写法和语法糖写法（async/await）是处理异步操作的两种方式，它们在功能上等价，但代码风格差异显著。以下是详细对比：

一、Promise 的原本写法（基础实现）
核心机制：通过 new Promise() 构造函数创建实例，用 .then()、.catch() 处理异步结果。

基本结构

// 1. 创建Promise实例
const promise = new Promise((resolve, reject) => {
  // 异步操作（如网络请求）
  setTimeout(() => {
    const success = Math.random() > 0.5;
    success ? resolve("成功数据") : reject("失败原因");
  }, 1000);
});

// 2. 处理结果
promise
  .then(result => console.log("成功:", result))
  .catch(error => console.error("失败:", error));

链式调用

fetchData()
  .then(data => processData(data))
  .then(processed => saveData(processed))
  .catch(error => console.error(error));

• 特点：需手动链式调用 .then()，错误通过 .catch() 捕获。

手写Promise实现

class MyPromise {
  constructor(executor) {
    this.state = 'pending';
    this.value = undefined;
    this.onFulfilledCallbacks = [];
    
    const resolve = (value) => {
      if (this.state === 'pending') {
        this.state = 'fulfilled';
        this.value = value;
        this.onFulfilledCallbacks.forEach(fn => fn(value));
      }
    };
    
    executor(resolve);
  }

  then(onFulfilled) {
    return new MyPromise((resolve) => {
      if (this.state === 'fulfilled') {
        resolve(onFulfilled(this.value));
      } else {
        this.onFulfilledCallbacks.push(() => {
          resolve(onFulfilled(this.value));
        });
      }
    });
  }
}

• 原理：维护状态机（pending/fulfilled/rejected）和回调队列。

二、语法糖写法（async/await）
核心机制：基于Promise封装，用同步代码风格写异步逻辑。

基本用法

async function fetchData() {
  try {
    const result = await someAsyncOperation(); // 等待Promise完成
    console.log("成功:", result);
  } catch (error) {
    console.error("失败:", error);
  }
}

• 特点：

• async 函数隐式返回Promise。

• await 暂停当前函数（非线程），直到Promise完成。

与Promise的等价转换

// Promise版本
function getData() {
  return fetch(url).then(res => res.json());
}

// async/await版本
async function getData() {
  const res = await fetch(url);
  return res.json();
}

• 优势：避免嵌套，直接使用 try/catch 处理错误。

底层原理

// async/await 被编译为类似以下代码
function _asyncToGenerator(fn) {
  return () => {
    const gen = fn();
    function step(key, arg) {
      let result;
      try {
        result = gen[key](arg);
      } catch (error) {
        return Promise.reject(error);
      }
      if (result.done) return result.value;
      return Promise.resolve(result.value).then(
        v => step("next", v),
        e => step("throw", e)
      );
    }
    return step("next");
  };
}

• 本质：通过生成器（Generator）和Promise实现协程调度。

三、关键区别

特性	Promise原本写法	async/await语法糖
代码风格	链式调用，回调风格	同步式代码，更直观
错误处理	`.catch()` 或 `then`的第二个参数	`try/catch` 块
调试体验	链式调用栈较深	线性执行，调试更简单
适用场景	简单异步任务、并行操作（`Promise.all`）	复杂异步流程控制（如依赖前序结果）

四、如何选择？

用Promise：需要精细控制并发（如 Promise.race）或兼容无async/await的环境。
用async/await：逻辑复杂的异步串行操作，或追求代码可读性。

示例：混合使用（并行请求+串行处理）

async function loadUserData() {
  const [user, posts] = await Promise.all([
    fetchUser(),
    fetchPosts()
  ]);
  return { user, posts };
}

通过理解两者关系，可灵活选择最优方案。如需深入Promise实现细节，可参考Promise/A+规范。