最常用且高效的方式是结合 Mock.js 或 MSW + faker.js 规则驱动生成嵌套假数据；Mock.js 用模板语法自动处理层级、数组与引用，MSW 则通过接口粒度拦截配合 faker.js 构建可测试 mock 层，并推荐 TypeScript 接口约束类型。
JavaScript 中模拟复杂嵌套对象结构数据，最常用且高效的方式是结合 Mock.js（或现代替代方案如 MSW + faker.js）来生成符合结构、类型和业务逻辑的假数据。关键不是“硬写对象”，而是用规则驱动生成，兼顾可维护性与真实性。
用 Mock.js 快速生成带层级关系的嵌套数据
Mock.js 支持通过模板语法（如 @ 占位符）和函数式规则定义嵌套结构，自动处理数组、对象、引用、递归等场景。
- 安装：
npm install mockjs - 基础示例：模拟用户列表，每个用户含地址、订单（多条）、收货人信息（可能与用户同名或不同）：
const Mock = require('mockjs');
const data = Mock.mock({
'users|5': [{ // 生成 5 个用户
'id|+1': 1,
'name': '@cname',
'email': '@email',
'avatar': '@image("40x40", "#4A9EFF", "U")',
'address': {
'province': '@province',
'city': '@city',
'detail': '@county(true)'
},
'orders|2-4': [{ // 每个用户有 2~4 个订单
'order_id': '@guid',
'amount|100-1000.2': 1,
'status|1': ['pending', 'shipped', 'delivered'],
'items|1-3': [{ // 每个订单含 1~3 个商品
'sku': '@string("number", 8)',
'name': '@cword(3, 6)',
'quantity|1-5': 1,
'price|20-200.1': 1
}]
}],
'contact': { // 收货人，部分字段可引用用户自身
'name': '@cname',
'phone': /^1[3-9]\d{9}$/,
'is_default|1': true
}
}]
});
console.log(JSON.stringify(data, null, 2));
处理循环引用与动态关联（比如订单中引用用户 ID）
Mock.js 默认不支持跨层级变量引用，但可通过 function() 规则手动控制逻辑，实现真实关联关系。
- 在数组项内部用函数返回值，访问当前上下文（
this）或外部变量 - 示例：让每个订单的
user_id自动等于所在用户的id：
Mock.mock({
'users|3': [{
'id|+1': 1000,
'name': '@cname',
'orders|2': [{
'order_id': '@guid',
'user_id': function() {
return this.parent.id; // this.parent 指向当前 user 对象
},
'total': '@integer(50, 500)'
}]
}]
});
用 MSW + faker.js 构建更可控、可测试的 Mock 层（推荐用于新项目）
Mock.js 已逐渐被 MSW（Mock Service Worker）取代，尤其在前端工程化、TypeScript 和真实请求拦截场景下。它不侵入代码，支持按接口粒度 mock，配合 faker.js 生成高质量嵌套结构。
立即学习“Java免费学习笔记（深入）”；
- 安装：
npm install msw faker - 示例：mock
/api/users返回含嵌套 profile、posts、followers 的用户数据：
import { rest } from 'msw';
import { setupServer } from 'msw/node';
import { faker } from '@faker-js/faker';
const server = setupServer(
rest.get('/api/users', (req, res, ctx) => {
const users = Array.from({ length: 5 }, () => ({
id: faker.string.uuid(),
name: faker.person.fullName(),
email: faker.internet.email(),
profile: {
bio: faker.lorem.sentence(),
avatar: faker.image.avatar(),
joined_at: faker.date.past().toISOString()
},
posts: Array.from({ length: faker.number.int({ min: 0, max: 3 }) }, () => ({
id: faker.string.uuid(),
title: faker.lorem.sentence({ min: 3, max: 6 }),
content: faker.lorem.paragraphs({ min: 1, max: 2 }),
tags: faker.helpers.arrayElements(['tech', 'life', 'design', 'work'], { min: 1, max: 3 })
})),
followers: Array.from({ length: faker.number.int({ min: 5, max: 50 }) }, () => ({
id: faker.string.uuid(),
name: faker.person.fullName(),
avatar: faker.image.avatar()
}))
}));
return res(ctx.status(200), ctx.json({ code: 0, data: users }));
})
);
server.listen();
小技巧：用 TypeScript interface + 类型守卫提升 Mock 可靠性
即使生成假数据，也建议先定义好 TypeScript 接口，再基于它生成数据（例如用 faker 手动构造），避免结构漂移。
- 定义
User、Order、Address等 interface - 编写工厂函数（如
createUser()），返回符合类型的对象，便于单元测试和 IDE 提示 - 在 Jest 或 Vitest 中直接 import 并使用，不依赖全局 mock 工具
