JavaScript 如何将rgb()颜色字符串转换为对象

给定一个以rgb()或rgba()形式表示的颜色，并且任务是将其转换为一个对象，其中键是颜色名称，值是颜色值。

示例：

Input:    rgb(242, 52, 110)
Output : {
   red: 242,
   green: 52,
   blue: 110
}

Input:    rgba(255, 99, 71, 0.5)
Output: {
  red: 255,
  green: 99,
  blue: 71,
  alpha: 0.5
}

过程： 为了实现这一目标，我们采用以下方法。

• 将颜色存储在名为rgb的变量中。
• 创建一个名为colors的数组，包含红色、绿色、蓝色和alpha的颜色名称。
• 创建一个变量colorArr，其中存储输入rgb的颜色值。例如: [“255”, “99”, “71”, 0.5], 我们使用 slice 从rgb字符串中截取出 “(“ 到 “)” 之间的部分。现在你得到了字符串 “255, 99, 71, 0.5”。 现在从 “, ” 处分割数组。现在你得到了数组 [“255″, ’99”, “71”, “0.5”]。
• 现在创建一个空对象。
• 对colorArr应用forEach循环，对于每次迭代，将颜色的名称和颜色的值插入对象中。
• 现在打印该对象。

<script> 
let rgb = "rgba(255, 99, 71, 0.5)"
  
let colors = ["red", "green", "blue", "alpha"] 
  
// Getting the index of "(" and ")"  
// by using the indexOf() method 
let colorArr = rgb.slice( 
    rgb.indexOf("(") + 1,  
    rgb.indexOf(")") 
).split(", "); 
  
let obj = new Object(); 
  
// Insert the values into obj 
colorArr.forEach((k, i) => { 
    obj[colors[i]] = k 
}) 
  
console.log(obj) 
</script> 

输出：

{
alpha: "0.5",
blue: "71",
green: "99",
red: "255"
}

将逻辑封装在一个函数中

<script> 
function rgbToObj(rgb) { 
  
    let colors = ["red", "green", "blue", "alpha"] 
  
    let colorArr = rgb.slice( 
        rgb.indexOf("(") + 1,  
        rgb.indexOf(")") 
    ).split(", "); 
  
    let obj = new Object(); 
  
    colorArr.forEach((k, i) => { 
        obj[colors[i]] = k 
    }) 
  
    return obj; 
} 
  
  
console.log(rgbToObj("rgb(255, 99, 71)")) 
console.log(rgbToObj("rgb(255, 99, 71, 0.5)")) 
</script>

输出：

{
blue: "71",
green: "99",
red: "255"
}

{
alpha: "0.5",
blue: "71",
green: "99",
red: "255"
}