在工作中,总是需要对数组进行循环处理,当数据越来越多的时候,就会导致处理的时间比较长。所以,这篇文章简单的重温一下时间复杂度,以及简单测试一下,不同嵌套循环的处理时间。

时间复杂度:

定义:
在计算机科学中,时间复杂性,又称时间复杂度,算法的时间复杂度是一个函数,它定性描述该算法的运行时间。这是一个代表算法输入值的字符串的长度的函数。时间复杂度常用大O符号表述,不包括这个函数的低阶项和首项系数。使用这种方式时,时间复杂度可被称为是渐近的,亦即考察输入值大小趋近无穷时的情况。

常用的

符号含义
O(1)常数
O(log(n))对数
O(n)线性
O(n²)平方
O(2^n)指数

在实际开发中,最经常遇到的还是 O(n²),也就是双层for 循环。

下面进行测试一下不同循环方式所花费的时间:

先创建 a, b 两个数组。

      for (let i = 0; i < 9999; i++) {
        this.a.push({ id: i, name: 'a:' + i })
      }
      console.log("a数组",this.a)
      for (let x = 0; x < 999; x++) {
        this.b.push({ id: x, name: 'b:' +  x })
      }
      console.log("b数组",this.b)

c数组存放, 他们 id 相等的对象
1,通过 for 循环嵌套 for 进行数据操作,

      const c = []
       console.time('打印 for - for');
       for(let i = 0; i< this.a.length; i++){
        for(let x = 0; x< this.b.length; x++){
          if (this.a[i].id === this.b[x].id){
             c.push(this.a[i])
          }
        }
       }
      console.log("c数组",c)
      console.timeEnd('打印 for - for');

此时所花费的时间:打印 for - for: 120012.27807617188 ms
image.png
2,通过 forEach 循环嵌套 forEach 进行数据操作,

      const c = []
       console.time('打印 forEach - forEach');
       this.a.forEach( n => {
          this.b.forEach(m => {
          if (n.id === m.id) c.push(m)
        })
       })
      console.log("c数组",c)
      console.timeEnd('打印 forEach - forEach');

此时所花费的时间:打印 forEach - forEach: 2006.343994140625 ms
image.png
3,通过 filter 和 includes 进行数据操作,

      console.time('打印 filter - includes');
      const ids = this.a.map(m => m.id)
      const c = this.b.filter(n => ids.includes(n.id))
      console.log("c数组",c)
      console.timeEnd('打印 filter - includes');

此时所花费的时间:打印 filter - includes: 5.912841796875 ms
image.png

最后发现,通过 filter 和 includes 进行数据操作,时间大大减少了,是因为 使用了 map

哈希表为无序 Map,插入、查找、删除的时间复杂度均为O(1)
Map 是 ES6 新出的一种数据结构,用来表示键值对,object也是键值对结构,Map算是对object的一种加强
object的键只能为string,Map的键可以为任意值

参考:
双层循环遍历 减少时间复杂度
map的时间复杂度_JavaScript ES6—Map的妙用


A_Ghost
29 声望4 粉丝

知道的越多,不知道的也就越多。


« 上一篇
nuxt 路由拦截
下一篇 »
DOM树问题