时间戳

首页 > 解决方案 > JavaScript Array 删除数组中的开始引号和结束引号

javascript - JavaScript Array 删除数组中的开始引号和结束引号

问题描述

我正在尝试构建一个在数组中显示值、颜色、突出显示和标签的数组。

硬编码数组如下所示：

var data = [
    {
      value: 300,
      color:"#F7464A",
      highlight: "#FF5A5E",
      label: "Red"
    },
    {
      value: 50,
      color: "#46BFBD",
      highlight: "#5AD3D1",
      label: "Green"
    },
    {
      value: 100,
      color: "#FDB45C",
      highlight: "#FFC870",
      label: "Yellow"
    }
];

这是我的代码：

var pieData = [];
var label = [];
var beginData = "{";
var endData = "}";
var firstItem = "value:";
var secondItem = "color:";
var thirdItem = "highlight:";
var fourItem = "label:";
var spaceItem = ",";
var beginQuote = '"';
var endQuote =  '"';
var checkCounter = x.childElementCount -1;
var arrayColor = ["#F7464A", "#46BFBD", "#FDB45C", "#466abf", "#dc46f7", "#46bf8b", "#afbf46", "#bf8b46", "#bf5c46", "#b7bf46", "#46a9bf", "#bf4846" ];
var array = [     '#FF5A5E', '#5AD3D1', '#FFC870', '#466abf', '#dc46f7', '#46bf8b', '#afbf46', '#bf8b46', '#bf5c46', '#b7bf46', "#46a9bf", "#bf4846" ];
for( i = 0; i < x.childElementCount; i++) {
    name = x.childNodes[i].attributes.name.value;
    value = x.childNodes[i].attributes.value.value;
    array[i];
    arrayColor[i];
    if (checkCounter != i){
       pieData.push(beginData + firstItem + beginQuote + value + endQuote + spaceItem + secondItem + beginQuote + array[i] + endQuote + spaceItem + thirdItem + beginQuote + arrayColor[i]+ endQuote + spaceItem + fourItem + beginQuote + name + endQuote +  endData + spaceItem);
    }
     else{
        pieData.push(beginData + firstItem + beginQuote + value + endQuote + spaceItem + secondItem + beginQuote + array[i] + endQuote + spaceItem + thirdItem + beginQuote + arrayColor[i]+ endQuote + spaceItem + fourItem + beginQuote + name + endQuote +  endData);

                            }
  label.push(name);

我的输出是：

  0: "{value:"40",color:"#FF5A5E",highlight:"#F7464A",label:"Abnormal First Mam"},"
  1: "{value:"17",color:"#5AD3D1",highlight:"#46BFBD",label:"Abnormal Rescreen Mam"},"
  2: "{value:"57",color:"#FFC870",highlight:"#FDB45C",label:"Abnormal Total Mam"},"
  3: "{value:"5",color:"#466abf",highlight:"#466abf",label:"Abnormal CBE (Norm Mam)"},"
  4: "{value:"0",color:"#dc46f7",highlight:"#dc46f7",label:"Assessment Inc. Mam"},"
  5: "{value:"0",color:"#46bf8b",highlight:"#46bf8b",label:"Film Comp. req. Mam"}"

标签： javascriptarrays

解决方案

您的代码正在构建字符串，而不是对象。您应该使用对象文字语法在循环中构建对象。假设这x.childNodes是类似数组的，您可以使用以下代码：

var arrayColor = ["#F7464A", "#46BFBD", "#FDB45C", "#466abf", "#dc46f7", "#46bf8b", "#afbf46", "#bf8b46", "#bf5c46", "#b7bf46", "#46a9bf", "#bf4846" ];
var array = [     '#FF5A5E', '#5AD3D1', '#FFC870', '#466abf', '#dc46f7', '#46bf8b', '#afbf46', '#bf8b46', '#bf5c46', '#b7bf46', "#46a9bf", "#bf4846" ];

var pieData = Array.from(x.childNodes, ({attributes:{value, name}}, i) => ({
    value: value.value,
    color: arrayColor[i % arrayColor.length],
    highlight: array[i % array.length],
    label: name.value,
}));

console.log(pieData);

%用于避免您超出颜色数组的范围 - 以防数组中的条目childNodes多于您的条目。

Array.from非常适合将类似数组的对象（如childNodes）映射到具有派生数据的数组，这正是您正在做的事情。

推荐阅读