Mock 语法讲解

简介: Mock 是生成随机数据,拦截 Ajax 请求的 JavaScript 库。本文来介绍下 Mock 的常用语法。

Mock 是生成随机数据,拦截 Ajax 请求的 JavaScript 库。

本文来介绍下 Mock 的常用语法。

模拟数据

生成随机数据

Mock.Random.boolean()

生成一个随机的布尔值。例如:

返回值为 truefalse

Mock.Random.integer(min, max)

生成一个随机的整数,可以指定范围。例如:

返回值为 010 之间的整数。

Mock.Random.float(min, max, dmin, dmax)

生成一个随机的浮点数,可以指定范围和精度。例如:

返回值为 0.00100.00000 之间的浮点数,精度为 25 位小数。

Mock.Random.string(length)

生成一个随机的字符串,可以指定长度。例如:

返回值为长度为 10 的随机字符串。

Mock.Random.date()

生成一个随机的日期。例如:

返回值为随机日期的字符串表示,例如 "1977-07-03"

Mock.Random.time()

生成一个随机的时间。例如:

返回值为随机时间的字符串表示,例如 "05:38:02"

Mock.Random.datetime()

生成一个随机的日期时间。例如:

返回值为随机日期时间的字符串表示,例如 "2007-06-29T22:03:06.140Z"

Mock.Random.image(size, background, foreground, format, text)

生成一个随机的图片,可以指定大小、背景色、前景色、格式和文字。例如:

返回值为图片的 Base64 编码字符串。

生成数据模板指定的数据

Mock.mock(template) 根据数据模板生成模拟数据。数据模版可以生成复杂的数据结构。

数据模版的语法如下:

  • 属性名和属性值之间用 : 分隔。
  • 属性与属性之间用 , 分隔。
  • 属性值是字符串类型,可以使用 @ 来表示占位符。
  • 属性值是对象类型,可以使用 name|rule 来表示生成规则。

示例:

const Mock = require('mockjs')
const data = Mock.mock({
  'list|1-10': [{
    'id|+1': 1, // 从 1 开始,每次加 1
    'name': '@cname', // 随机中文名字
    'age|18-60': 1, // 18 到 60 岁之间的整数
    'gender|1': ['男', '女'], // 男或女
    'email': '@email' // 随机电子邮件地址
  }]
})
console.log(data)

输出:

{
  "list": [
    {
      "id": 1,
      "name": "林志玲",
      "age": 32,
      "gender": "女",
      "email": "kbsc@pmpuaaq.pk"
    },
    {
      "id": 2,
      "name": "周杰伦",
      "age": 55,
      "gender": "男",
      "email": "whq@zjfwq.uz"
    },
    ...
  ]
}

模拟接口

  • Mock.mock(url, template) 根据接口地址和数据模板模拟接口请求。
  • Mock.mock(method, url, template) 根据请求方法、接口地址和数据模板模拟接口请求。

以上是 Mock 中常用的语法,更多语法请查阅官方文档。想进阶成为一位 Mock 高手?Apifox 是一个强大的接口文档管理工具,用 Apifox 可以让 Mock 变得更容易。Apifox 语法完全兼容 Mock, 并扩展了一些 Mock 没有的语法(如国内手机号 @phone)。小伙伴们可以去体验下。

知识扩展:

更多 Mock 相关知识可点击下方链接查看。

相关文章
|
15天前
|
存储 缓存 NoSQL
webFilter实现mock接口
这段代码实现了一个名为 `MockFilter` 的类,继承自 `WebFilter` 接口,用于处理 HTTP 请求和响应。它通过从 Redis 缓存中获取配置信息来决定是否使用模拟数据或缓存数据来响应请求。如果开启了生产模式或关闭了模拟和缓存功能,则直接放行请求。否则,它会检查请求体并根据配置返回相应的模拟或缓存数据。同时,该过滤器支持对响应结果进行处理,并将结果存储回 Redis 中。
|
3月前
|
测试技术
详解单元测试问题之处理@Mock注解时mock对象的创建如何解决
详解单元测试问题之处理@Mock注解时mock对象的创建如何解决
32 1
|
5月前
|
JavaScript 数据安全/隐私保护
Mock
Mock
78 0
|
5月前
|
JSON 前端开发 JavaScript
如何使用Mock.js来模拟后端接口
如何使用Mock.js来模拟后端接口
68 0
Jest模拟函数Mock Function部分模块
Jest模拟函数Mock Function部分模块
142 0
|
数据可视化 前端开发 Java
Mock工具介绍,为什么使用Mock?
Mock工具介绍,为什么使用Mock?
562 0
|
JavaScript
express快速mock数据
express快速mock数据
122 0
|
JavaScript 前端开发
关于jsx语法的注意事项
一、在jsx中写注释 二、jsx注意点
关于jsx语法的注意事项
|
敏捷开发 设计模式 Java
mock打桩之EasyMock
TDD是测试驱动开发(Test-Driven Development)的英文简称,是敏捷开发中的一项核心实践和技术,也是一种设计方法论。TDD的原理是在开发功能代码之前,先编写单元测试用例代码,测试代码确定需要编写什么产品代码。TDD虽是敏捷方法的核心实践,但不只使用于XP(Extreme Programming),同样可以适用于其他开发方法和过程。
mock打桩之EasyMock
|
JSON 前端开发 大数据
接口测试 Mock 实战(二) | 结合 jq 完成批量化的手工 Mock
因为本章的内容是使用jq工具配合完成,因此在开始部分会先花一定的篇幅介绍jq机器使用,如果读者已经熟悉jq,可以直接跳过这部分。 先来看应用场景,App 经常会有一些信息展示的列表页,比如商家的菜品、股票的公司、文章的列表展示等,例如下面这样: 菜品不够吃的话~不是,是菜品数量较少不够测试的量,假如我们想要测试几百个菜品时,会不会在刷的时候是否有性能影响,展示是否正常,列表展示的边界值测试等;