React Native+Expo跨端运行报错：Object.groupBy未定义

云原生阿岚

2026-6-21

问题描述

使用React Native + Expo开发移动端应用，Web版本运行正常，但在iOS 15.7.5的iPhone 6s设备和Android 12的Pixel3a模拟器上运行时出现错误。

涉及代码：

const preData = Object.groupBy(filtredProdList, (prod) => {
  return prod.categories[0].name;
});

报错信息：

ERROR  TypeError: Object.groupBy is not a function (it is undefined)

已尝试的解决方案：

在package.json的dependencies中添加"node": "^21.6.1"
安装core-js并导入import { groupBy } from "core-js/actual/array/group-by";
安装最新测试版TypeScript：npm i typescript@next

备注：已知Object.groupBy是较新特性，也可以用reduce()替代，但需要解决当前使用Object.groupBy的问题。

额外问题：有没有渠道可以查询哪些JS函数能在React Native/Expo移动端正常运行？

解决方案

报错原因

Object.groupBy是ES2024新增的特性，iOS 15.7.5的JavaScriptCore引擎（React Native iOS底层依赖）、Android 12默认的Hermes引擎都不支持这个新API。Web端浏览器更新快，所以能正常运行，这就是跨端差异的根源。

你之前的尝试存在几个误区：

给package.json加node版本完全没用——React Native移动端运行环境不是Node.js，是设备自带的JS引擎，Node版本配置对移动端无效。
core-js导入路径错误——你导入的是数组的groupBy，但实际需要的是对象的Object.groupBy，对应路径是core-js/actual/object/group-by。
升级TypeScript只解决类型提示问题，无法弥补运行时引擎不支持API的缺陷。

正确修复步骤

方法1：正确使用core-js polyfill

确保已安装core-js：

npm install core-js

两种使用方式：
- 全局polyfill：在项目入口文件（比如App.js/index.js）顶部加一行，让所有代码都能直接用Object.groupBy：
```
import 'core-js/actual/object/group-by';
```
- 按需导入：直接导入groupBy函数替换原代码调用：
```
import { groupBy } from 'core-js/actual/object/group-by';

const preData = groupBy(filtredProdList, (prod) => prod.categories[0].name);
```

方法2：配置Expo Babel自动polyfill

如果用Expo，可以让Babel根据目标平台自动补全缺失的API：

安装依赖：

npm install @babel/preset-env --save-dev

项目根目录创建babel.config.js，写入以下配置：

module.exports = function(api) {
  api.cache(true);
  return {
    presets: [
      'babel-preset-expo',
      [
        '@babel/preset-env',
        {
          useBuiltIns: 'usage',
          corejs: 3, // 对应你安装的core-js大版本，比如3.x
          targets: {
            ios: '15.7',
            android: '12'
          }
        }
      ]
    ]
  };
};

配置后重新构建项目，Babel会自动给目标平台不支持的API加polyfill，不用手动导入。

方法3：升级Hermes引擎（仅Android）

Android端的Hermes引擎从0.11.0版本开始支持Object.groupBy，可以在package.json中指定版本：

{
  "dependencies": {
    "hermes-engine": "^0.11.0"
  }
}

安装后重新构建Android项目即可。但iOS的JavaScriptCore无法升级，所以这个方法只能解决Android问题，还是需要配合polyfill覆盖iOS场景。

额外问题解答

查询JS API兼容性可以用这些方式：

查看React Native官方文档的JavaScript Runtime章节，里面会说明各版本RN对应的JS引擎支持的API范围。
直接查对应引擎的特性列表：
- iOS：JavaScriptCore的特性支持和iOS系统版本绑定，可查各iOS版本JS引擎支持的ECMAScript特性。
- Android：Hermes官方文档会列出支持的ECMAScript特性版本。
用@babel/preset-env的配置工具，输入目标平台（ios 15.7、android 12），就能看到哪些API需要polyfill。

内容的提问来源于stack exchange，提问作者art_hq