前端学习之编程题系列：（五）颜色字符串转换本题目来自牛客网，已经成功通过测试。笔者刚刚开始学习前端，准备在掘金记录下自己

写在前面

本题目来自牛客网，已经成功通过测试。笔者刚刚开始学习前端，准备在掘金记录下自己的学习过程，欢迎和我一样准备入门前端的小伙伴们一起交流学习，也欢迎各位大佬批评指正~~~

题目描述

将 rgb 颜色字符串转换为十六进制的形式，如 rgb(255, 255, 255) 转为 #ffffff

rgb 中每个 , 后面的空格数量不固定
十六进制表达式使用六位小写字母
如果输入不符合 rgb 格式，返回原始输入

示例

输入

'rgb(255, 255, 255)'

输出

#ffffff

题解

function rgb2hex(sRGB) {
   let rgbArray = sRGB.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/)
   if(!rgbArray){
       return sRGB
   }else{
       let res = "#"
       //了解match匹配到的数组结构，这里i从1开始，不是0
       for(let i = 1; i <= 3; i++){
           let num = parseInt(rgbArray[i])
           if(num >= 0 && num <= 255){  
               //小于16时，前面要补零
               res += num < 16? "0" + num.toString(16) : num.toString(16)
           }else{
               return sRGB
           }
       }
       return res
   }  
}

知识点

正则表达式的匹配

stringObject.match(regexp) 方法返回的是一个数组，该数组的第 0 个元素存放的是匹配文本，而其余的元素存放的是与正则表达式的子表达式匹配的文本。

示例：

let sRGB = 'rgb(12,46,255)'
let sArray = sRGB.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/)
console.log(sArray);
//打印结果
Array(4)
0: "rgb(12,46,255)"
1: "12"
2: "46"
3: "255"
groups: undefined
index: 0
input: "rgb(12,46,255)"
length: 4
__proto__: Array(0)

数字和字符串之间的转换parseInt(string, radix)和NumberObject.toString(radix)
- radix默认是10，按照十进制进行解析
边界问题