JS实现字符串转驼峰格式的方法


Posted in Javascript onDecember 16, 2016

本文实例讲述了JS实现字符串转驼峰格式的方法。分享给大家供大家参考,具体如下:

实现效果如:border-bottom-color =>borderBottomColor

传传统方法

分析:

1.转大写,需要用到字符串的toUpperCase()方法

2.去掉-,需要用到字符串方法split(),这样就转成数组了,但数组中的每一个元素依然是字符串,所以可以用循环的方法取到第一个后面的元素

3.取第一个后面的元素的第一个字符,需要用到字符串的charAt()方法

4.第一个字符后面的字符,可以通过字符串截取方法substring()获得,这时把两个拼接再赋回给原数组。即完成了转换

5.用join()方法把数组的逗号去掉,拼接成字符串

var str="border-bottom-color";
function tf(){
  var arr=str.split("-");
  for(var i=1;i<arr.length;i++){
    arr[i]=arr[i].charAt(0).toUpperCase()+arr[i].substring(1);
  }
  return arr.join("");
};
tf(str);

正则的方法

分析:

1.正则为-字符,即var re=/-\w/g;匹配到-字符

2.用正则的replace()方法替换这个规范为去掉-以及字符大写,通过回调函数第一个参数直接转大写

var str="border-bottom-color";
function tf(){
  var re=/-(\w)/g;
  str=str.replace(re,function($0,$1){
    return $1.toUpperCase();
  });
  alert(str)
};
tf(str);

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
网站页面自动跳转实现方法PHP、JSP(上)
Aug 01 Javascript
ExtJS 入门
Oct 29 Javascript
javascript将数组插入到另一个数组中的代码
Jan 10 Javascript
JS将所有对象s的属性复制给对象r(原生js+jquery)
Jan 25 Javascript
js处理表格对table进行修饰
May 26 Javascript
jQuery实现监控页面所有ajax请求的方法
Dec 10 Javascript
利用vue写todolist单页应用
Dec 15 Javascript
JSONP跨域请求
Mar 02 Javascript
微信小程序将字符串生成二维码图片的操作方法
Jul 17 Javascript
原生JS实现自定义下拉单选选择框功能
Oct 12 Javascript
js实现上下左右键盘控制div移动
Jan 16 Javascript
Vue.js获取手机系统型号、版本、浏览器类型的示例代码
May 10 Javascript
详解js数组的完全随机排列算法
Dec 16 #Javascript
JS返回只包含数字类型的数组实例分析
Dec 16 #Javascript
基于Vue如何封装分页组件
Dec 16 #Javascript
使用ionic切换页面卡顿的解决方法
Dec 16 #Javascript
详解如何较好的使用js
Dec 16 #Javascript
JS作用域闭包、预解释和this关键字综合实例解析
Dec 16 #Javascript
详解js的事件处理函数和动态创建html标记方法
Dec 16 #Javascript
You might like
将OICQ数据转成MYSQL数据
2006/10/09 PHP
php+html5+ajax实现上传图片的方法
2016/05/14 PHP
Laravel6.0.4中将添加计划任务事件的方法步骤
2019/10/15 PHP
jqPlot Option配置对象详解
2009/07/25 Javascript
JavaScript 事件记录使用说明
2009/10/20 Javascript
JavaScript高级程序设计(第3版)学习笔记9 js函数(下)
2012/10/11 Javascript
基于NodeJS的前后端分离的思考与实践(三)轻量级的接口配置建模框架
2014/09/26 NodeJs
JavaScript常用的返回,自动跳转,刷新,关闭语句汇总
2015/01/13 Javascript
jQuery插件kinMaxShow扩展效果用法实例
2015/05/04 Javascript
js实现密码强度检测【附示例】
2016/03/30 Javascript
jQuery点击其他地方时菜单消失的实现方法
2016/04/22 Javascript
jquery 实现复选框的全选操作实例代码
2017/01/24 Javascript
Element-ui之ElScrollBar组件滚动条的使用方法
2018/09/14 Javascript
详解vuex状态管理模式
2018/11/01 Javascript
node app 打包工具pkg的具体使用
2019/01/17 Javascript
[01:03:41]DOTA2-DPC中国联赛 正赛 Dynasty vs XG BO3 第三场 2月2日
2021/03/11 DOTA
python实现的阳历转阴历(农历)算法
2014/04/25 Python
Python re模块介绍
2014/11/30 Python
简单掌握Python中glob模块查找文件路径的用法
2016/07/05 Python
使用python的turtle绘画滑稽脸实例
2019/11/21 Python
python统计字符串中字母出现次数代码实例
2020/03/02 Python
python批量处理多DNS多域名的nslookup解析实现
2020/06/28 Python
西班牙著名的珠宝首饰品牌:P D PAOLA
2018/09/15 全球购物
SmartBuyGlasses意大利:购买太阳镜、眼镜和隐形眼镜
2018/11/20 全球购物
杰夫·班克斯男士服装网上商店:Jeff Banks
2019/10/24 全球购物
StubHub中国:购买和出售全球活动门票
2020/01/01 全球购物
学生党员思想汇报
2013/12/28 职场文书
元旦晚会上单位领导演讲稿
2014/01/05 职场文书
司机检讨书
2014/02/13 职场文书
财务支持类个人的自我评价
2014/02/14 职场文书
班风学风建设方案
2014/05/06 职场文书
计算机售后服务承诺书
2014/05/30 职场文书
优秀小学生事迹材料
2014/12/26 职场文书
亮剑精神观后感
2015/06/05 职场文书
python可视化之颜色映射详解
2021/09/15 Python
在vue中import()语法不能传入变量的问题及解决
2022/04/01 Vue.js