十六进制字符串到 RGB 数组 JS - JavaScript

在前端开发中，我们常常需要将颜色的十六进制字符串转换为 RGB 数组，以便于操作和处理。在 JavaScript 中，我们可以使用一些简单的方法来实现这个转换。

十六进制字符串转 RGB 数组

以下是将十六进制字符串转换为 RGB 数组的方法：

function hexToRgb(hex) {
  const bigint = parseInt(hex, 16);
  const r = (bigint >> 16) & 255;
  const g = (bigint >> 8) & 255;
  const b = bigint & 255;
  return [r, g, b];
}

该方法将所传入的十六进制字符串转换为大整数类型，然后通过位运算来分别提取出 R、G、B 三个颜色分量的值，最后将其存入数组并返回。

示例

以下是一个具体的示例演示了如何将 '#FF0000'（红色）转换成 RGB 数组：

const color = '#FF0000';
const rgbArray = hexToRgb(color); // [255, 0, 0]

总结

以上就是将十六进制字符串转换为 RGB 数组的方法。通过该方法，我们可以将颜色数据灵活地传递和操作，方便与 CSS 样式或其他的颜色处理库进行集成，使得前端开发更加高效和便捷。

参考文献

• MDN - parseInt()
• MDN - Bitwise Operators