Question

我有一个像这样的十六进制颜色数组：

var hexColors = [
    "#ffffff",
    "#ffffff",
    "#ffffff",
    "#f3f3f3",
    "#f3f3f3",
    "#f3f3f3"];

我想把它变成这个：

var rgbColors = new Array(
[62,35,255],
[60,255,60],
[255,35,98],
[45,175,230],
[255,0,255],
[255,128,0]);

使用此功能：

 function hexToRgb(hex) {
 var shorthandRegex = /^#?([a-f\d])([a-f\d])([a-f\d])$/i;
 hex = hex.replace(shorthandRegex, function(m, r, g, b) {
    return r + r + g + g + b + b;
 });
 var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
 return result ? {
    r: parseInt(result[1], 16),
    g: parseInt(result[2], 16),
    b: parseInt(result[3], 16)
 } : null;
}

我该怎么办？谢谢！

Answer 1

你过分复杂了：没有必要用regex 两次来运行目标字符串。它足以在第一次迭代中提取所有信息。像这样：

function hexToRgb(hex) {
  var res = hex.match(/[a-f0-9]{2}/gi);
  return res && res.length === 3
    ? res.map(function(v) { return parseInt(v, 16) })
    : null;
}

该功能已准备好在另一个.map中使用，可提供您想要的结果。

var hexColors = [
    "#ffffff",
    "#ffffff",
    "#ffffff",
    "#f3f3f3",
    "#f3f3f3",
    "#f3f3f3"
];
var rgbColors = hexColors.map(hexToRgb);

Demo

Answer 2

var hex = 'ffaadd';   
var rgb = parseInt(hex, 16);    

var red   = (rgb >> 16) & 0xFF;   
var green = (rgb >> 8) & 0xFF;     
var blue  = rgb & 0xFF;

位操作员在效率和可读性方面使其更加智能化。

将数组十六进制颜色转换为数组rgb颜色

2 个答案: