循环必须注意事项;

简介: 循环必须注意事项;

今天在工作中遇见一个场景:


父组件向子组件中传递数据的时候,在子组件中父组件传递过来的数据进行循环的时候;


子组件报错


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]
相关文章
|
1月前
|
Perl
在awk中,初始化-测试-递增型的 `for` 循环
在awk中,初始化-测试-递增型的 `for` 循环
25 2
|
1月前
|
Java Python
循环程序举例
循环程序举例
26 1
|
1月前
|
存储 前端开发 索引
Map循环注意事项
Map循环注意事项
16 1
|
1月前
|
C语言
20.C语言:用continue语句提前终止循环
20.C语言:用continue语句提前终止循环
31 0
|
1月前
|
C语言
19.C语言:用break语句提前终止循环
19.C语言:用break语句提前终止循环
59 0
|
1月前
while循环和do while循环有什么区别
while循环和do while循环有什么区别
35 0
|
7月前
while循环和do while循环有什么区别?
while循环和do while循环有什么区别?
79 0
|
11月前
|
存储 前端开发 索引
map循环注意事项
map循环注意事项
85 0
|
Java
三种循环的区别
三种循环的区别
64 0
|
JavaScript 前端开发
不同类型的循环
不同类型的循环
63 0