首页 > 试题广场 >

颜色字符串转换

[编程题]颜色字符串转换
  • 热度指数：33211 时间限制：C/C++ 2秒，其他语言4秒 空间限制：C/C++ 256M，其他语言512M
  • 算法知识视频讲解
将 rgb 颜色字符串转换为十六进制的形式，如 rgb(255, 255, 255) 转为 #ffffff
1. rgb 中每个 , 后面的空格数量不固定
2. 十六进制表达式使用六位小写字母
3. 如果输入不符合 rgb 格式，返回原始输入
示例1

输入

'rgb(255, 255, 255)'

输出

#ffffff
算法知识视频讲解
添加回答
HTML/CSS/JavaScript
书生不媚头像 书生不媚
function rgb2hex(sRGB) {
  const reg = /^rgb\(([0-2][0-5]?[0-5]?),(\s*[0-2][0-5]?[0-5]?),(\s*[0-2][0-5]?[0-5]?)\)$/
  const match = reg.exec(sRGB);
  if (match && match.length > 3) {
    const r = addZero(parseInt(match[1]).toString(16)),
      g = addZero(parseInt(match[2]).toString(16)),
      b = addZero(parseInt(match[3]).toString(16));
    return `#${r}${g}${b}`
  } else return sRGB;

  function addZero(n) {
    return parseInt(n, 16) > 15 ? n : '0' + n
  }
}
发表于 2023-06-29 14:18:27 回复(0)
HTML/CSS/JavaScript
牛客205160422号头像 牛客205160422号
    function rgb2hex(sRGB) {
     let n=sRGB.lastIndexOf(')')
     let str1=sRGB.substring(4,n)
     let r=parseInt(str1.split(',')[0])
     let g=parseInt(str1.split(',')[1])
     let b=parseInt(str1.split(',')[2])
     if(r>=0&r<=255&g>=0&g<=255&b>=0&b<=255){
     return '#'+(r<=9?'0'+r.toString(16):r.toString(16))+(g<=9?'0'+g.toString(16):g.toString(16))+(b<=9?'0'+b.toString(16):b.toString(16))
     }
     else {return sRGB}
  }
发表于 2023-06-28 10:30:02 回复(0)
HTML/CSS/JavaScript
小小螃蟹头像 小小螃蟹 
    function rgb2hex(sRGB) {
        // 判断是否合法
        const regex = /^rgb\(\s*\d{1,3}\s*,\s*\d{1,3}\s*,\s*\d{1,3}\s*\)$/i;
        const isValid = regex.test(sRGB);
        if (!isValid) {
          return sRGB;
        }
        // 提取数字
        const _regex = /\d+/g;
        const result = sRGB.match(_regex);
        const newResult = result.map((item) => {
          // 转化为16进制并补全
          const i = Number(item).toString(16);
          return i.length === 1 ? `0${i}` : i;
        });
        // 返回连接后的字符串
        return `#${newResult.join("")}`;
      }


发表于 2023-06-06 15:17:03 回复(0)
HTML/CSS/JavaScript
vc2头像 vc2 
            if (!/^rgb\((\d{1,3},\s*){2}\d{1,3}\)$/.test(sRGB)) return sRGB;
            let rgb = sRGB.slice(4,-1).split(",")
            for(i in rgb){
                rgb[i] = Number(rgb[i].trim()).toString(16)
                if(rgb[i]<10){
                    rgb[i] = '0'+rgb[i]
                }
            }
            return '#' + rgb.join("")
发表于 2022-11-17 22:23:36 回复(0)
HTML/CSS/JavaScript
矜持的微笑头像 矜持的微笑
function rgb2hex(sRGB) {
 let left=sRGB.indexOf('(')
 let right=sRGB.indexOf(')')
   let arr=sRGB.slice(left+1,right).replace(/\s*/g,'').split(',')
    if(arr.every(v=>v>=0&&v<=255)){
        arr=arr.map(item=>Number(item).toString(16)).map(v=>v.length===1?'0'+v:v
        )
    return '#'+arr.join('')
    }else{
        return sRGB
    }
 }
发表于 2022-09-25 09:12:06 回复(0)
HTML/CSS/JavaScript
337845818头像 337845818 
function rgb2hex(sRGB) {
    let a = sRGB.split('(')
    if (a.length != 2) {
        return sRGB
    }
    a = a[1].replace(')', '').split(',')
    for (let i = 0; i < a.length; i++) {
        a[i] = Number(a[i].trim()).toString(16)
        if (a[i] == 0) {
            a[i] = '00'
        }
    }
    return '#' + a.join('')
}

发表于 2022-08-01 22:17:55 回复(0)
HTML/CSS/JavaScript
路过的一名白的不能再白的小白头像 路过的一名白的不能再白的小白 
function rgb2hex(sRGB) {
    if(/rgb\((\d+)\, *(\d+)\, *(\d+)\)/.test(sRGB)){
        let arr = [RegExp.$1,RegExp.$2,RegExp.$3],str = '#'
        for (let i = 0; i < arr.length; i++) {
            if(arr[i]>255) return sRGB
            str += arr[i] === '0' ? '00' : Number.parseInt(arr[i]).toString(16)
        }
        return str
    }
    return sRGB
}

发表于 2022-07-11 13:57:42 回复(0)
HTML/CSS/JavaScript
牛客357988816号头像 牛客357988816号 
function rgb2hex(sRGB) {
    let reg=/rgb\((\d{1,3}),\s*(\d{1,3}),\s*(\d{1,3})\)/
    let result = reg.exec(sRGB)
    let to16 = (num)=>{
        let num16 = (num*1).toString(16)
        return num16.length==1?"0"+num16:num16
    }
        return result?`#${to16(RegExp.$1)}${to16(RegExp.$2)}${to16(RegExp.$3)}`:sRGB
}

发表于 2022-06-05 18:40:12 回复(0)
HTML/CSS/JavaScript
huaxifn头像 huaxifn 
function rgb2hex(sRGB) {
    if(/^rgb\(((\d{1,3})(,\s*)){2}(\d{1,3})\)$/.test(sRGB)){
        var str = '';
        var reg = /(\d+)/g;
        for(var i=0;i<3;i++){
            var el = parseInt(reg.exec(sRGB)[0]).toString(16);
            str += el.length==1?'0'+el:el;
        }
        return '#'+str;
    }else{
        return sRGB;
    }
}

发表于 2022-02-16 11:49:51 回复(0)
HTML/CSS/JavaScript
牛客687109802号头像 牛客687109802号
function rgb2hex(sRGB) {
    // 去除 sRGB 的空格
    const newSRGB = sRGB.replace(/\s+/g,"");
    // 定义 rbg 的正则表达式
    const exp = /rgb\((0|1\d{0,2}|2[0-5]{2}),(0|1\d{0,2}|2[0-5]{2}),(0|1\d{0,2}|2[0-5]{2})\)/;
    // 若不符合规则，则返回原字符串
    if (!exp.test(newSRGB)) return sRGB
    // 剔除 'rgb(' 和 ')', 剩下 'xx,xx,xx' 的字符串
    let color = '#'
    const rgbString = newSRGB.slice(4,-1).split(",").forEach(item => {
          const str = Number(item).toString(16)
          color += str.length === 2 ? str : `0${str}`
        })
     return color
}
发表于 2022-01-18 21:13:51 回复(0)
HTML/CSS/JavaScript
sirokuma2024头像 sirokuma2024
function rgb2hex(sRGB) {
    // rgb 格式
    const pattern = /^rgb\(\d{1,3},\s*\d{1,3},\s*\d{1,3}\)$/
    if (!pattern.test(sRGB.trim())) { return sRGB; }
    
    // rgb 数值大小
    const matches = sRGB.match(/\d{1,3}/g);
    const result = matches.some((item) => parseInt(item, 10) > 255);
    if (result) { return sRGB; }
    
    // 转换进制
    const arr = matches.map((item) => parseInt(item, 10).toString(16).padStart(2, "0"));
    return "#" + arr.join('');
}

这儿的JavaScript解释器似乎不支持padStart()方法 ？？？
发表于 2022-01-15 00:47:44 回复(0)
HTML/CSS/JavaScript
凯欣凯头像 凯欣凯
function rgb2hex(sRGB) {
      let reg = /rgb\(([0-2][0-5][0-5]),([0-2][0-5][0-5]),([0-2][0-5][0-5])\)/
      if (reg.test(sRGB.replaceAll(' ', ''))) {
        let strs = sRGB.replaceAll(' ', '').substring(4, sRGB.length - 1);
        let arrs = strs.split(',');
        let result = "#";
        arrs.map(item => {
          result += parseInt(item.trim(), 10).toString(16).toLowerCase()
        })
        return result
      } else {
        return sRGB;
      }
    }

代码放到页面上可以输出对应的结果，为啥提交老是出现错误？

发表于 2022-01-13 09:47:14 回复(0)
HTML/CSS/JavaScript
__sgf__头像 __sgf__ 
function rgb2hex(sRGB) {
    var value = sRGB.match(/\d{1,3}/g);
    console.log(value)
    if (!value) return sRGB;
    value.map((item, index) => value[index] = (Array(2).join(0) + (item - 0).toString(16)).slice(-2))
    return '#' + value.join('');
}

发表于 2022-01-07 15:34:03 回复(0)
HTML/CSS/JavaScript
牛客760559747号头像 牛客760559747号
function rgb2hex(sRGB) {
    let arr = sRGB.slice(sRGB.indexOf('(')+1,sRGB.indexOf(')')).split(",") //获取每个rgb编号
    if(arr.length!==3) return sRGB    //不符合rbg格式，返回原字符
    let result=['#'],base16=['a','b','c','d','e','f']
    for(let i=0;i<arr.length;i++){
        let str=[],yu
        while(arr[i]!==0){       //将rgb编号的10进制转换成16进制存入str
            yu=arr[i]%16
            str.unshift(yu)
            arr[i]=Math.floor(arr[i]/16)
        }
        if(str.length<2){   //不足2位则左补0
            for(let i=0;i<2-str.length;i++){
                str.unshift(0)
            }
        }
        while(str.length){
            if(str[0]<10){          //若该16进制小于10直接存入result
                result.push(str[0])
                str.shift()
            }else{
                result.push(base16[str[0]-10]) //该16进制大于等于10使用小写字母存入
                str.shift()
            }
        }     
    }
    return result.join("")
}
发表于 2022-01-05 20:15:51 回复(0)
HTML/CSS/JavaScript
浮白勿追忆头像 浮白勿追忆
function rgb2hex(sRGB) {
    sRGB = sRGB.replace(/\s+/g,'');
    let flag = /^rgb\((\d{1,3}),(\d{1,3}),(\d{1,3})\)$/.test(sRGB);
    if(!flag){
        return sRGB
    }
    let arr = sRGB.split('(')[1].split(')')[0].split(',')
    let arr2 = [];
    arr.forEach(v => {
        let str = Number(v).toString(16);
        if(str.length ===2){
            arr2.push(str)
        }else {
            arr2.push('0'+str)
        }
    })
    return '#'+ arr2.join('');
}
发表于 2021-10-08 23:16:04 回复(0)
HTML/CSS/JavaScript
stone201901172130920头像 stone201901172130920

  • String.prototype.match
  • RegExp.prototype.exec
  • String.prototype.replace
  • RegExp $

     
function rgb2hex(sRGB) {
  const reg = /^rgb\((\d{1,3}),\s*(\d{1,3}),\s*(\d{1,3})\)$/
  if (!reg.test(sRGB)) {
    return sRGB
  }

  // String.prototype.match
  return hexUseMatch(sRGB, reg)

  // RegExp.prototype.exec
  // return hexUseExec(sRGB, reg)

  // String.prototype.replace
  // return hexUseReplace(sRGB, reg)

  // RegExp $
  // return hexUseRegExp$()
}

function hexUseMatch(sRGB, reg) {
  const nums = sRGB.match(reg).slice(1)
  if (!nums.every(checkValidNumber)) {
    return sRGB
  }
  return combineHex(nums)
}

function hexUseExec(sRGB, reg) {
  const nums = reg.exec(sRGB).slice(1)
  if (!nums.every(checkValidNumber)) {
    return sRGB
  }
  return combineHex(nums)
}

function hexUseReplace(sRGB, reg) {
  return sRGB.replace(reg, ($1, $2, $3, $4) => {
    var nums = [$2, $3, $4]
    if (!nums.every(checkValidNumber)) {
      return sRGB
    }
    return combineHex(nums)
  })
}

function hexUseRegExp$() {
  var nums = [RegExp.$1, RegExp.$2, RegExp.$3]
  if (!nums.every(checkValidNumber)) {
    return sRGB
  }
  return combineHex(nums)
}

function combineHex(nums) {
  return nums.reduce((acc, num) => {
    return acc + num2Hex(num)
  }, '#')
}

function checkValidNumber(num) {
  // not float number
  if (/\./.test(num)) {
    return false
  }
  // 0-255
  return num >= 0 && num <= 255
}

function num2Hex(num) {
  if (typeof num !== 'number') {
    num = Number(num)
  }
  const hex = num.toString(16)
  return hex.length < 2 ? `0${hex}` : hex
}


发表于 2021-08-27 15:41:51 回复(0)
提交观点

问题信息

Javascript
难度：
27条回答 14730浏览

热门推荐

通过挑战的用户

查看代码

相关试题

颜色字符串转换

扫一扫，把题目装进口袋

求职之前，先上牛客

扫描二维码，进入QQ群

扫描二维码，关注牛客公众号