玩转 Mockjs,前端也能跑的很溜

生成一个 min 到 max 之间的数值,num 用来指定类型

//使用

‘name|1-3’: 1

运行结果:生成一个 1-3 之间的数字。可能的结果有:1、2、3

生成带有小数点的数字。

‘name|min-max.dmin-dmax’: num

生成一个浮点数,整数部分介于 min 和 max 之间,小数保留 dmin 到 dmax 位。num 用来指定类型。

//使用

‘num1|1-10.1-2’: 1

运行结果:生成 1-10 之间的带有 1到 2 位小数的浮点数。如:2.1、3.12 等

‘num2|5.1-2’: 1

生成一个整数部分为 5 ,保留 1 到 2 位小数的浮点数。如:5.1、5.33、5.09 等

‘num3|5.2’: 1

生成整数为 5 ,保留两位小数的浮点数。如:5.11、5.67 等

1.3、属性值是 Boolean

‘name|1’: boolean

生成一个随机值,真 假 概率都是一半。

//使用

‘isLike|1’: true

生成 isLike 的值可能为 true 、false。概率是一样的。

‘name|min-max’: value

随机生成一个布尔值,

值为 value 的概率是 min / (min + max),

值为 !value 的概率是 max / (min + max)。

//使用

‘like|1-5’: true

生成 true 的 概率为 1/6 。生成 false 的概率为 5/6

1.4、属性值是对象 Object

生成一个指定属性个数的对象。

‘obj|num’: object

从属性值 object 中,随机选取 num 个属性。

//使用

‘obj|2’: {

a: ‘1’,

b: ‘2’,

c: ‘3’

}

运行结果可能为:

{a: “3”, b: “2”}

{c: “3”, b: “2”}

{a: “3”, c: “2”}

生成一个属性个数随机的对象。

‘obj|min-max’: object

从 object 中 随机选取 min 到 max 个属性,生成一个对象。

//使用

‘obj|1-2’: {

a: ‘1’,

b: ‘2’,

c: ‘3’

}

运行结果可能为:

{a: “3”}

{b: “3”}

{c: “3”}

{a: “3”, b: “2”}

{c: “3”, b: “2”}

{a: “3”, c: “2”}

1.5、属性值是数组 Array

取数组中某个元素作为结果。

‘arr|1’:array

从属性值 array 中随机选取 1 个元素作为结果返回

//使用

‘arr|1’:[1,2,3]

运行结果为:1、2、3 三种结果

生成新数组。

‘arr|min-max’: array

通过重复 array 的元素生成新数组,重复次数 min 到 max 。

//使用

‘arr|1-2’: [ 1,2,3 ]

运行结果为:[ 1,2,3 ] 或 [ 1,2,3,1,2,3 ]

‘arr|num’: array

通过重复 array 的元素生成新数组,重复次数 num 次 。

//使用

‘arr|2’: [ 1,2,3 ]

运行结果为: [ 1,2,3,1,2,3 ]

1.6、属性值是函数 Function

‘name’:function

function 返回值作为最终的属性值。

//使用

‘name’: ()=>{

return ‘web learn’

}

运行结果为 web learn

在数据占位符中,属性值是函数有重要的意义。待会会重点解释。

1.7、属性值是正则 RegExp

‘name’: regexp

根据正则表达式 regexp 反向生成可以匹配的字符串。用于生成自定义格式的字符串

//使用

‘reg’: /[a-zA-Z0-9]2/

生成大小写字母和数字任意组成的长度为 2 的字符串

‘reg’😕\d{5,10}/

生成任意的 5 到 10 位的数字字符串

二、数据占位符定义规范

===========

数据占位符只是在属性字符串中占个位置,并不会出现在最终的属性值中。

使用格式:

@占位符

@占位符(参数 [, 参数])

//使用

‘name’: “@name”,

生成英文名,如:Edward Rodriguez

//带有参数

‘first’:“@name(middle)”,

生成带有中间名的英文名 。如:Ruth Paul Robinson

‘name’: “@cname”,

生成中文名

注意:

  • 用 @ 来标识后边的字符串是标识符。

  • 占位符引用的都是 mock.Random 中的方法。

  • 如果需要扩展自定义占位符,可使用 Mock.Random.extend()。

  • 占位符也可以引用 “数据模板” 中的内容。

  • 占位符优先引用数据模板中的属性。

总结:

  • 函数式编程其实是一种编程思想,它追求更细的粒度,将应用拆分成一组组极小的单元函数,组合调用操作数据流;

  • 它提倡着 纯函数 / 函数复合 / 数据不可变, 谨慎对待函数内的 状态共享 / 依赖外部 / 副作用;

开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

Tips:

其实我们很难也不需要在面试过程中去完美地阐述出整套思想,这里也只是浅尝辄止,一些个人理解而已。博主也是初级小菜鸟,停留在表面而已,只求对大家能有所帮助,轻喷🤣;

我个人觉得: 这些编程范式之间,其实并不矛盾,各有各的 优劣势

理解和学习它们的理念与优势,合理地 设计融合,将优秀的软件编程思想用于提升我们应用;

所有设计思想,最终的目标一定是使我们的应用更加 解耦颗粒化、易拓展、易测试、高复用,开发更为高效和安全

  • 14
    点赞
  • 19
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值