如何从JSON数组中提取值并拆分存储为独立变量供Chart.js使用

你可以直接通过数组解构或者遍历的方式拿到目标子数组，以下是两种常用的可行方案： #

方案1：数组解构（已知子数组数量时使用） #

如果你的a.data里子数组的数量是固定的，直接用解构赋值就能一次性声明所有变量：

const sourceData = { "data":[[1,2,3],[2,4,3],[3,6,7],[1,4],[6,4,3,4],[6,7,3,5]] }
// 按顺序解构对应子数组，变量名可以自己修改
const [line1, line2, line3, line4, line5, line6] = sourceData.data
// 之后就可以直接调用这些变量，比如line1就是[1,2,3]，line2是[2,4,3]

方案2：直接按索引取用（更适配Chart.js场景） #

实际上你不需要单独给每个子数组声明变量，Chart.js的datasets配置本身就是数组结构，你可以直接遍历sourceData.data生成对应配置，比单独声明变量更高效：

const sourceData = { "data":[[1,2,3],[2,4,3],[3,6,7],[1,4],[6,4,3,4],[6,7,3,5]] }
const chartData = {
  labels: ['自定义x轴标签1', '自定义x轴标签2', '自定义x轴标签3'],
  datasets: sourceData.data.map((item, index) => ({
    label: `折线${index+1}`,
    data: item,
    borderColor: `rgb(${Math.random()*255}, ${Math.random()*255}, ${Math.random()*255})`,
    tension: 0.1
  }))
}
// 直接把chartData传给Chart.js实例即可完成渲染

你之前forEach调用失败的常见原因： #

大概率是遍历的时候没有提前定义存储容器，或者索引取值逻辑写错，参考正确写法：

const sourceData = { "data":[[1,2,3],[2,4,3],[3,6,7],[1,4],[6,4,3,4],[6,7,3,5]] }
const lines = []
sourceData.data.forEach(item => {
  lines.push(item)
})
// 之后用lines[0]、lines[1]分别取对应子数组即可

内容的提问来源于stack exchange，提问作者fungusblacky