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知识点收藏
Feb 22 Javascript
JavaScript高级程序设计 阅读笔记(十八) js跨平台的事件
Aug 14 Javascript
JavaScript:Div层拖动效果实例代码
Aug 06 Javascript
JS正则表达式验证数字代码
Jan 28 Javascript
JavaScript知识点整理
Dec 09 Javascript
js接收并转化Java中的数组对象的方法
Aug 11 Javascript
Javascript中document.referrer隐藏来源的方法
Jan 16 Javascript
vue webuploader 文件上传组件开发
Sep 23 Javascript
zTree 树插件实现全国五级地区点击后加载的示例
Feb 05 Javascript
react-native 圆弧拖动进度条实现的示例代码
Apr 12 Javascript
jquery的$().each和$.each的区别
Jan 18 jQuery
Node.js控制台彩色输出的方法与原理实例详解
Dec 01 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
php操作MongoDB基础教程(连接、新增、修改、删除、查询)
2014/03/25 PHP
PHP 只允许指定IP访问(允许*号通配符过滤IP)
2014/07/08 PHP
微信公众号开发之微信公共平台消息回复类实例
2014/11/14 PHP
yii实现使用CUploadedFile上传文件的方法
2015/12/28 PHP
PHP中substr函数字符串截取用法分析
2016/01/07 PHP
PHP实现原比例生成缩略图的方法
2016/02/03 PHP
PHP实现求解最长公共子串问题的方法
2017/11/17 PHP
用JavaScrpt实现文件夹简单轻松加密的实现方法图文
2008/09/08 Javascript
php与js的区别是什么
2013/08/05 Javascript
浅谈JavaScript的Polymer框架中的事件绑定
2015/07/29 Javascript
再谈javascript注入 黑客必备!
2016/09/14 Javascript
jQuery仿写百度百科的目录树
2017/01/03 Javascript
vue数组对象排序的实现代码
2018/06/20 Javascript
vue interceptor 使用教程实例详解
2018/09/13 Javascript
JS与SQL方式随机生成高强度密码示例
2018/12/29 Javascript
[47:45]Liquid vs OG 2018国际邀请赛小组赛BO2 第二场 8.16
2018/08/17 DOTA
[01:06:54]DOTA2-DPC中国联赛 正赛 RNG vs Dragon BO3 第一场 1月24日
2021/03/11 DOTA
Anaconda下安装mysql-python的包实例
2018/06/11 Python
pyqt5 comboBox获得下标、文本和事件选中函数的方法
2019/06/14 Python
Python使用sklearn库实现的各种分类算法简单应用小结
2019/07/04 Python
Django 接收Post请求数据,并保存到数据库的实现方法
2019/07/12 Python
使用Python操作ArangoDB的方法步骤
2020/02/02 Python
django2.2 和 PyMySQL版本兼容问题
2020/02/17 Python
详解Pymongo常用查询方法总结
2021/01/29 Python
利用CSS3的checked伪类实现OL的隐藏显示的方法
2010/12/18 HTML / CSS
Mamas & Papas沙特阿拉伯:英国最受欢迎的婴儿品牌
2017/11/20 全球购物
韩国流行时尚女装网站:Dintchina(中文)
2018/07/19 全球购物
Stella McCartney官网:成衣、包袋、香水、内衣、童装及Adidas系列
2018/12/20 全球购物
Liu Jo西班牙官网:意大利服装品牌
2019/09/11 全球购物
DBA数据库管理员JAVA程序员架构师必看
2016/02/07 面试题
《长城和运河》教学反思
2014/04/14 职场文书
宣传普通话标语
2014/06/27 职场文书
2015年教务主任工作总结
2015/07/22 职场文书
六五普法先进个人主要事迹材料
2015/11/03 职场文书
海弦WR-800F
2022/04/05 无线电
vue-cli3.0修改打包后的文件名和文件地址,打包后本地运行报错解决
2022/04/06 Vue.js