0

for文を使い、二次元配列の値の正誤を取得したいのですが、上手く反映されないです。初心者なので、ネットで調べながらやっているのですがわかりません。どうか教えてください。

また、二次元配列にない値を入れると、"IDとパスワードが一致しません"とアラート表示されるのですが、三回連続で表示されてしまい困っています。解決策わかる方いらっしゃいましたらどうぞよろしくお願いいたします。

function logincheck(){
  const id = document.getElementById('id').value;
  const pw = document.getElementById('pas').value;

  //ユーザー仮ナンバー
  const usernum=[
    ['ss', '2222'],
    ['df', '4444'],
    ['we', '5555'],
  ];

  //ID PW未入力時
  if(id === "" && pw === ""){
    alert("IDとパスワードは必須入力です");
  
  //ID未入力時
  }else if(id === ""){
    alert("IDは必須入力です");
  
  //PW未入力時
  }else if(pw === ""){
    alert("パスワードは必須入力です");
  }else{
    //ID PW一致チェック
    for(let i=0; i<usernum.length; i++){
      let item = usernum[i];
      if(item[0] === id && item[1] === pw){
        window.location.href='html トップ画面.html';
      }else{
        alert("IDとパスワードが一致しません");
      }
    }
  }
}
4
  • 書き間違いなのかどうか判りませんが、if(item[0] === id && item[1] === password){item[1] === passworditem[1] === pw でしょう。それから、下から3行目の }); となっている部分も ); が余計なのではないかと。
    – user39889
    Commented 2021年6月8日 6:26
  • ご指摘ありがとうございます。動いたには動いたのですが、"IDとパスワードが一致しません"のアラートが三回連続で表示されてしまうのですが、なぜだかわかりますかね?差支えなければご回答よろしくお願いします
    – 原智樹
    Commented 2021年6月8日 6:55
  • 質問文を編集して typo を修正しておきました。「アラートが三回連続で表示されてしまうのですが、……」は質問文に追加するとよろしいかと。
    – user39889
    Commented 2021年6月8日 7:10
  • こちらも参考になりそうです。アラートが三回表示されてしまうfor文で二次元配列の値の正誤について
    – payaneco
    Commented 2021年6月11日 8:16

1 件の回答 1

1

プログラムの書き方の問題というよりアルゴリズムの問題かと思います。
タイトルには「配列の正誤確認のやり方」とありますが、
実際は「配列の存在確認のやり方」になるかと思います。

現在書かれているIDPW一致プログラムは以下のようですが、

//ID PW一致チェック
for(let i=0; i<usernum.length; i++){
  let item = usernum[i];
  if(item[0] === id && item[1] === pw){
    window.location.href='html トップ画面.html';
  }else{
    alert("IDとパスワードが一致しません");
  }
}

このプログラムを説明すると
・配列に一致するものがあれば、リダイレクト
・配列に一致しないものがあれば、アラート
というアルゴリズムになっています。
これは正誤チェックは正しく動いていますが、やりたいことは正誤チェックではなく
配列に存在するかどうかのはずです。

本来やらなければいけないアルゴリズムは
・配列に一致するものがあれば、リダイレクト
・配列に一つも一致するものがなければ、アラート
となるでしょう。
このアルゴリズムであれば、配列に存在するかどうかチェックできます。

上記の条件を満たすためにはいくつか方法はありますが、
シンプルに書けばfor文を回しつつ一致する場合分けifブロックに入らなかった場合はアラート出すがシンプルに実現できるかと思います。

//ID PW一致チェック
for(let i=0; i<usernum.length; i++){
  let item = usernum[i];
  if(item[0] === id && item[1] === pw){
    window.location.href='html トップ画面.html';
  }
}
alert("IDとパスワードが一致しません");    //ここにきている時点でlocation.hrefが実行されていないので配列には存在していなかったとみなせる

余談ですが、
ログインPWをjavascriptのクライアント側で実装することはありません。なぜなら一般的に認証機構はサーバサイドでやるべきであり、また配列を回すのではなくMySQLなどのRDBを用いて実装することが多いと思います。
練習用かと見受けれられますが、あまり一般的な実用的な問題ではないかもしれません。
アルゴリズムとプログラミングの練習としては良いでしょうけど、このやり方が一般的ではないと理解しておいたほうがいいと思います。

この質問に回答するには、ログインする必要があります。

求めていた回答ではありませんか? のタグが付いた他の質問を参照する。