这篇文章主要介绍了JavaScript虚值引起循环报错怎么解决的相关知识，内容详细易懂，操作简单快捷，具有一定借鉴价值，相信大家阅读完这篇JavaScript虚值引起循环报错怎么解决文章都会有所收获，下面我们一起来看看吧。
今天在工作中遇见一个场景：
父组件向子组件中传递数据的时候，在子组件中父组件传递过来的数据进行循环的时候；
子组件报错
TypeError: Cannot read property 'menu_pid' of null at VueComponent.getTree
后来发现报错的原因是在进行循环的时候,
getTree(list, parentId) {
let re = new Array();
for (let i = 0; i < list.length; i++) {
let pid = list[i].menu_pid; 提示这里报错
//do something
}
return re;
},
发现父组件传递过来的数据 list 中有一个虚值[{},{},null];
就是这个虚值 null，导致报错了;
然后就阻塞了代码；导致后面的代码无法运行;
以后如何避免这样的问题；
在父组件向子组件传递数据的时候；
不要传递虚值，因为虚值会导致出现意想不到的错误；
在向下传递值的时候；要对值进行检查；
底层在进行循环的时候，注意代码的健壮性；
去除虚值
let arr = [11, 22, 33, null, '', undefined]
let newArr = [];
for (let i = 0; i < arr.length; i++) {
if (arr[i]) {
newArr.push(arr[i])
}
}
console.log(newArr);//[11, 22, 33]
关于“JavaScript虚值引起循环报错怎么解决”这篇文章的内容就介绍到这里，感谢各位的阅读！相信大家对“JavaScript虚值引起循环报错怎么解决”知识都有一定的了解，大家如果还想学习更多知识，欢迎关注编程网行业资讯频道。
