rgb颜色与16进制颜色相互转化函数-javascript

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/momDIY/article/details/80954424

rgb颜色转化为16进制颜色

• 传入rgb颜色(数组类型)，将会得到16进制颜色的字符串
• 当传入的数值不符合规范，将会返回字符串Invalid data

/**
 * @param rgb []
 * @returns {string}
 *
 * eg.
 * input: [220,20,60]
 * output:  #dc143c
 */
const convertRGBToHex = (...rgb) => {
  if (rgb.length !== 3 || rgb.some(i => i < 0 || i > 255)) return 'Invalid data'
  const [r, j, b] = rgb
  return '#' + r.toString(16) + j.toString(16) + b.toString(16)
}

convertRGBToHex(220,20,60)      //#dc143c

16进制颜色转换为rgb颜色

• 输入为16进制颜色（支持格式如下：#fff、#ffb437或ffb437）
• 返回值为长度为3的数组
• 当传入数值不合法，将会返回字符串Invalid data

/**
 * @param rgb String
 * @returns {*[]}
 *
 * eg.
 * input: "#ffb437" or "ffb437"
 * output:  [255, 180, 55]
 */
const convertHexToRGB = str => {
  str = str[0] === '#' ? str.slice(1) : str
  str = str.length === 3 ? str.repeat(2) : str
  console.log(str)
  if ((str.length !== 6) || !(/^[0-9a-fA-F]{3,6}$/i.test(str))) return 'Invalid data'
  return [parseInt(str[0] + str[1], 16), parseInt(str[2] + str[3], 16), parseInt(str[4] + str[5], 16)]
}

console.log(convertHexToRGB('#ffb437'))     //[255, 180, 55]

END