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 相关文章推荐
extjs fckeditor集成代码
May 10 Javascript
js实时获取系统当前时间实例代码
Jun 28 Javascript
Javascript 按位与运算符 (&amp;)使用介绍
Feb 04 Javascript
javascript 处理null及null值示例
Jun 09 Javascript
jquery获取选中的文本和值的方法
Jul 08 Javascript
在JavaScript中处理字符串之fontcolor()方法的使用
Jun 08 Javascript
Bootstrap弹出带合法性检查的登录框实例代码【推荐】
Jun 23 Javascript
利用CSS、JavaScript及Ajax实现图片预加载的方法
Nov 29 Javascript
jQuery网页定位导航特效实现方法
Dec 19 Javascript
webpack打包node.js后端项目的方法
Mar 10 Javascript
微信小程序获取音频时长与实时获取播放进度问题
Aug 28 Javascript
小程序rich-text组件如何改变内部img图片样式的方法
May 22 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
一个取得文件扩展名的函数
2006/10/09 PHP
php通过淘宝API查询IP地址归属等信息
2015/12/25 PHP
PHP简单创建压缩图的方法
2016/08/24 PHP
在JavaScript中使用inline函数的问题
2007/03/08 Javascript
javascript 写类方式之三
2009/07/05 Javascript
JS 用6N±1法求素数 实例教程
2009/10/20 Javascript
javascript实现分栏显示小技巧附图
2014/10/13 Javascript
判断字符串的长度(优化版)中文占两个字符
2014/10/30 Javascript
JS运动基础框架实例分析
2015/03/03 Javascript
Bootstrap表单布局
2016/07/19 Javascript
详解webpack+vue-cli项目打包技巧
2017/06/17 Javascript
vue数据控制视图源码解析
2018/03/28 Javascript
node中间层实现文件上传功能
2018/06/11 Javascript
通过npm或yarn自动生成vue组件的方法示例
2019/02/12 Javascript
jQuery-Citys省市区三级菜单联动插件使用详解
2019/07/26 jQuery
JS实现页面数据懒加载
2020/02/13 Javascript
es6函数之箭头函数用法实例详解
2020/04/25 Javascript
[53:43]VP vs NewBee Supermajor 胜者组 BO3 第三场 6.5
2018/06/06 DOTA
常见的在Python中实现单例模式的三种方法
2015/04/08 Python
Python处理文本文件中控制字符的方法
2017/02/07 Python
Python在不同目录下导入模块的实现方法
2017/10/27 Python
python tensorflow基于cnn实现手写数字识别
2018/01/01 Python
一个Python最简单的接口自动化框架
2018/01/02 Python
Python 解决中文写入Excel时抛异常的问题
2018/05/03 Python
python实现任意位置文件分割的实例
2018/12/14 Python
戴尔英国官网:Dell英国
2017/05/27 全球购物
德国排名第一的主题公园门票网站:Attraction Tickets Direct
2019/09/09 全球购物
初中生物教学反思
2014/01/10 职场文书
2014新年元旦活动策划方案
2014/02/18 职场文书
财政局党的群众路线教育实践活动剖析材料
2014/10/13 职场文书
初中生300字旷课检讨书
2014/11/19 职场文书
活动总结书怎么写
2015/05/11 职场文书
2016年大学生社会实践心得体会
2015/10/09 职场文书
python中os.path.join()函数实例用法
2021/05/26 Python
使用Python脚本对GiteePages进行一键部署的使用说明
2021/05/27 Python
Android Studio实现简易进制转换计算器
2022/05/20 Java/Android