zoukankan      html  css  js  c++  java
  • 循环必须注意事项;

    虚值引起循环报错,导致代码阻塞!

    今天在工作中遇见一个场景:
    父组件向子组件中传递数据的时候,在子组件中父组件传递过来的数据进行循环的时候;
    子组件报错
    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之匿名函数(私有变量)
    Web前端开发修炼之道 (2)
    11.标志寄存器
    10.CALL和RET指令
    Javascript之继承(其他方式)
    Javascript之Function类型
    5.[BX]和Loop指令
    JavaScript之执行环境及作用域
    Javascript之BOM(window对象)
  • 原文地址:https://www.cnblogs.com/IwishIcould/p/13302208.html
Copyright © 2011-2022 走看看