[英]I am going through infinite loop when adding values to array
默認情況下，我創建了一個包含一些電影名稱的數組。 我有一個要求用戶輸入的表單，如果用戶輸入與我的默認數組匹配，則應彈出該電影已經存在，如果用戶輸入與我的默認數組不同，則應存儲在其他數組中。 我已經完成了第一部分，但是在將值添加到數組時遇到了問題
function insert() { var movie = document.getElementById("movie").value; var movie2 = []; for (var i = 0; i <= movie2.length; i++) { if (movie !== movie2[i]) { movie2.push(movie); var name2 = "Movie added into Array2"; alert(name2); } else { var name2 = "Movie already added to Array2"; alert(name2); } } } function validation() { var movie = document.getElementById("movie").value; var movie1 = ["Bahubali", "The Final Destination", "The Cars", "PK", "Bajarangi Baijaan", "Force"]; if (movie == "") { var name2 = "Please enter your favoite movie name"; alert(name2); } for (var i = 0; i < movie1.length; i++) { if (movie == movie1[i]) { var name2 = "Movie exists in our database"; alert(name2); } else { insert(); } } }
<html> <head> <title>Movie Mania</title> <link rel="stylesheet" type="text/css" href="Movie.css"> <script src="Movie.js"></script> </head> <body> <div class="content"> <div class="matter"> <p class="header">Movie Mania</p> <div class="regis"> <form class="reg"> <input type="text" name="user" id="movie" placeholder="Please enter any movie name" size="40"> <hr> <div><input type="submit" class="button" value="Search" id="sub" onclick="validation()" /></div> </div> </div> </div> </form> </body> </html>
這是循環問題。
for循環問題的說明
請參閱
console.log該條件與數組的每個參數匹配。 您不會違反真實的聲明。 所以只有else語句也可以運行（insert），直到循環完成
var one = "hi" var arr = ['hello', 'hi', 'how'] for (var i = 0; i < arr.length; i++) { console.log(arr[i] == one) if (arr[i] == one) { break; } }
解決方案： 您應該使用break語句 。
看到console.log循環被中斷后停止執行
var one="hi" var arr = ['hello','hi','how'] for(var i=0; i< arr.length; i++){ console.log(arr[i] == one) }
為了更好地使用Array#includes而不是for循環迭代
更新：
使用movie2刪除movie2 .push(movie) ， movie1 movie1數組聲明為movie1數組
var movie1 = ["Bahubali", "The Final Destination", "The Cars ","PK "," Bajarangi Baijaan ","Force "]; function insert() { var movie = document.getElementById("movie").value; if (!movie1.includes(movie)) { // ! refer for false statement movie1.push(movie); var name2 = "Movie added into Array2"; console.log(name2); } else { var name2 = "Movie already added to Array2"; cosole.log(name2); } console.log(movie1) } function validation() { var movie = document.getElementById("movie").value; if (!movie.trim()) { //its validate the input empty undefined null var name2 = "Please enter your favoite movie name"; console.log(name2); } else if (movie1.includes(movie)) { // includes used for find the value is in array or not var name2 = "Movie exists in our database"; console.log(name2); } else { insert(); } return false; }
<div class="content"> <div class="matter"> <p class="header">Movie Mania</p> <div class="regis"> <form class="reg"> <input type="text" name="user" id="movie" placeholder="Please enter any movie name" size="40"> <hr> <div><input type="submit" class="button" value="Search" id="sub" onclick="return validation()" /></div> </div> </div> </div> </form>
無限循環的原因是：
var movie2 = [];
for (var i = 0; i <= movie2.length; i++) {
if (movie !== movie2[i]) {
movie2.push(movie);
var name2 = "Movie added into Array2";
alert(name2);
} else {
var name2 = "Movie already added to Array2";
alert(name2);
}
}
您從i = 0開始，由於數組為空，因此i <= movie2.length為true i <= movie2.length因為數組為空movie2[i] == undefined所以您將影片推送到數組，下一次迭代i將為1 ， movie2.length也將為1但movie2[1] undefined因此您再次推送電影，並且將繼續重復。
解決此問題的一種方法是檢查影片是否存在，然后將其推送：
這段代碼還有其他一些與問題無關的問題
function insert() { var movie = document.getElementById("movie").value; var movie2 = []; var found = false; for (var i = 0; i < movie2.length; i++) { if (movie !== movie2[i]) { found = true break; } } if (!found) { movie2.push(movie); var name2 = "Movie added into Array2"; alert(name2); } else { var name2 = "Movie already added to Array2"; alert(name2); } } function validation() { var movie = document.getElementById("movie").value; var movie1 = ["Bahubali", "The Final Destination", "The Cars", "PK", "Bajarangi Baijaan", "Force"]; if (movie == "") { var name2 = "Please enter your favoite movie name"; alert(name2); } for (var i = 0; i < movie1.length; i++) { if (movie == movie1[i]) { var name2 = "Movie exists in our database"; alert(name2); } else { insert(); } } }
<html> <head> <title>Movie Mania</title> <link rel="stylesheet" type="text/css" href="Movie.css"> <script src="Movie.js"></script> </head> <body> <div class="content"> <div class="matter"> <p class="header">Movie Mania</p> <div class="regis"> <form class="reg"> <input type="text" name="user" id="movie" placeholder="Please enter any movie name" size="40"> <hr> <div><input type="submit" class="button" value="Search" id="sub" onclick="validation()" /></div> </div> </div> </div> </form> </body> </html>
略有改進的版本
var movie1 = ["Bahubali", "The Final Destination", "The Cars", "PK", "Bajarangi Baijaan", "Force"]; var movie2 = []; function insert() { var movie = document.getElementById("movie").value; var found = false; for (var i = 0; i < movie2.length; i++) { if (movie !== movie2[i]) { found = true break; } } if (!found) { movie2.push(movie); var name2 = "Movie added into Array2"; alert(name2); } else { var name2 = "Movie already added to Array2"; alert(name2); } } function validation() { var movie = document.getElementById("movie").value; if (movie == "") { var name2 = "Please enter your favoite movie name"; alert(name2); } var found = false; for (var i = 0; i < movie1.length; i++) { if (movie == movie1[i]) { found = true break; } } if (found) { var name2 = "Movie exists in our database"; alert(name2); } else { insert(); } }
<html> <head> <title>Movie Mania</title> <link rel="stylesheet" type="text/css" href="Movie.css"> <script src="Movie.js"></script> </head> <body> <div class="content"> <div class="matter"> <p class="header">Movie Mania</p> <div class="regis"> <form class="reg"> <input type="text" name="user" id="movie" placeholder="Please enter any movie name" size="40"> <hr> <div><input type="submit" class="button" value="Search" id="sub" onclick="validation()" /></div> </div> </div> </div> </form> </body> </html>
您面臨的問題在於循環邏輯。 您正在訪問數組的每個元素，並檢查該元素是否等於新值。 如果不是，那么您正在插入值。
說您的數組包含：
["A", "B"]
您希望插入“ C”。
首先，您的代碼將“ A”與“ C”進行比較，由於它們不相等，因此您要插入“ C”，因此數組變為
["A", "B", "C"]
然后，您的for循環繼續比較“ B”和“ C”，由於它們不相等，因此您再次插入“ C”。
更糟的是，您的insert方法還通過再次遍歷數組並為數組中已經存在的每部影片實際插入新值來執行類似的任務。
因此，要解決該問題，您的邏輯應該是：
要檢查影片是否已經存在於數組中，可以使用includes數組方法。 像這樣：
if (movie1.includes(movie)){
//movie is already in array
}else{
//movie is not yet in array
}
為什么當我在嵌套的 for 循環中切片這個數組時，它會進入無限循環？
[英]Why when I'm slicing this array in a nested for loop is it going on an infinite loop?
JS中的可迭代和可枚舉有什么區別？ 我正在經歷 For/of 和 For/In 循環，這些術語經常出現
[英]What is the difference between iterable and enumerable in JS? I am going through For/of and For/In loop and these terms are coming up frequently
實現更改功能時，CodeMirror進入無限循環
[英]CodeMirror going into infinite loop when implementing on change function
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.