js按条件生成随机json:randomjson实现方法


Posted in Javascript onApril 07, 2017

前端开发中,在做前后端分离的时候,经常需要手写json数据,有3个问题特别揪心:

1,数据是写死的,不能按一定的条件随机生成长度不一,内容不一的数据

2,写数组的时候,如果有很多条,需要一条一条地写,费时费力

3,mock图片特别困难

randomjson用来根据模型随机生成json,mock json数据的时候特别有用

github地址:

https://github.com/finance-sh/randomjson

如何使用

# randomjson

根据条件生成json对应的随机json

## 如何使用

### 安装

   npm install randomjson

### 用法

// 安装

  npm install randomjson

// 用法
  // 引用包
  var randomjson = require('randomjson');
  // 模型
  var modelJson = {
    "code": "00",
    "numberCode": "<@[10000,20000]>",
    "msg": "<@chinese{12,50}>",
    "msg2": "<@string{2,3}>",
    "logo": "<@image{100,100}>",
    "result": {
      "pList<@{1,3}>":[ 
        {
          "indexToString": "<@index><@>",
          "index": "<@index>",
          "id": "<@[1-5]>", 
          "price": "<@float>",
          "name": "公司名称<@index>",
          "person": "李文武<@index>",
          "address": "北京市海淀区西三旗",
          "mobile": "1<@number{10}>",
          "tel": "<@number{4}>-<@number{8}>",
          "list": [
            {
              "auditKey": 1,
              "auditValue": "<@[0,1,2]>"
            }, 
            {
              "auditKey": 2,
              "auditValue": "<@[0,1,2]>"
            }
          ]
        }
      ]
    }
  }
  // 根据模型生成json
  var myJson = randomjson(modelJson);
  
  根据上边模型生成的json可能是这样:
  
  {
    "code": "00",
    "numberCode": 10000,
    "msg": "加义为边平压你治提用根治问求只或程干立农资特",
    "msg2": "dv",
    "logo": "https://dummyimage.com/100x100",
    "result": {
      "pList": [
        {
          "indexToString": "1",
          "index": 1,
          "id": 2,
          "price": 93.78,
          "name": "公司名称1",
          "person": "李文武1",
          "address": "北京市海淀区西三旗",
          "mobile": "17929438781",
          "tel": "1148-56055642",
          "list": [
            {
              "auditKey": 1,
              "auditValue": 0
            },
            {
              "auditKey": 2,
              "auditValue": 1
            }
          ]
        },
        {
          "indexToString": "2",
          "index": 2,
          "id": 5,
          "price": 29.49,
          "name": "公司名称2",
          "person": "李文武2",
          "address": "北京市海淀区西三旗",
          "mobile": "17826945504",
          "tel": "7298-46226026",
          "list": [
            {
              "auditKey": 1,
              "auditValue": 0
            },
            {
              "auditKey": 2,
              "auditValue": 0
            }
          ]
        }
      ]
    }
  }

## 词法

   以<@开始,以>结束,中间内容是randomjson的词法

## 模型定义

### 数据类型

   "<@number>": number类型

   "<@string>": string类型

   "<@null>": null

   "<@boolean>": boolean类型

   "<@chinese>": 中文字符串

   "<@float{number1,number2}>": 浮点数 number1代表整数位数,number2代表小数位数,默认都为2
  
"<@image{width,height}>": 生成图片 width为生成图片宽度,height为生成图片高度,默认为400,400

   "<@index>": 元素在数组中的位置,从1开始

### 量词

   {minNumber, maxNumber}: minNumber到maxNumber个

   {minNumber,}: 最少minNumber

   {number}: number个

   如果是float,minNumber, maxNumber表示整数部分和小数部分的位数

   如果是imgae,minNumber, maxNumber表示图片宽度高度
  
### 随机生成其中之一

   你可以使用“|” 分离多个选项,随机值是其中之一,值为字符串

### 数字范围

   [1,2,3] 表示1,2,3中的一个,值为数字

   [1-90] 表示1到90中的一个int值,值为数字

### 数字转字符串

   在number类型后加空的占位符
 
"indexToString": "<@index><@>"

### 量词定义注意点

   值为非数组时,长度在value字符串里,例如:"ret": "<@number{4}>"

   值为数组时,长度在key里,例如:

"p11<@{2,5}>": [{
        "p8": "12312",
        "p9": ["<@string{4,7}>"],
        "p10": "<@string>"
      }]

github地址:

https://github.com/finance-sh/randomjson

以上这篇js按条件生成随机json:randomjson实现方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript URL编码和解码使用说明
Apr 12 Javascript
表单JS弹出填写提示效果代码
Apr 16 Javascript
jquery中$each()方法的使用指南
Apr 30 Javascript
javascript入门教程基础篇
Nov 16 Javascript
javascript基于prototype实现类似OOP继承的方法
Dec 16 Javascript
javascript另类方法实现htmlencode()与htmldecode()函数实例分析
Nov 17 Javascript
Ajax 加载数据 练习代码
Jan 05 Javascript
在JS中如何把毫秒转换成规定的日期时间格式实例
May 11 Javascript
bootstrap手风琴折叠示例代码分享
May 22 Javascript
React+Redux实现简单的待办事项列表ToDoList
Sep 29 Javascript
jQuery实现移动端笔触canvas电子签名
May 21 jQuery
antd的select下拉框因为数据量太大造成卡顿的解决方式
Oct 31 Javascript
详解JS中遍历语法的比较
Apr 07 #Javascript
JavaScript原生数组Array常用方法
Apr 06 #Javascript
微信小程序 图片宽度自适应的实现
Apr 06 #Javascript
微信小程序 下拉菜单的实现
Apr 06 #Javascript
微信小程序五星评分效果实现代码
Apr 06 #Javascript
原生javascript上传图片带进度条【实例分享】
Apr 06 #Javascript
jQuery实现文章图片弹出放大效果
Apr 06 #jQuery
You might like
全国FM电台频率大全 - 12 安徽省
2020/03/11 无线电
在 Laravel 中动态隐藏 API 字段的方法
2019/10/25 PHP
IE之动态添加DOM节点触发window.resize事件
2010/07/27 Javascript
JavaScript的strict模式与with关键字介绍
2014/02/08 Javascript
Ajax局部更新导致JS事件重复触发问题的解决方法
2014/10/14 Javascript
JavaScript实现自动生成网页元素功能(按钮、文本等)
2015/11/21 Javascript
win7下安装配置node.js+express开发环境
2015/12/06 Javascript
KnockoutJs快速入门教程
2016/05/16 Javascript
jQuery事件绑定用法详解
2016/09/08 Javascript
纯js模仿windows系统日历
2017/02/04 Javascript
BootstrapTable refresh 方法使用实例简单介绍
2017/02/20 Javascript
Vue和Bootstrap的整合思路详解
2017/06/30 Javascript
JavaScript中.min.js和.js文件的区别讲解
2019/02/13 Javascript
解决微信小程序云开发中获取数据库的内容为空的方法
2019/05/15 Javascript
ionic3双击返回退出应用的方法
2019/09/17 Javascript
浅谈JavaScript中你可能不知道URL构造函数的属性
2020/07/13 Javascript
Vue基于iview table展示图片实现点击放大
2020/08/05 Javascript
Vue实现返回顶部按钮实例代码
2020/10/21 Javascript
pycharm 使用心得(八)如何调用另一文件中的函数
2014/06/06 Python
web.py中调用文件夹内模板的方法
2014/08/26 Python
Django分页功能的实现代码详解
2019/07/29 Python
Python字典的概念及常见应用实例详解
2019/10/30 Python
python 中值滤波,椒盐去噪,图片增强实例
2019/12/18 Python
Python使用urllib模块对URL网址中的中文编码与解码实例详解
2020/02/18 Python
基于Tensorflow一维卷积用法详解
2020/05/22 Python
使用keras内置的模型进行图片预测实例
2020/06/17 Python
字符串str除首尾字符外的其他字符按升序排列
2013/03/08 面试题
数据库基础的一些面试题
2012/02/25 面试题
工厂车间标语
2014/06/19 职场文书
2014年辅导员工作总结
2014/11/18 职场文书
2014年副班长工作总结
2014/12/10 职场文书
法律意见书范本
2015/06/04 职场文书
2015年清剿火患专项行动工作总结
2015/07/27 职场文书
小学生法制教育心得体会
2016/01/14 职场文书
教你快速开启Apache SkyWalking的自监控
2021/04/25 Servers
python批量创建变量并赋值操作
2021/06/03 Python