我是靠谱客的博主 微笑铃铛,最近开发中收集的这篇文章主要介绍js优化双层for循环的方法,觉得挺不错的,现在分享给大家,希望可以做个参考。

概述

最近在项目中遇到一个需求,需要将两个数据表的数据进行比对,这涉及到了两层for循环的嵌套。数据少的时候还好,一旦数据多就是成倍的循环次数,性能不好,尝试优化一下。

假如两次循环都是1000个元素,那么循环次数是:1000*1000

之前的双层for循环写法:

const withdrawCell = reactive<RenderCell[]>([{
  label: '姓名', key: 'realname', type: 'field', col: { xs: 24, sm: 24, md: 24 }, val: ''
}, {
  label: '会员号', key: 'username', type: 'field', col: { xs: 24, sm: 24, md: 24 }, val: ''
}, {
  label: '提现方式', key: 'money_type', type: 'filterDic', dictionary: 'money_withdraw_type', col: { xs: 24, sm: 24, md: 24 }, val: ''
}, {
  label: '账号', key: 'account', type: 'field', col: { xs: 24, sm: 24, md: 24 }, val: ''
}, {
  label: '总金额', key: 'total_amount', type: 'field', col: { xs: 24, sm: 24, md: 24 }, val: ''
}, {
  label: '手续费', key: 'fee', type: 'field', col: { xs: 24, sm: 24, md: 24 }, val: ''
}
])

 for (let i = 0; i < withdrawCell.length; i++) {
    for (const j in props.rowInfo) {  // props.rowInfo是一个对象,key键值对的形式
      if (withdrawCell[i].key === j) {
        switch (withdrawCell[i].type) {
          case 'field':
            withdrawCell[i].val = props.rowInfo[j]
            break
          case 'filterDic':
            withdrawCell[i].val = filterDic(props.rowInfo[j], useDictionary.originDictionary[withdrawCell[i].dictionary])
            break
        }
      }
    }
  }

优化后写法
相当于一个for循环就能搞定
先判断另一个循环对象里有没有对应的字段,没有就跳出,执行下一个循环
优化之后的循环次数:1000

for (let i = 0; i < withdrawCell.length; i++) {
    const item = withdrawCell[i]
    //先判断另一个循环对象里有没有对应的字段,没有就跳出,执行下一个循环
    if (!props.rowInfo[item.key]) {
      continue
    }
    switch (item.type) {
      case 'field':
        item.val = props.rowInfo[item.key]
        break
      case 'filterDic':
        item.val = filterDic(props.rowInfo[item.key], useDictionary.originDictionary[item.dictionary])
        break
    }
  }

关于continue break 关键字

1)continue 关键字: 立即跳出本次循环,继续下一次循环。
2)break 关键字立即跳出整个循环(循环结束)。

最后

以上就是微笑铃铛为你收集整理的js优化双层for循环的方法的全部内容,希望文章能够帮你解决js优化双层for循环的方法所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(61)

评论列表共有 0 条评论

立即
投稿
返回
顶部