{"id":198,"hash":"d78b406f7aa471c5d6b41ef37a1c5d7da560ec313bec8a15a23db46cb27a14c5","pattern":"forEach is not a function error with JavaScript array","full_message":"I'm trying to make a simple loop:\n\nconst parent = this.el.parentElement\nconsole.log(parent.children)\nparent.children.forEach(child => {\n  console.log(child)\n})\n\nBut I get the following error:\n\n  VM384:53 Uncaught TypeError: parent.children.forEach is not a function\n\nEven though parent.children logs:\n\nWhat could be the problem?\n\nNote: Here's a JSFiddle.","ecosystem":"npm","package_name":"vue.js","package_version":null,"solution":"First option: invoke forEach indirectly\n\nThe parent.children is an Array like object. Use the following solution:\n\nconst parent = this.el.parentElement;\n\nArray.prototype.forEach.call(parent.children, child => {\n  console.log(child)\n});\n\nThe parent.children is NodeList type, which is an Array like object because:\n\nIt contains the length property, which indicates the number of nodes\nEach node is a property value with numeric name, starting from 0: {0: NodeObject, 1: NodeObject, length: 2, ...}\n\nSee more details in this article.\n\nSecond option: use the iterable protocol\n\nparent.children is an HTMLCollection: which implements the iterable protocol. In an ES2015 environment, you can use the HTMLCollection with any construction that accepts iterables.\n\nUse HTMLCollection with the spread operatator:\n\nconst parent = this.el.parentElement;\n\n[...parent.children].forEach(child => {\n  console.log(child);\n});\n\nOr with the for..of cycle (which is my preferred option):\n\nconst parent = this.el.parentElement;\n\nfor (const child of parent.children) {\n  console.log(child);\n}","confidence":0.95,"source":"stackoverflow","source_url":"https://stackoverflow.com/questions/35969974/foreach-is-not-a-function-error-with-javascript-array","votes":277,"created_at":"2026-04-19T04:41:31.369415+00:00","updated_at":"2026-04-19T04:51:13.114339+00:00"}