Mock.js

1 Mock.js 簡介

1.1 什么是 Mock.js？

Mock.js 是一款模擬數據生成器，旨在幫助前端攻城師獨立于后端進行開發，幫助編寫單元測試。

1.2 Mock.js安裝

在 CMD 輸入如下命令：

cnpm?install?mockjs 

2 語法規范

Mock.js 的語法規范包括兩部分：

• 數據模板定義規范（Data Template Definition，DTD）

• 數據占位符定義規范（Data Placeholder Definition，DPD）

2.1 數據模板定義規范 DTD

• 數據模板中的每個屬性由 3 部分構成：屬性名、生成規則、屬性值：'屬性名|生成規則' : value

• 生成規則有七種格式：

  • 'name|min-max': value

  • 'name|count': value

  • 'name|min-max.dmin-dmax': value

  • 'name|min-max.dcount': value

  • 'name|count.dmin-dmax': value

  • 'name|count.dcount': value

  • 'name|+step': value

• 生成規則的含義需要依賴屬性值的類型才能確定

• 屬性值 中可以含有 @占位符

• 屬性值 還指定了最終值的初始值和類型

2.1.1 屬性值是字符串 String

• 'name|min-max': string

  重復 string 生成一個字符串，重復次數大于 min，小于 max

• 'name|count': string

  重復 string 生成一個字符串，重復 count 次

2.1.2 屬性值是數字 Number

• 'name|+1': number

  屬性值自動+1

• 'name|min-max': number

  生成一個介于 min-max 之間的整數

• 'name|min-max.dmin-dmax': number

  生成一個整數部分介于 min-max 之間，小數部分保留 dmin-dmax 位的浮點數

2.1.3 屬性值是布爾 Boolean

• 'name|1': boolean

  隨機生成一個 boolean 值，真或假的概率都為 1/2

• 'name|min-max': value

  隨機生成一個布爾值，值為 value 的概率是 min/(min+max)，值為 !value 的概率是 max(min+max)

2.1.4 屬性值是對象 Object

• 'name|count': object

  從 object 中取 count 個屬性

• 'name|min-max': object

  從 obejct 中取 min-max 個屬性

2.1.5 屬性值是數組 Array

• 'name|1': array

  從 array 中隨機取一個元素，作為最終值

• 'name|+1': array

  從 array 中順序取一個元素，作為最終值

• 'name|min-max': array

  通過重復 array 生成一個新數組，重復次數大于等于 min，小于等于 max

• 'name|count': array

  通過重復 array 生成一個新數組，重復次數為 count 次

2.1.6 屬性值是函數 Function

• 'name':function

  執行函數 function，取其返回值作為最終的屬性值，函數的上下文為屬性 name 所在的對象

2.1.7 屬性值是正則表達式 RegExp

• 'name': regexp

  根據正則表達式 regexp 反向生成可以匹配它的字符串

2.2 數據占位符定義規范 DPD

• 占位符只是在屬性值字符串中占個位置，并不出現在最終的屬性值中

• 占位符的格式為：

  @占位符
  @占位符(參數 [, 參數])

• 占位符引用的是 Mock.Random 中的方法

• 可以通過 Mock.Random.extend() 來擴展自定義占位符

• 占位符也可以引用數據模板中的屬性

• 占位符會優先引用數據模板中的屬性

• 占位符支持相對路徑和絕對路徑

  2.2.1 基本方法

• @string 字符串

• integer 整數

• date 日期

2.2.2 圖像方法

• @image 圖片

2.2.3 文本方法

• @title 標題

• @cword(100) 文本內容，參數為字數

2.2.4 名稱方法

• @cname 中文名稱

• @cfirst 中文姓氏

• @Last 英文姓氏

2.2.5 網絡方法

• @url url

• @email 郵箱

2.2.6 地址方法

• @region 區域方法

• @county 省市縣

3 EasyMock

3.1 什么是EasyMock？

Easy Mock 是杭州大搜車無線團隊出品的一個極其簡單、高效、可視化、并且能快速生成模擬數據的在線 mock 服務 。以項目管理的方式組織 Mock List，能幫助我們更好的管理 Mock 數據。

• 地址：https://www.easy-mock.com

• 在線文檔：https://www.easy-mock.com/docs

3.2 EasyMock基本入門

3.2.1 初始化操作

• 登陸或注冊

  

• 創建項目

3.2.2 接口操作

• 點擊項目，進入個人項目，對接口進行增刪改查