MockJS是一种用于模拟数据的较为成熟的工具。在前端开发和调试过程中，建立一个基于真实数据的前端框架是非常有必要的。同时，MockJS还能够满足前端开发人员模拟接口数据、接口数据模拟与联调和前端自测等需求。在app开发中，MockJS可被用来模拟接口数据，简化开发流程，提高开发效率。
那么，app开发是否能够使用MockJS呢？答案是肯定的。实际上，只要是前端领域，包括网页以及应用开发等等领域，都可以使用MockJS。更具体的来说，通过MockJS生成模拟数据，在web应用及app开发中能够极大地改善开发效率。接下来，我们来了解一下背后的原理和详细的使用方法。
## 原理介绍
MockJS提供的是在前端过程中模拟json数据、图片、文字、等各种类型的数据来验证前端页面渲染及一些功能，在项目中进行mock、JSON-mock或者HTTP-mock。MockJS根据一个数据模板（template）反复生成数据（data），能够帮助前端人员快速生成符合要求的随机数据。MockJS原理如下：
1. 设置数据模板
MockJS是基于数据模板机制的，即我们需要设置数据模板，然后MockJS会自动生成符合数据模板的随机数据。具体而言，每个模板代表一类数据，有对应的生成规则指定，数据被随机生成。在设置数据模板时，MockJS提供了一些基本的数据类型，如数字、字符串、对象、数组和布尔等。用户也可以根据需要自定义数据类型及生成规则。
2. 解析数据模板并生成数据
MockJS框架解析每个数据模板，在生成数据时，采用类似于模板引擎的方式进行处理，从而生成符合数据模板的随机数据。
3. 生成数据格式
MockJS支持生成常见的格式，如json格式、xml格式，等等。前端开发人员可以根据自身的需要选择合适的生成格式。
## 详细介绍
在进行app开发时，开发人员可以使用MockJS模拟api数据，不必等待后台接口开发完成。在请求数据时，仅需要更换对应的api地址即可获得模拟数据。以下是使用MockJS进行app开发的具体方法：
1. 安装MockJS
```
npm install mockjs
```
2. 导入MockJS
```
import Mock from 'mockjs'
```
3. 设置数据模板
```
Mock.mock('http://test.com/api/list', {
'list|10': [{
'id|+1': 1,
'name': '@name',
'age|18-30': 1,
}]
})
```
在这里，我们使用MockJS设置了一个http://test.com/api/list接口，该接口可以返回一个含有对象数组的json数据，数组包含10个对象，每个对象都有一个id、name和age属性。其中，id属性的值是从1开始自增长的，name属性的值是随机生成的人名，age属性的值是18-30之间的数字。
4. 发送请求
在前端开发中，我们可以使用axios来进行数据请求：
```
import axios from 'axios'
axios.get('http://test.com/api/list').then(response => {
console.log(response.data.list)
})
```
这样，在浏览器中打开页面时，我们便可以看到控制台输出了一个包含10个对象的数组。
使用MockJS进行app开发，可以帮助我们轻松测试前端代码的逻辑。在开发过程中，我们不必等待后端人员的接口，便可以使用数据模板与MockJS实现伪造数据和模拟api请求。另外，MockJS还可以帮助我们更好地调试前端代码，提高开发效率。
总之，在进行app开发时，我们可以利用MockJS的强大功能帮助我们更高效地完成开发。模拟数据不仅在测试、调试的过程中能够起到极大的作用，也可以提前进入前端页面开发，达到前后端分离的效果。
