Browser keeps crashing becuase of a while loop

Question

Basically i'm coding a code that takes the first line from a textarea, then send it to a php code and get back the response. However this is not happening whenever i put the data the browser stops working this is the code that i'm working in

function getNewSocks() {
  socksList.splice(0, 1);
  $('#socks').val(socksList.join("\n"));
}
var socksList = $("#socks").val().split("\n");
while (socksList.length) {
  var getTheSocksLine = $.trim(socksList[0].replace(/\s+/g, ''));
  var getIP = $.trim(getTheSocksLine.split(":")[0]);
  var getPort = $.trim(getTheSocksLine.split(":")[1]);

  if (typeof getIP == "undefined" || typeof getPort == "undefined" || getIP == "" || getPort == "") {
    alert("typeof");
    socksDieResultDisplay(getIP + ":" + getPort);
    getNewSocks();
  }
  else if (getTheSocksLine.match(/^\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3}:\d{1,6}$/) == null) {
    alert("error");
    socksDieResultDisplay(getIP + ":" + getPort);
    getNewSocks();
  }

  else {
    $.ajax({
      url: "system/checkerPostHandler.php",
      method: "POST",
      data: "checkSocks=CheckSocksNowPlease&ip=" + getIP + "&port=" + getPort,
      success: function (getResponse) {
        alert("PHP Response=>" + getResponse + " jQuery Response=>" + getIP);
        if (socksList.length != 0) {
          getNewSocks();
        }

      }
    });
  }

}

i swear to god that now it has been 3-4 hours trying to find out what is the problem! help me please

Answer 1

You could introduce a counter and copmapre it with the socksList.length if the counter is <= to the socksList.length then the loop will run otherwise will exit.

The issue with your code is the loop condition will always true and it will always run. The socksList.length condition will always true if the socksList.length is not 0 .

Example.

function getNewSocks() {
  socksList.splice(0, 1);
  $('#socks').val(socksList.join("\n"));
}
var socksList = $("#socks").val().split("\n");
let counter = 0;
while (counter <= socksList.length) {
  var getTheSocksLine = $.trim(socksList[counter].replace(/\s+/g, ''));
  var getIP = $.trim(getTheSocksLine.split(":")[0]);
  var getPort = $.trim(getTheSocksLine.split(":")[1]);

  if (typeof getIP == "undefined" || typeof getPort == "undefined" || getIP == "" || getPort == "") {
    alert("typeof");
    socksDieResultDisplay(getIP + ":" + getPort);
    getNewSocks();
  }
  else if (getTheSocksLine.match(/^\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3}:\d{1,6}$/) == null) {
    alert("error");
    socksDieResultDisplay(getIP + ":" + getPort);
    getNewSocks();
  }

  else {
    $.ajax({
      url: "system/checkerPostHandler.php",
      method: "POST",
      data: "checkSocks=CheckSocksNowPlease&ip=" + getIP + "&port=" + getPort,
      success: function (getResponse) {
        alert("PHP Response=>" + getResponse + " jQuery Response=>" + getIP);
        if (socksList.length != 0) {
          getNewSocks();
        }

      }
    });
  }
  counter++;
}

You could use socksList.forEach or for of as well.

for of example:

for (const socks of socksList) {
  var getTheSocksLine = $.trim(socksList[socks].replace(/\s+/g, ''));
  //..other code
}

forEach example:

socksList.forEach( socks => {
  var getTheSocksLine = $.trim(socksList[socks].replace(/\s+/g, ''));
  //..other code
});