颜色转换工具原理

一、16进制–>RGB

function colorConversion(color) {
    let arr = [];
    let l = 0;
    if (color.length === 7) {
      l = 2;
    }
    if (color.length === 4) {
      l = 1;
    }
    for (let i = 1; i < color.length; i += l) {
      if (color.length === 4) {
        arr.push(parseInt("0x" + (color.slice(i, i + l)) + color.slice(i, i + l)));
      }
      if (color.length === 7) {
        arr.push(parseInt("0x" + color.slice(i, i + l)));
      }
    }
    console.log('(' + arr.join(',') + ')');
}

原理：

• 16进制分为可缩写（#3388dd-->#38d）与不可缩写(#F34521)
• 井号后每两位代表一种颜色，分别是红，绿，蓝三种颜色，当他缩写的时候需要补齐
• 将截取下来的两位（一位补齐为两位），利用parseInt()以16为基数转为十进制数，即可获得RGB颜色值

二、RGB–>16进制

function colorConversion(color) {
    let arr = color.replace('(','').replace(')','').split(',');
    let str= '#';
    //rgb-->16进制
    for (let i = 0; i < arr.length; i++) {
      str += arr[i].toString(16);
    }
    console.log(str);
  }

原理：

• 先将rgb颜色进行拆分（rgb中的每一个数字代表的都是其中一种颜色所占比例）
• toString(radix) 方法可把一个 Number 对象转换为一个字符串，radix为基数，默认10，10进制
• 利用toString将十进制数转换为16进制数