为何forEach循环中无法访问element变量？报Uncaught ReferenceError错误

首先看你给出的代码，当前写在forEach箭头函数内部的console.log(element)按理说不会触发element is not defined错误——因为element是用const在箭头函数的块级作用域里声明的，同作用域内可以正常访问。你遇到这个报错，大概率是在forEach循环的外部代码中尝试访问了element变量，比如在createELementOverArray函数里、甚至全局作用域里写了console.log(element)之类的代码，这时候因为作用域的限制，外部无法访问循环内部的element。

如果要在循环外访问每个创建的元素，你可以把这些元素收集到一个数组里：

const board = document.getElementById("board");
const array = [1, 2, 3, 4, 5, 6, 7, 8];
createELementOverArray();
function createELementOverArray() {
  const elements = []; // 声明数组存储元素
  array.forEach((value) => {
    const element = document.createElement("div");
    element.classList.add('element'); // 添加上你需要的class
    board.appendChild(element);
    elements.push(element); // 存入数组
    console.log(element); // 循环内正常访问
  });
  // 循环外可以通过elements数组访问所有创建的元素
  console.log(elements);
}

另外，你预期的DOM结构里每个div都有element类名，当前代码没有添加这一步，上面的代码里已经通过element.classList.add('element')补上了。

最后再确认：如果你的报错确实来自当前给出的代码，那检查一下是否有拼写错误，比如把element写成了别的单词，或者浏览器缓存了旧代码，刷新页面清空缓存再试。

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