Mock.js

1 Mock.js 簡介

1.1 什么是 Mock.js？

Mock.js 是一款模擬數(shù)據(jù)生成器，旨在幫助前端攻城師獨(dú)立于后端進(jìn)行開發(fā)，幫助編寫單元測試。

1.2 Mock.js安裝

在 CMD 輸入如下命令：

cnpm?install?mockjs 

2 語法規(guī)范

Mock.js 的語法規(guī)范包括兩部分：

• 數(shù)據(jù)模板定義規(guī)范（Data Template Definition，DTD）

• 數(shù)據(jù)占位符定義規(guī)范（Data Placeholder Definition，DPD）

2.1 數(shù)據(jù)模板定義規(guī)范 DTD

• 數(shù)據(jù)模板中的每個屬性由 3 部分構(gòu)成：屬性名、生成規(guī)則、屬性值：'屬性名|生成規(guī)則' : value

• 生成規(guī)則有七種格式：

  • '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

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

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

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

2.1.1 屬性值是字符串 String

• 'name|min-max': string

  重復(fù) string 生成一個字符串，重復(fù)次數(shù)大于 min，小于 max

• 'name|count': string

  重復(fù) string 生成一個字符串，重復(fù) count 次

2.1.2 屬性值是數(shù)字 Number

• 'name|+1': number

  屬性值自動+1

• 'name|min-max': number

  生成一個介于 min-max 之間的整數(shù)

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

  生成一個整數(shù)部分介于 min-max 之間，小數(shù)部分保留 dmin-dmax 位的浮點(diǎn)數(shù)

2.1.3 屬性值是布爾 Boolean

• 'name|1': boolean

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

• 'name|min-max': value

  隨機(jī)生成一個布爾值，值為 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 屬性值是數(shù)組 Array

• 'name|1': array

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

• 'name|+1': array

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

• 'name|min-max': array

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

• 'name|count': array

  通過重復(fù) array 生成一個新數(shù)組，重復(fù)次數(shù)為 count 次

2.1.6 屬性值是函數(shù) Function

• 'name':function

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

2.1.7 屬性值是正則表達(dá)式 RegExp

• 'name': regexp

  根據(jù)正則表達(dá)式 regexp 反向生成可以匹配它的字符串

2.2 數(shù)據(jù)占位符定義規(guī)范 DPD

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

• 占位符的格式為：

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

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

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

• 占位符也可以引用數(shù)據(jù)模板中的屬性

• 占位符會優(yōu)先引用數(shù)據(jù)模板中的屬性

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

  2.2.1 基本方法

• @string 字符串

• integer 整數(shù)

• date 日期

2.2.2 圖像方法

• @image 圖片

2.2.3 文本方法

• @title 標(biāo)題

• @cword(100) 文本內(nèi)容，參數(shù)為字?jǐn)?shù)

2.2.4 名稱方法

• @cname 中文名稱

• @cfirst 中文姓氏

• @Last 英文姓氏

2.2.5 網(wǎng)絡(luò)方法

• @url url

• @email 郵箱

2.2.6 地址方法

• @region 區(qū)域方法

• @county 省市縣

3 EasyMock

3.1 什么是EasyMock？

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

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

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

3.2 EasyMock基本入門

3.2.1 初始化操作

• 登陸或注冊

  

• 創(chuàng)建項目

3.2.2 接口操作

• 點(diǎn)擊項目，進(jìn)入個人項目，對接口進(jìn)行增刪改查