react navite process.nextTick 和 Promise.then 的执行顺序

React Native 里,process.nextTick()Promise.then() 的执行顺序,不能简单套用浏览器的 Event Loop 规则。关键取决于 RN 使用的 JS Runtime(Hermes / JSC)以及 RN 的调度机制。

如果是在常见的 Hermes 环境下,可以先记住:

javascript 复制代码
process.nextTick(() => {
  console.log('nextTick');
});

Promise.resolve().then(() => {
  console.log('promise');
});

console.log('sync');

通常输出:

arduino 复制代码
sync
nextTick
promise

也就是:

arduino 复制代码
同步代码
   ↓
process.nextTick
   ↓
Promise.then
   ↓
其他异步任务

为什么?

Node.js 中,process.nextTick() 有一个专门的 nextTick queue,优先级高于 Promise microtask:

arduino 复制代码
┌─────────────────────┐
│ 同步 JavaScript      │
└──────────┬──────────┘
           ↓
┌─────────────────────┐
│ process.nextTick    │  ← 更高优先级
└──────────┬──────────┘
           ↓
┌─────────────────────┐
│ Promise microtask   │
│ queue               │
└──────────┬──────────┘
           ↓
┌─────────────────────┐
│ timer / IO / ...    │
└─────────────────────┘

但是这里有一个非常重要的 RN 特殊点

RN 不是 Node.js

React Native 里的:

arduino 复制代码
process.nextTick

并不是因为 RN 运行在 Node.js 中才存在的。RN/Metro 可能提供 Node API 的 polyfill,而不同 RN 版本、Hermes/JSC 配置下具体实现可能不同。

所以不要把下面这个 Node.js 结论无条件套到 RN:

arduino 复制代码
process.nextTick > Promise.then

尤其是现代 React Native + Hermes 环境,process.nextTick 的行为需要看实际 runtime/polyfill。

你可以直接测试:

javascript 复制代码
console.log('1');

process.nextTick(() => {
  console.log('2 nextTick');
});

Promise.resolve().then(() => {
  console.log('3 promise');
});

queueMicrotask?.(() => {
  console.log('4 microtask');
});

console.log('5');

如果你的目标是解决 RN 中某段代码到底谁先执行 的问题,最好把你当前 RN 版本、Hermes/JSC,以及这段代码贴出来,我可以按 RN Event Loop → Hermes Microtask → MessageQueue → React Scheduler 给你画出完整执行链。

相关推荐
雪芽蓝域zzs1 小时前
第四十二节:全局字典封装(后端字典,下拉选择复用)
开发语言·前端·javascript
用户64596598710881 小时前
Nginx + Vue Router 基础:SPA History 部署、反向代理与请求分流
前端
样子20181 小时前
Js 之根据白名单过滤 HTML(防止 XSS 攻击)
android·前端·javascript·html·xss
lewis_lk1 小时前
ReactJs状态迷思:从"常量"到"闭包陷阱"的底层逻辑
前端·react.js
尘世中一位迷途小书童1 小时前
在 Cesium 上画全球网格:我们怎么把 GeoSOT 接到瓦片调度上
前端·javascript·前端框架
aixingpan1 小时前
aixingpan.cn API开发文档:api_docs_trichart_natal_progression_ter_transit2接口指南
前端·php
liuyt20221 小时前
【javaweb】day3
前端
CoderYanger1 小时前
Java EE 进阶:2.3 JavaScript
java·开发语言·前端·javascript·css·职场和发展·java-ee
恋猫de小郭2 小时前
ADB Wi-Fi 2.0 ,Android 17 把无线调试的连接链路重新做了一遍
android·前端·flutter