前端百题——开拓思路之三种方式实现字符串转驼峰

相信大家都遇到过这样一个问题:将’-'连接的字符串转换为驼峰形式,例如将hello-word转换为helloWorld。这个问题虽然简单,但是如果仅仅用一种方案进行解决不能体现 出自己的能力,如果要想表现的与众不同,就要用多种方式解决。下面就通过三种方式解决该问题。

22.1 方式一
首先来看看第一种方案,是在字符串维度进行操作,其思想可以归结为以下几个步骤:

按照’-'进行分割;
从第二个元素开始进行遍历,将每个元素的首字母变为大写的;
将数组中的元素进行连接
// 操作字符串数组
function transformStr2CamelCase1(str) {
if (typeof(str) !== ‘string’) {
return ‘’;
}

const strArr = str.split('-');
for (let i = 1; i < strArr.length; i++) {
    strArr[i] = strArr[i].charAt(0).toUpperCase() + strArr[i].substring(1);
}
return strArr.join('');

}

console.log(transformStr2CamelCase1(‘hello-world’)); // helloWorld
复制代码
22.2 方式二
第二种方案是在字符维度进行动刀,因为小写变大写的字符都是在’-‘后面的字符,所以在遇到’-'后将其变为大写,其步骤如下:

首先将字符串分割成字符数组;
遍历该数组,当遇到’-'元素,删除该元素;
将后慢的字符元素变为大写;
连接数组,返回结果。
// 操作字符数组
function transformStr2CamelCase2(str) {
if (typeof(str) !== ‘string’) {
return ‘’;
}

const strArr = str.split('');
for (let i = 0; i < strArr.length; i++) {
    if (strArr[i] === '-') {
        // 删除-
        strArr.splice(i, 1);
        // 将此处改为大写
        if (i < strArr.length) {
            strArr[i] = strArr[i].toUpperCase();
        }
    }
}

return strArr.join('');

}

console.log(transformStr2CamelCase2(‘hello-world’)); // helloWorld
复制代码
22.3 方式三
方式三则是利用正则的方式去匹配字符串中的内容,然后将匹配到的内容替换掉,其步骤如下:

确定对应的正则表达式;
利用replace方法,将对应的小写字符转换为大写。
// 利用正则
function transformStr2CamelCase3(str) {
if (typeof(str) !== ‘string’) {
return ‘’;
}

const reg = /-(\w)/g;

return str.replace(reg, function ($0, $1) {
    return $1.toUpperCase();
});

}

console.log(transformStr2CamelCase3(‘hello-world’)); // helloWorld
复制代码
1.如果觉得这篇文章还不错,来个分享、点赞吧,让更多的人也看到

如果你觉得这篇文章对你有点用的话,麻烦请给我们的开源项目点点star: http://github.crmeb.net/u/defu 不胜感激 !
来自 “开源世界 ” ,链接: https://ym.baisou.ltd/post/746.html ,如需转载,请注明出处,否则将追究法律责任。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

CRMEB定制开发

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值