首页 > 解决方案 > 如何在for循环中比较两个不同长度的对象?

问题描述

我试图创建一个登录功能,当用户输入有效的名称和密码时,它将打印“欢迎用户”否则“无效用户”。

在我的代码中,它接受一个用户名和密码并显示对另一个无效...我不明白为什么它会这样显示...

代码:

<script>
     let userName=document.getElementById("input1");
     let mailId=document.getElementById("input2");
     var out=[{Name:"dhanam",mail:"dhanamram98@gmail.com"}, 
              {Name:"alamelu",mail:"alamu98@gmail.com"}];
     function input()
     {
         var input=userName.value;
         var output=mailId.value;
         var created=[{Name:input,mail:output}];
         return created
     }
     function output()
     {

          var inp=input();

         for(var i=0;i<inp.length;i++)
         {
             for(var j=0;j<out.length;j++)
             {
                  console.log(inp[i].Name+inp[i].mail);
                  console.log(out[j].Name+out[j].mail);
              if((inp[i].Name== out[j].Name)&& 
                  (inp[i].mail==out[j].mail))
               {
              document.getElementById("out1").innerText="welcome
                                                         user";

                }
             else{
               document.getElementById("out1").innerText="Invalid 
                                                          user";
                }
             }

           }

       }
      var but=document.getElementById("out");
      but.addEventListener("click",output);
  </script>

在这里找到小提琴:

https://jsfiddle.net/xp1Lrbdh/#&togetherjs=d0wTznLFgu

标签: javascriptobject

解决方案


The issue is because of the iteration you are doing even after finding if entered user is valid user. In simple terms, putting a break statement solves your problem.
See the snippet below:

    let userName=document.getElementById("input1");
    let mailId=document.getElementById("input2");
    var out=[{Name:"dhanam",mail:"dhanamram98@gmail.com"}, 
    {Name:"alamelu",mail:"alamu98@gmail.com"}];
    function input()
    {
        var input=userName.value;
        var output=mailId.value;
        var created=[{Name:input,mail:output}];
        return created
    }
    function output()
    {
        var inp=input();
        for(var i=0;i<inp.length;i++)
        {
            for(var j=0;j<out.length;j++)
            {
                console.log(inp[i].Name, inp[i].mail);
                console.log(out[j].Name, out[j].mail);
                if((inp[i].Name== out[j].Name)&&(inp[i].mail==out[j].mail))
                {
                    document.getElementById("out1").innerText="welcome user";
                    break;

    }
    else{
        document.getElementById("out1").innerText="Invalid user";
    }


    }

  }

  }
  var but=document.getElementById("out");
  but.addEventListener("click",output);

注意:这不是验证凭据的最佳做法,也应避免使用 var,请改用 let、const


推荐阅读