zoukankan      html  css  js  c++  java
  • 开关门

    说一个简单的开关门案例,也是我们常在做购物车时会遇到的,就比如说全选反选啊,等等等等

    首先,如果你要判断一件商品你是否加入过购物车,那普通的思路肯定是用if...else来判断那么是这样的

    var arr = [
            {id:1,num:3},
            {id:2,num:5},
            {id:3,num:7},
            {id:4,num:8}
        ]
        var id = 6;
        for(var i=0;i<arr.length;i++){
            if(arr[i].id==id){
                alert('以前有这个商品,数量相加')
            }else{
                alert('以前没有,把新商品加入')
            }
        }

    那么他的执行结果是这样的

    为什么重复加入了4次呢?if...else就是如果这个条件不满足,则去执行下面的代码,所以就是无论我们要加入的id是什么,执行的次数只会是数组的长度,也就是说,循环遍历多少次,就会去执行多少次,那么大家想一下,这样你在往购物车加入商品的话,是不是会造成商品一直在重复加入呢,那人家买东西岂不亏死喽。

    如果你还觉得不明白 我们再来看一个案例

      var arr = [1,2,3]
       for(var i=0;i<arr.length;i++){
            if(arr.length<30){
                arr.push(1)
            }
            console.log(arr)
       }
    

      这里是执行结果

    是不是执行了30次呢,就像上面一样,它每次循环执行的都是最新的arr。

    所以,这里我们就需要用到开关门了。我对他的理解呢就是 要么...要么....

      var arr = [
            {id:1,num:3},
            {id:2,num:5},
            {id:3,num:7},
        ]
        var id = 6;
        var bStop = true;//开门
        for(var i=0;i<arr.length;i++){
            if(arr[i].id==id){
                alert('以前有这个商品,数量相加')
                bStop = false;//关门
                break
            }
        }
        //开门则执行 关门则不执行
        if(bStop){
            alert('以前没有,新插入一个对象')
        }
    

      就是无论你的id多少,数组长度数多少,它永远只执行一次操作,这样才会使得我们不管这件商品是否加入过购物车,只要我们点击几次,加入的商品数量只会与之相符,并不会造成循环多次,把以前加入过的商品都算在新加入的数量上面,造成数量上的冗余与错误。

     

    是不是判断以前没有这个商品,那么就点击了一次 所以只加入一个,这样是不是更合理一点呢。

                                                                                                                                                                          
                                                                                                                                                                                              (ps:如有不同意见,欢迎指正)

  • 相关阅读:
    数组,字符串内置方法解析
    Git忽略规则和.gitignore规则不生效的解决办法
    使用canvas进行图片裁剪简单功能
    Git 常用命令大全(转)
    vue实现ajax滚动下拉加载,同时具有loading效果
    弹框组件
    年月日日历选择组件
    百度搜索热词下拉
    省市县三级联动插件(面向过程,面向对象两种方式实现)
    jquery 移动端轮播图
  • 原文地址:https://www.cnblogs.com/cuigege/p/9267285.html
Copyright © 2011-2022 走看看