正则表达式实用案例解析
数字千分位格式化
金额显示常需添加分隔符提升可读性,正则表达式可实现高效格式化:
function addNumberSeparator(numStr) {
const separatorPattern = new RegExp(`(\\d)(?=(\\d{3})+${numStr.includes('.') ? '\\.' : '$'})`, 'g')
return numStr.replace(separatorPattern, '$1,')
}
console.log(addNumberSeparator('123456789')) // '123,456,789'
console.log(addNumberSeparator('123456789.123')) // '123,456,789.123'
URL参数提取
正则表达式能快速解析URL中的查询参数:
function fetchQueryParam(paramName) {
const pattern = new RegExp(`[?&]${paramName}=([^]*)`)
const result = location.href.match(pattern)
return result ? decodeURIComponent(result[1]) : null
}
// 示例URL: https://example.com/page?user=alice&id=123
console.log(fetchQueryParam('user')) // 'alice'
字符串驼峰化处理
function convertToCamelCase(input) {
const regex = /[_\-\s]+(.)?/g
return input.replace(regex, (_, char) =>
char ? char.toUpperCase() : ''
)
}
console.log(convertToCamelCase('user_name')) // 'userName'
首字母大写转换
function capitalizeInitials(text) {
return text.toLowerCase().replace(/\b\w/g,
match => match.toUpperCase()
)
}
console.log(capitalizeInitials('hello world')) // 'Hello World'
空白字符清理
function trimSpaces(input) {
return input.replace(/^\s+|\s+$/g, '')
}
console.log(trimSpaces(' text ').length) // 4
HTML特殊字符转义
function escapeHTML(content) {
const charMap = { '<': 'lt', '>': 'gt', '&': 'amp' }
return content.replace(/[<>&]/g,
char => `&${charMap[char]};`
)
}
console.log(escapeHTML('<div>')) // '<div>'
时间格式验证
const timeValidator = /^(2[0-3]|[01]?\d):[0-5]\d$/
console.log(timeValidator.test('23:59')) // true
日期格式校验
const datePattern = /^\d{4}([-/.])(0\d|1[0-2])\1(0\d|[12]\d|3[01])$/
console.log(datePattern.test('2023/12/31')) // true
十六进制颜色值匹配
const colorFinder = /#([a-f\d]{3}){1,2}\b/gi
console.log('#a1b ff0'.match(colorFinder)) // ['#a1b', '#ff0']
协议类型检测
const protocolCheck = /^https?:\/\//
console.log(protocolCheck.test('http://domain.com')) // true
版本号验证
const versionFormat = /^\d+(\.\d+){2}$/
console.log(versionFormat.test('2.18.0')) // true
电话号码格式化
function formatPhone(number) {
return number.replace(/(\d{3})(?=\d{4})/g, '$1-')
}
console.log(formatPhone('13987654321')) // '139-8765-4321'