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 相关文章推荐
自动完成JS类(纯JS, Ajax模式)
Mar 12 Javascript
capacityFixed 基于jquery的类似于新浪微博新消息提示的定位框
May 24 Javascript
读jQuery之十一 添加事件核心方法
Jul 31 Javascript
捕获浏览器关闭、刷新事件不同情况下的处理方法
Jun 02 Javascript
Jquery实现自定义tooltip示例代码
Feb 12 Javascript
javascript使用数组的push方法完成快速排序
Sep 15 Javascript
JavaScript中使用指数方法Math.exp()的简介
Jun 15 Javascript
快速学习JavaScript的6个思维技巧
Oct 13 Javascript
利用jquery去掉时光轴头尾部线条的方法实例
Jun 16 jQuery
微信小程序实现带参数的分享功能(两种方法)
May 17 Javascript
express框架下使用session的方法
Jul 31 Javascript
如何基于JS截获动态代码
Dec 25 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删除非空目录的函数代码小结
2013/02/28 PHP
PHP合并静态文件详解
2014/11/14 PHP
PHP代码优化技巧小结
2015/09/29 PHP
php多进程中的阻塞与非阻塞操作实例分析
2020/03/04 PHP
(currentStyle)javascript为何有时用style得不到已设定的CSS的属性
2007/08/15 Javascript
jQuery 下拉列表 二级联动插件分享
2012/03/29 Javascript
原生js实现半透明遮罩层效果具体代码
2013/06/06 Javascript
开发插件的两个方法jquery.fn.extend与jquery.extend
2013/11/21 Javascript
qq悬浮代码(兼容各个浏览器)
2014/01/29 Javascript
node.js中的fs.symlinkSync方法使用说明
2014/12/15 Javascript
jquery仿QQ登录账号选择下拉框效果
2016/03/22 Javascript
AngularJS入门教程之AngularJS表达式
2016/04/18 Javascript
基于BootStrap Metronic开发框架经验小结【五】Bootstrap File Input文件上传插件的用法详解
2016/05/12 Javascript
js中遍历对象的属性和值的方法
2016/07/27 Javascript
bootstrap侧边栏圆点导航
2017/01/11 Javascript
利用Js+Css实现折纸动态导航效果实例源码
2017/01/25 Javascript
d3.js实现立体柱图的方法详解
2017/04/28 Javascript
通过构造函数实例化对象的方法
2017/06/28 Javascript
微信小程序scroll-view横向滑动嵌套for循环的示例代码
2018/09/20 Javascript
PHPStorm中如何对nodejs项目进行单元测试详解
2019/02/28 NodeJs
js实现踩五彩块游戏
2020/02/08 Javascript
Python自动化测试Eclipse+Pydev 搭建开发环境
2016/08/15 Python
使用python为mysql实现restful接口
2018/01/05 Python
Python实现模拟登录网易邮箱的方法示例
2018/07/05 Python
Python函数参数操作详解
2018/08/03 Python
Selenium关闭INFO:CONSOLE提示的解决
2020/12/07 Python
python中Mako库实例用法
2020/12/31 Python
Tomcat的缺省是多少,怎么修改
2014/04/09 面试题
传播学毕业生求职信
2013/10/11 职场文书
2014年最新大专生职业生涯规划书范文
2014/09/13 职场文书
项目经理助理岗位职责
2015/04/13 职场文书
2015年党总支工作总结
2015/05/25 职场文书
2019学生会干事辞职信
2019/06/27 职场文书
用Python实现Newton插值法
2021/04/17 Python
Java字符串逆序方法详情
2022/03/21 Java/Android
Mysql数据库group by原理详解
2022/07/07 MySQL