字符串转换为驼峰格式

104 阅读 0 评论 69 点赞

我是靠谱客的博主会撒娇冬瓜，最近开发中收集的这篇文章主要介绍字符串转换为驼峰格式，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

描述：

css 中经常有类似font-size这种通过 - 连接的字符，通过 javascript 设置样式的时候需要将这种样式转换成fontSize驼峰格式，请完成此转换功能

1.以 - 为分隔符，将第二个起的非空单词首字母转为大写;

2.-who-are-you- 转换后的结果为 whoAreYou

输入：'who-are-you' 或 '-who-are-you' 或 '-who-are-you-' 
输出：'whoAreYou'

代码如下：

<script>
        // 输入：'font-size' 输出：fontSize


        function cssStyle2DomStyle(sName) {
            let str = "";
            // 通过-分割字符串，获得分割后的数组
            const arr = sName.split("-");

            // 如果数组第一位为空，则将其删除
            if (arr[0] === "") {
                arr.shift();
            }

            // 如果数组最后一位为空，则将其删除
            if (arr[arr.length - 1] == "") {
                arr.pop();
            }

            console.log(arr)

            for (let i = 0; i < arr.length; i++) {
                if (i === 0) {
                    str += arr[i];
                } else {
                    str += arr[i][0].toUpperCase() + arr[i].slice(1);
                }
            }
            return str;
        }

        console.log(cssStyle2DomStyle('-who-are-you-'))
    </script>

在这里插入图片描述

知识点：

split() 方法使用指定的分隔符字符串将一个String对象分割成子字符串数组，以一个指定的分割字串来决定每个拆分的位置。

 const arr = "a-b-c".split("-"); console.log(arr); // [ 'a', 'b', 'c']
 const arr = "-a-b-c-".split("-"); console.log(arr); // [ '','a', 'b', 'c','']

shift() 方法会删除数组的第一个元素并返回删除的这个元素，该方法会改变原数组。
toUpperCase() 方法将字符串转换成大写形式并返回。
slice(a,b) 方法截取字符串，从下标a截取到下标b（包括下标为a的元素不包括下标b的元素），如果不指定a代表从索引 0开始，不指定b则代表截取到最后（包含最后一个元素）。a为负值时则表示从原数组中的倒数第几个元素开始提取。