将一字符串转化成驼峰方法

方法 1-常规split方法

如下代码所示

/*
 *
 * 将一个字符串转换为驼峰命名
 *
 * @function toHumpName
 * @param {String} str
 * @return {Array}
 *   1.功能函数的编写，函数的调用，传参
 *   2.js中的内置对象,切割:split(),切割完后得用一个变量给存储起来
 *   3.for循环的遍历,遍历查找
 *   4.找到对应的字符串,第0个转化为大写,转化为大写的函数,toUpperCase()在加上字符串的拼接，在进行截取(substring())
 *   5. 把字符串给拼接起来(join())
 *
 */
var str = 'border-top-color';
console.log(str); // border-top-color
function toHumpName(str) {
  var arr = str.split('-'); // spilt切割,border,top,color
  console.log(arr); // [border,top,color]
  for (var i = 1; i < arr.length; i++) {
    // 循环遍历数组
    arr[i] = arr[i].charAt(0).toUpperCase() + arr[i].substring(1);
    console.log(arr[i]); // [border,Top,Color]
  }
  return arr.join(''); // 字符串给加起来
}
console.log(toHumpName(str)); // borderTopColor

方式2-利用正则表达式

示例代码如下所示

var str = 'border-top-color';
function toHumpName(str) {
  var re = /-(\w)/g; // \w匹配所有的字母和数字字符以及下划线_
  return str.replace(re, function($0, $1) {
    // 第一个参数re表示正则,第二个回调函数,对该字符串处理方式,圆括号内的形参数表示正则表达式的子选项
    return $1.toUpperCase(); // 转大写
  });
}
console.log(toHumpName(str)); // borderTopColor

比较:常规方法比较容易想到,但正则表达式相对而言,不容易理解,但效率比较高