RGBA和RGB到十六进制

时间:2018-06-16 18:41:58

标签: javascript

我正在尝试找到一种可以将RGB或RGBA字符串转换为十六进制格式的方法。我找到了解决方案,但没有找到方法1 =>之类的方法。 rgbToHex和RGBA rgbaToHex我想组合它们以便它可以返回RGB和RGBA的十六进制值

RGB方法:

    // convert RGB color data to hex
function rgb2hex(r, g, b) {
    if (r > 255 || g > 255 || b > 255)
        throw "Invalid color component";
    return ((r << 16) | (g << 8) | b).toString(16);
}

RGBA方法:

function rgba2hex(r, g, b, a) {
    if (r > 255 || g > 255 || b > 255 || a > 255)
        throw "Invalid color component";
    return (256 + r).toString(16).substr(1) +((1 << 24) + (g << 16) | (b << 8) | a).toString(16).substr(1);
}

我想要的是什么:

 //takes both RGB and RGBA and convert to HEX like  #000000
   // input will be string like this => rgb(0,0,0) or rgba(255,255,255, 0.5)
    function anyToHex() {
     return; // hex value
    }

我创建了我的解决方案,可以采取任何字符串rgb或rgba,然后返回一个十六进制值 这是我的意思:

function componentToHex(c) {
    var hex = c.toString(16);
    return hex.length == 1 ? "0" + hex : hex;
}
function anytoHEX(string) {

    rgb = string.substring(4, string.length-1).replace(/ /g, '').split(',');
    R = rgb[0].replace("(", "");
    G = rgb[1];
    B = rgb[2];

    return "#" + componentToHex(R) + componentToHex(G) + componentToHex(B);

}

console.log(anytoHEX('rgba(0,0,0,0)'));

2 个答案:

答案 0 :(得分:2)

在javascript中,所有函数参数都是可选的,因此如果省略一个,它将是undefined。所以,您可以查看类似

的内容
if (a === undefined) {
  // return rgb2hex
else {
  // return rgba2hex
}

注意,你不想在这里做if (a)因为0是a的有效值,但会导致错误并且只返回rgb。

答案 1 :(得分:1)

您可以将其设为包装器,并根据传递的参数调用该函数

 //takes both RGB and RGBA and convert to HEX like  #000000
   // input will be string like this => rgb(0,0,0) or rgba(255,255,255, 0.5)
    function anyToHex(r, g, b, a) {
      if(a === undefined){
         return rgb2hex(r, g, b);
      }
     return rgba2hex(r, g, b, a);
    }