在使用vue2中的 echarts组件时 我在渲染折线图时 其中一个属性是这样写的series: [ { name: "queueSize", type: "line", //bar:柱状 line:折线图 data: this.queueSize, color: "#00C5AB", // symbol: "circle", //折线点设置为实心点 symbolSize: 8, //折线点的大小 }, { name: "enqueueCount", type: "line", //bar:柱状 line:折线图 data: this.enqueueCount, color: "#00C5AB", // symbol: "circle", //折线点设置为实心点 symbolSize: 8, //折线点的大小 }, { name: "consumerCount", type: "line", data: this.consumerCount, color: "#3F53FF", symbolSize: 8, //折线点的大小 }, { name: "producerCount", type: "line", data: this.producerCount, color: "#8DF3E8", symbolSize: 8, //折线点的大小 }, ], 而事实上，这段代码中有相当一部分重复，变化的只是name属性和data属性，其它属性都可以不变，而当这个list很长时这样写就非常耗时且重复度高，有什么简洁的写法吗

可以将这个数组抽离成一个变量，然后通过数组的map方法来遍历生成每一个series对象，示例代码如下：

const seriesArr = [
  { name: "queueSize", data: this.queueSize, color: "#00C5AB" },
  { name: "enqueueCount", data: this.enqueueCount, color: "#00C5AB" },
  { name: "consumerCount", data: this.consumerCount, color: "#3F53FF" },
  { name: "producerCount", data: this.producerCount, color: "#8DF3E8" }
];

const series = seriesArr.map(item => {
  return {
    name: item.name,
    type: "line",
    data: item.data,
    color: item.color,
    symbolSize: 8
  };
});

这样做的好处是可以减少重复代码，同时也方便后续维护。