js按條件生成隨機json:randomjson實現方法
前端開發(fā)中，在做前后端分離的時候，經常需要手寫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": "北京市海淀區(qū)西三旗",
"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": "北京市海淀區(qū)西三旗",
"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": "北京市海淀區(qū)西三旗",
"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實現方法就是小編分享給大家的全部內容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關文章
如何使用electron-builder及electron-updater給項目配置自動更新
這篇文章主要介紹了如何使用electron-builder及electron-updater給項目配置自動更新，小編覺得挺不錯的，現在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-12-12
這篇文章主要介紹了redux處理異步action解決方案,文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2020-03-03
這篇文章主要給大家總結介紹了關于利用JS判斷客戶端類型的四種方法，比如通過通過判斷瀏覽器的userAgent、檢查是否是移動端（Mobile）、ipad、iphone、微信、QQ等的方法，需要的朋友可以參考借鑒，下面2017-12-12
本篇文章主要是對Ajax提交與傳統(tǒng)表單提交的區(qū)別進行了詳細的介紹，需要的朋友可以過來參考下，希望對大家有所幫助2014-02-02
這篇文章主要為大家詳細介紹了JavaScript實現星級評價效果，具有一定的參考價值，感興趣的小伙伴們可以參考一下2019-05-05
這篇文章主要介紹了bootstrap日期控件（雙日期、清空等問題解決）相關知識,需要的朋友可以參考下2017-04-04
這篇文章主要介紹了JavaScript的Proxy可以做哪些有意思的事兒,Proxy是ES6中提供的新的API，可以用來定義對象各種基本操作的自定義行為 （在文檔中被稱為traps，我覺得可以理解為一個針對對象各種行為的鉤子），,需要的朋友可以參考下2019-06-06
這篇文章主要為大家詳細介紹了js實現內置計時器，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2019-12-12
這篇文章主要介紹了用 js 寫一個 js 解釋器過程詳解,文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下2019-08-08
如何使用JavaScript快速創(chuàng)建一個1到100的數組
平時寫代碼時,我們會生產一些測試用的數組數據,比如[1,100]的數組值,下面這篇文章主要給大家介紹了關于如何使用JavaScript快速創(chuàng)建一個1到100數組的相關資料,需要的朋友可以參考下2022-08-08