使用js将驼峰命名法与-命名的切换

将-转为驼峰

一、传统方法

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);

将驼峰转换为-

代码展示：

var name = 'helloWord'
//封装成函数
function getKebabCase(str){
    var arr=str.split('')
    //使用循环遍历字符串
    str=arr.map(function(item){
        if(item.toUpperCase()===item){
        //使用toUpperCase()方法检测当前字符是否为大写
            return '-'+item.toLowerCase();
            //大写就在前面加上-，并用toLowerCase()将当前字符转为小写
        }else{
            return item;
        }
    })
    return str.join( '' )

}

console.log(getKebabCase(name))
// hello-word