Question

我已经创建了一个将hex转换为rgb的相当丑陋的功能，我真的不喜欢我使用.forEach的方式以及在之前定义空数组的需要迭代。

我觉得应该有更好的办法来做我不知道的事情吗？我已经尝试了.reduce，map和其他一些人，但我需要返回一个新数组并将其推送给其他所有角色。

const rgba = (hex, alpha) => {
  const pairs = [...hex.slice(1, hex.length)];
  const rgb = [];
  pairs.forEach((char, index) => {
    if (index % 2 !== 0) return;
    const pair = `${char}${pairs[index + 1]}`;
    rgb.push(parseInt(pair, 16));
  });

  return `rgba(${rgb.join(', ')}, ${alpha})`;
};

Answer 1

这是一个简单的解决方案，根本没有任何循环：

const rgba = (hex, alpha) => {
    let clr = parseInt(hex.slice(1), 16),
        rgb = [
            (clr >> 16) & 0xFF,
            (clr >>  8) & 0xFF,
            (clr >>  0) & 0xFF
        ];
  return `rgba(${rgb.join(', ')}, ${alpha})`;
};

如果您的问题更多是关于如何组织“成对”循环，您可以使用类似于python's itertools.groupby的函数：

let groupBy = function*(iter, fn) {
    let group = null,
        n = 0,
        last = {};

    for (let x of iter) {
        let key = fn(x, n++);

        if (key === last) {
            group.push(x);
        } else {
            if (group)
                yield group;
            group = [x];
        }

        last = key;
    }

    yield group;
};

一旦完成，其余的都是微不足道的：

const rgba = (hex, alpha) => {
    let pairs = [...groupBy(hex.slice(1), (_, n) => n >> 1)]
    let rgb = pairs.map(x => parseInt(x.join(''), 16));
    return `rgba(${rgb.join(', ')}, ${alpha})`;
};

Answer 2

也许你可以这样做;

function hex2rgb(h){
  return "rgb(" + [(h & 0xff0000) >> 16, (h & 0x00ff00) >> 8, h & 0x0000ff].reduce((p,c) => p+","+c) + ")";
}

console.log(hex2rgb(0xffffff));
console.log(hex2rgb(0x12abf0));
console.log(hex2rgb(0x000000));

使用迭代器将HEX转换为RGB - 比使用.forEach更好吗？

2 个答案: