目前在做个人网站，写了一半没有数据填充，也不知道写什么，顺便学习一下mockjs。官网上主要介绍的是它可以随机生成各种类型的Data，拦截ajax请求等优点。接下来，让我们近距离的完成mockjs吧！1.安装通过npm为自己的项目安装mockjs。npminstallmockjs安装好后，使用mockjs：constMock\=require('mockjs')letdata\=Mock.mock({'list|10':\[{'id|+1':1}\]})不用管里面的语法，这是一个对象数组，里面的每个元素都是一个对象，每个对象的key是从0-9，value是一个对象，对象中的key是id，value它是1-10。这里只介绍commonjs中的用法。其实es6的模块导入方式也可以，不过babel最后转义的也是通过require引入的。关于import和require的区别，建议看这篇文章2.语法规范mockjs的语法规范包括两部分：1\.数据模板定义规范2\.数据占位符定义规范数据模板定义规范数据模板中的属性定义由三部分组成：属性名、生成规则、属性值//属性名name//生成规则rule//属性值value'name|rule'：价值通知：1\。使用|分隔属性名称和生成规则。2\.生成规则可选3\.生成规则有7种格式：(1)'name|min-max':value(2)'name|count':value(3)'name|min-max.dmin-dmax':值(4)'name|min-max.dcount':值(5)'name|count.dmin-dmax':值(6)'name|count.dcount':值(7)'名称|+步骤'：值4\。生成规则的含义取决于属性的值类型来确定。5\。属性值可以包含'@placeholder'6\。属性值还指定了初始值和最终值的类型。(1)属性值为字符串String1\。name|min-max:string通过重复string生成一个字符串，重复次数大于等于min且小于等于max。这里的重复是指初始化字符串的重复次数。2\.name|count:string通过重复string生成一个字符串，重复次数等于count。(2)属性值为Number1。name|+1:number属性值自动加1，初始值为number2.name|min\-max:number生成一个大于等于min小于等于max的整数。3.name|min\-max.dmin\-dmax:number生成一个浮点数，整数部分大于等于min，小于等于max，小数部分保留dmin到dmax位数。Mock.mock({'number1|1-100.1-10':1,'number2|123.1-10':1,'number3|123.3':1,'number4|123.10':1.123})//=>{"number1":12.92,"number2":123.51,"number3":123.777,"number4":123.1231091814}(3)属性值为布尔型Boolean1。name|1:boolean随机生成一个布尔值，该值为真的概率为1/2，为假的概率为1/2。2.name|min\-max:value随机生成一个布尔值，为value的概率为min/(min+max)，为!value的概率为max/(min+max)。(4)属性值为对象Object1。name|count:object从属性值对象中随机选择count个属性2.name|min\-max:object从属性值对象中随机选择min到max属性(5)属性值为数组Array1。name|1:array从属性值数组中随机选择一个元素作为最终值2.name|+1:array依次从属性值数组中选择一个元素作为最终值3.name|min\-max:array通过重复属性值数组生成新数组，重复次数大于等于min且小于等于max。4.name|count:array通过重复属性值数组生成新数组，并计算重复次数。(6)属性值为函数Function'name':function执行function函数，将其返回值作为最终的属性值，函数的上下文为属性'name'所在的对象。(7)属性值为正则表达式RegExp1\。name:regexp根据正则表达式regexp，反向生成一个能匹配到它的字符串。用于生成自定义格式的字符串。Mock.mock({'regexp1':/\[a-z\]\[A-Z\]\[0-9\]/,'regexp2':/\\w\\W\\s\\S\\d\\D/,'regexp3':/\\d{5,10}/})//=>{"regexp1":"pJ7","regexp2":"F)\\fp1G","regexp3":"561659409"}数据占位符定义规范DPD占位符只在属性值字符串中占据一个位置，不会出现在最终的属性值中。占位符格式：@placeholder@placeholder(参数\[,参数\])注意：1\.使用@来标识后面的字符串是一个占位符。2\.占位符是指Mock.Random中的方法。3\.通过Mock.Random.extend()扩展自定义占位符。4\。占位符也可以引用数据模板中的属性。5\。占位符将限制对数据模板中属性的引用。6\。占位符支持相对路径和绝对路径。3.Mock.mock()Mock.mock(rurl?,rtype?,template|function(options))根据数据模板生成mock数据Mock.mock(template)根据数据模板生成mock数据。Mock.mock(rurl,template)记录数据模板。当拦截到匹配rurl的ajax请求时，根据数据模板生成mock数据，作为响应数据返回。Mock.mock(rurl,function(options))记录用于生成响应数据的函数。当拦截到匹配rurl的ajax请求时，执行function函数，并将执行结果作为响应数据返回。Mock.mock(rurl,rtype,template)记录数据模板。当拦截到匹配rurl和rtype的ajax请求时，会根据数据模板生成mock数据，作为响应数据返回。Mock.mock(rurl,rtype,function(options))记录用于生成响应数据的函数。当拦截到匹配rurl和rtype的ajax请求时，将执行function函数（options），并将执行结果作为响应数据返回。rurl标识需要拦截的url，可以是url字符串，也可以是常规url：/\\/domain\\/list\\.json/,'/domian/list.json'。rtype是可选的，用于标识需要拦截的ajax请求的类型。例如GET、POST、PUT、DELETE等。template是可选的，标识数据模板，可以是对象也可以是字符串。function(options)是可选的，表示用于生成响应数据的函数。options指向本次请求的ajax选项集，包括三个属性：url、type和body。4.Mock.setup()Mock.setup(setting)配置拦截ajax请求时的行为。支持的配置项有：timeout。setting必填，配置项settimeout可选，拦截ajax请求的响应时间，单位毫秒，取值可以为正整数。例如400表示400ms后返回响应内容；也可以是200-600，表示响应时间在200到600毫秒之间，默认是10-100.Mock.setup({timeout:400})Mock.setup({timeout:'200-600'})Mock.setup(settings)接口目前只用于配置Ajax请求，未来可能用于配置Mock的其他行为。5、Mock.RandomMock.Random是生成各种随机数据的工具类。Mock.Random的方法在数据模板中称为占位符，书写格式为'@placeholder(parameter,[,parameter])'varRandom=Mock.RandomRandom.email()//=>"n.clark@miller.io"Mock.mock('@email')//=>"y.lee@lewis.org"Mock.mock({email:'@email'})//=>{email:"v.lewis@hall.gov"}扩展的Mock.Random中的方法与数据模板的“@占位符”一一对应。必要的时候，也可以对Mock.Random方法进行扩展，然后在数据模板中通过'@'扩展方法'Quote:Random.extend({constellation:function(date){varconstellations=\['Aries','金牛座','双子座','巨蟹座','狮子座','处女座','天秤座','天蝎座','射手座','摩羯座','水瓶座','双鱼座'\]returnthis.pick(星座)}})Random.constellation()//=>"Aquarius"Mock.mock('@CONSTELLATION')//=>"Scorpio"Mock.mock({constellation:'@CONSTELLATION'})//=>{星座：“射手座”还有一些其他的生成随机数据的方法，大家可以直接去官网看看，这里就不一一描述了。地址：https://github.com/nuysoft/Mo...6.Mock.valid()Mock.valid(template,data)验证真实数据数据是否与数据模板模板匹配。template必填，表示数据模板，可以是对象或字符串"{'list|1-10':[{}]},'@EMAIL'"data必填，表示真实数据。vartemplate={name:'value1'}vardata={name:'value2'}Mock.valid(template,data)//=>\[{"path":\["data","name"\],"type":"value","actual":"value2","expected":"value1","action":"equalto","message":"\[VALUE\]ExpectROOT.name'value等于value1，但等于value2"}\]7。Mock.toJSONSchema()Mock.toJSONSchema(template)将Mock.js风格的数据模板模板转换为JSONSchematemplate必选，代表数据模板，可以是对象也可以是字符串。关于mock.js的介绍就这么多了。这些基本都是官方文档的节选，但是基本够我们日常使用了。官方：http://mockjs.com/
