js 将 驼峰转为下划线

  开发的时候可能有这样一种需求: 对象 a

var a = {
	article: {
		title:'我家的猫'
		words: 800
	},
	author:{
		name:"小丽"
		age: 10
	}
}

对象b:

var b = {
	articleWords: 1000,
}

这时候需求来了, 我们要将 b 中的属性按key的意义设置到 a 中对应的地方. 有一种方式就是切割 b 中的key, 然后循环切割的结果, 最终将值设置到对应的地方. 然后, 正!题!来!了!
驼峰切割大法之 循环流:

/**
 * 切割驼峰
 * @param {string} camelStr
 * @return {string[]}
 */
function splitCamel(camelStr){
	var res = [];
    for(var i in str){
        var asc = str.charAt(i).charCodeAt();
        if(asc>=65 && asc<=90){
            res.push(' ');
            res.push(String.fromCharCode(asc+32));
        }
        else{
            res.push(str.charAt(i));
        }
    }
    return res.join('').trim().split(' ');
}

也可以使用函数式编程:

function splitCamel2(str){
    return str.split('').map(function(c){
        var asc = c.charCodeAt();
        return asc>=65 && asc<=90?' '+String.fromCharCode(asc+32):c;
    }).join('').trim().split(' ');
}

原理相同
除了循环大法外, 我们还可以使用正则表达式来实现, 下面有请我们的主角 replace 登场~

function splitCamel3(str){
	return str.replace(/([A-Z])/g,function(s){
		return ' '+s.toLowerCase();
	}).trim().split(' ');
}

这里注意一点, 正则式后面的 g 表示全局匹配, 如果不加的话, 只会匹配一次.
测试结果

看到这里不知道大家 对标题所述有什么想法呢?这里列举了几个小李子供大家参考

/**
 * 将驼峰转为下划线
 */
function camelToUnderline(camelStr){
	return camelStr.replace(/[A-Z]/g,function(s){
		return ' '+s.toLowerCase();
	}).trim().replaceAll(' ','_');
}

/**
 * 下划线转小驼峰
 */
function underlineToSmallCamel(str){
	return str.toLowerCase().replace(/_([a-z])/g,function(s, s1){
		return s1.toUpperCase();
	})
}

/**
 * 华氏温度(32℉) 转化为摄氏温度(0℃)
 */
function f2c(s) {
　　return s.replace(/(\d+(\.\d*)?)℉/g, function($0,$1,$2) {
　　    return (($1-32) * 5/9) + '℃';
　　});
}

/**
 * 小数格式化
 * 用于 oninput 事件
 * @param {Object} obj this
 * @param {number|function} [l] 小数位数
 * @param {number} [max] 最大值
 */
function decimalFormat(obj, l, max) {
    var precision = +l>=0?+l|0:typeof l==='function'?l():2;
    obj.value = (precision ? obj.value.replace(/[^\d.]/g, '') : obj.value.replace(/[^\d]/g, ''))
        .replace(/^\./g, '')
        .replace(/^0{2,}/, '0')
        .replace(/(^0*)([1-9])/, '$2')
        .replace(/\.{2,}/g, '.')
        .replace('.', '$#$').replace(/\./g, '').replace('$#$', '.')
        .replace(new RegExp('^(\\-)*(\\d+)\\.(\\d{0,' + precision + '}).*$'), '$1$2.$3');
    if(max&&+obj.value>+max){
        obj.value = max;
    }
}

/**
 * 月份中日期的输入, 最大28
 */
function monthDayInput(obj) {
    var regList = [
        {reg:/\D/g, str:''}
        , {reg:/^0+/, str:'0'}
        , {reg:/(^0+)([1-9])/, str:'$2'}
        , {reg:/(\d{2})(.+)/, str:'$1'}
        , {reg:/(^2)(9)/, str:'$1'}
        , {reg:/(^[3-9])(\d+)/, str:'$1'}
    ];
    var value = obj.value;
    for (var i = 0; i < regList.length; i++) {
        var it = regList[i];
        value = value.replace(it['reg'], it['str']);
    }
    obj.value = value;
}

/**
 * 电话号码输入
 * oninput事件
 * @param obj
 */
function mobileOnInput(obj) {
    var v = obj.value.substring(0,obj.selectionStart)
    var selection = ''
    if (v.length && !v.startWith('1')){
        obj.value = ''
        return
    }
    v = v.replace(/\D+/g,'')
    while (v&&/^1[0-2]\d*/.test(v)){
        v = v.replace(/^[03-9]\d+/,'1')
            .replace(/(^1)([0-2])(\d+)?/,'$1$3')
    }
    v = v.replace(/(\d{11})(\d+)/,'$1')
    if (v.length>1){
        selection = rdxNum(11-v.length)
    }
    obj.value = v+selection
    obj.selectionStart = v.length
    obj.selectionEnd = obj.value.length
}

function rdxNum(len) {
    var res = ''
    while(res.length<len){
        res += (Math.random()*10)|0
    }
    return res
}

当然, replace 还可以用在输入校验的 oninput 事件上, 效果也是出奇的好.
感觉有点虎头蛇尾了, 嘿嘿嘿