将数组十六进制颜色转换为数组 rgb 颜色 [重复]答案

【问题标题】：turn array hex colors into array rgb colors [duplicate]将数组十六进制颜色转换为数组 rgb 颜色 [重复]
【发布时间】：2014-11-07 23:45:15
【问题描述】：

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

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;
}

我该怎么办？谢谢！

【问题讨论】：

标签： javascript jquery arrays foreach each

【解决方案1】：

您过于复杂了：没有必要使用正则表达式两次遍历目标字符串。在第一次迭代中提取所有信息就足够了。像这样：

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

【讨论】：

天哪！我还有很多东西要学习和学习！它完美地工作！非常感谢！
你会如何改变这个函数来做相反的事情？将 rgb 数组即 [255, 255, 255] 更改为 #FFFFFF

【解决方案2】：

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

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

Bit Operator 在效率和可读性方面让它变得更加聪明。

【讨论】：