如何从传递的循环参数中声明变量

Question

不要手动执行此操作：

let test1 = echarts.init(document.getElementById('test1'));
let test2 = echarts.init(document.getElementById('test2'));
let test3 = echarts.init(document.getElementById('test3'));
window.onresize = () => {
test1.resize({
height: 400,
width: document.documentElement.clientWidth - 60,
});
test2.resize({
height: 400,
width: document.documentElement.clientWidth - 60,
});
test3.resize({
height: 400,
width: document.documentElement.clientWidth - 60,
});
};

我想遍历数组，但value出现错误，无法重新声明变量

const report = [
'test1',
'test2',
'test3',
];
report.forEach((value) => {
value = echarts.init(document.getElementById(value));
window.onresize = () => {
value.resize({
height: 400,
width: document.documentElement.clientWidth - 60,
});
};
});

Answer 1

考虑使用Array.prototype.map()进行重组，以从id数组构建报告数组。然后创建一个单独的调整大小侦听器，该侦听器遍历这些报告以执行调整大小。

const reportIds = [
'test1',
'test2',
'test3',
];
// create an array of reports from an array of ids
const reports = reportIds.map(id => echarts.init(document.getElementById(id)));
// add a single resize listener which handles all reports
window.addEventListener("resize", e => {
reports.forEach(report => {
report.resize({
height: 400,
width: document.documentElement.clientWidth - 60,
})
});
});

Answer 2

我想我应该使用一个对象：

const report = {
'test1': "",
'test2': "",
'test3': ""
};
Object.keys(report).forEach((value) => {

report[value] = echarts.init(document.getElementById(value));
window.onresize = () => {
report[value].resize({
height: 400,
width: document.documentElement.clientWidth - 60,
});
};
*/
});