js工具函数
toFixed 精度高的用法
1 | function round(number, precision) { |
switch实现
数组+索引
1
2
3function previewWeek(i) {
return i > 0 && i < 8 ? '星期'+['一','二','三','四','五','六','日'][i-1] : '';
}map
1
2
3
4
5
6
7
8
9
10
11
12function previewWeek(i){
let weeksMap = new Map([
[1, '一'],
[2, '二'],
[3, '三'],
[4, '四'],
[5, '五'],
[6, '六'],
[7, '日']
]);
return weeksMap.get(i) ? '星期'+weeksMap.get(i) : '';
}
过滤数组中的false
1 | let arr = [1, 0, undefined, null, false]; |
创建一个纯净的空对象
1 | let dict = Object.create(null); |
合并对象
1 | const page = { |
解构赋值使用别名
1 | const obj = { x: 1 }; |
数组map方法，抽离数组对象中的某个属性
1 | const cities = [ |
有条件的对象属性
- 根据一个条件创建两个不同的对象，可以使用展开运算符号来处理
1
2
3
4
5
6
7
8
9
10
11const getUser = (emailIncluded) => {
return {
name: 'John',
surname: 'Doe',
...emailIncluded && { email : 'john@doe.com' }
}
}
const user = getUser(true);
console.log(user); // outputs { name: "John", surname: "Doe", email: "john@doe.com" }
const userWithoutEmail = getUser(false);
console.log(userWithoutEmail); // outputs { name: "John", surname: "Doe" }
公用的正则表达式
国内座机号码（0341-86091234）
1
let reg = /\d{3}-\d{8}|\d{4}-\d{7}/;
中文型姓名
1
let reg = /^([\u4e00-\u9fa5·]{2,10})$/;
车牌号
1
2
3
4
5
6// 新能源车牌号
let reg = /[京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领 A-Z]{1}[A-HJ-NP-Z]{1}(([0-9]{5}[DF])|([DF][A-HJ-NP-Z0-9][0-9]{4}))$/;
// 非新能源车牌号
let reg = /^[京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领 A-Z]{1}[A-HJ-NP-Z]{1}[A-Z0-9]{4}[A-Z0-9挂学警港澳]{1}$/;
// 新能源车牌号+非新能源车牌号
let reg = /^([京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领 A-Z]{1}[A-HJ-NP-Z]{1}(([0-9]{5}[DF])|([DF]([A-HJ-NP-Z0-9])[0-9]{4})))|([京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领 A-Z]{1}[A-Z]{1}[A-HJ-NP-Z0-9]{4}[A-HJ-NP-Z0-9 挂学警港澳]{1})$/;手机号校验
1
2
3
4
5
6
7// 手机号严谨
let reg = /^1((3[\d])|(4[5,6,7,9])|(5[0-3,5-9])|(6[5-7])|(7[0-8])|(8[\d])|(9[1,8,9]))\d{8}$/;
// 手机号宽松
let reg = /^1[3-9]\d{9}$/;
或者 let reg = /^1[3456789]\d{9}$/;
// 手机号（最简单的11位校验）
let reg = /^1\d{10}$/;email地址
1
let reg = /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/;
身份证
1
2
3
4
5
6// 一代身份证(15位数)
let reg = /^\d{8}(0\d|11|12)([0-2]\d|30|31)\d{3}$/;
// 二代身份证(18位数)
let reg = /^\d{6}(18|19|20)\d{2}(0\d|11|12)([0-2]\d|30|31)\d{3}(\d|X|x)$/;
// 一代身份证+二代身份证
let reg = /(^\d{8}(0\d|11|12)([0-2]\d|30|31)\d{3}$)|(^\d{6}(18|19|20)\d{2}(0\d|11|12)([0-2]\d|30|31)\d{3}(\d|X|x)$)/;
年月日格式替换
1 | filterDate(date) { |
js简单粗暴截断数组
1 | let array = [0, 1, 2, 3, 4, 5]; |
随机排列数组中的元素
1 | let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9]; |
展平多维数组
1 | let entries = [1, [2, 5], [6, 7], 9]; |
提取唯一值
1 | let entries = [1, 2, 2, 3, 4, 5, 6, 6, 7, 7, 8, 4, 2, 1]; |
动态属性名称
1 | const dynamic = 'flavour'; |
手机号码脱敏显示 前三位和后三位
1 | secretPhone(phone) { |
数组乱序
1 | const shuffleArray = (arr) => arr.sort(() => Math.random() - 0.5) |
滚动到顶部、滚动到底部
- “smooth “来实现平滑的滚动动画
- 如scrollToTop方法，scrollToBottom方法
1
2
3
4
5
6
7const scrollToTop = (element) => {
element.scrollIntoView({ behavior: "smooth", block: "start" })
}
const scrollToBottom = (element) => {
element.scrollIntoView({ behavior: "smooth", block: "end" })
}
生成随机颜色
1 | const generateRandomHexColor = () => { |