小程序制作中 一个奇怪的bug

事情是这样的:原一个购物车 合并本地数据和服务器 数据方法如下 ,正常测试没有问题,当每次重新登录,会调用到这个方法,就会莫名其妙的卡主,debug 发现 a1.length =77731508 导致卡死

但是 console.log(a1) 长度是正常的。。。

  async getMergeCart(){
    let a1 = await this.getLocalCart();//本地数据
    let a2 = await this.getServeCart();//服务器数据
    let arr=a1;//先赋值给arr a1

    console.log('debug',a1);
    console.log('debug',a2);
    if(a1.length === 0){
      return a2;//如果本地没数据 返回服务器数据。。。。
    }

    for(let i=0;i<a1.length;i++){
      for(let j=0;j<a2.length;j++){
        if(a1[i].id!=a2[j].id){
          arr.push(a2[j]);
        }
      }

    }
    return arr;
  }

=======================================问题解决=================================================

原因在于 arr.push(a2[j]);

当前arr 是 a1 的浅拷贝 就是a1的引用 ,arr修改 对应a1也会修改

循环如果出现 有id不相同情况 会导致 a1.length 增长导致 无限循环-

上面写法就是错误的。。。。脑子抽了

正确写法:

  async getMergeCart(){
    //合并数据应当以本地数据为主!
    const a1 = await this.getLocalCart();
    const a2 = await this.getServeCart();
    //长度先确定好..因为.length 是变长?
    let len_a1 = a1.length;
    
    if(a1.length === 0){
      return a2;//如果本地没数据 返回服务器数据。。。。
    }
    //必须使用len ---该bug当服务器数据和本地数据相同时不会触发,所以有隐蔽性。。。
    for(let i=0; i<len_a1; i++){
      for(let j=0;j<a2.length;j++){
        if(a1[i].id==a2[j].id){
          a1.splice(i,1);//移除对应key
          i--;//当前key 被移除 需要对应key前移一位
          len_a1--;//当前key 被移除 需要长度减一位
          break;
        }
      }
    }
    for(let i=0;i<a2.length;i++){
      a1.push(a2[i]);
    }
    return a1;
  }