javascript - 为什么这段代码会执行无限循环？

Question

  <script>
  $(document).ready(function(){
  var names = ['Hannah', 'Lucy', 'Brenda', 'Lauren', 'Mary'];
  var liked = [];
  var disliked = [];

         while(names.length > 0){

          document.getElementById('demo').innerHTML =  names[i];
          function likeOrDislike(choice){
          if(choice == 'Like')
          {
            liked.push(names[0])
            names.splice(0, 1)
          }
          else if (choice == 'Dislike')
          {
            disliked.push(names[i])
            names.splice(0, 1)
          }

        };
   };
 });
  </script>

我要求 while 循环继续，直到数组名称为空。然后，我让用户每次都用数组中的名字替换文本。然后，我要么选择喜欢/不喜欢，然后删除数组的第一个名称并重复该过程，直到名称数组为空。

但是，当我在浏览器中加载时，它不会加载页面，因为我认为它陷入了循环

Answer 1

除了评论中指出的未定义的i之外，您永远不会更改名称

对名称的所有处理都是在函数function likeOrDislike()内完成的，并且您永远不会调用它。

所以这正在发生:

• 如果有名称 (names >0)，则执行此 stub 的内容
• ...就是这样。你永远不会改变名字。
• ...该函数从未被调用。

也许您打算做这样的事情 - 这只是一个例子，完全假设您想要实现的目标。

$(document).ready(function(){
  var names = ['Hannah', 'Lucy', 'Brenda', 'Lauren', 'Mary'];
  var liked = [];
  var disliked = [];

  $('#yourLikeButton').click(function(){
    var name = $(this).data('name'); // on your button put data-name="Hannah"
    var idx = names.indexOf(name);
    liked.push(names[idx]); // this is if you're playing around with indexes
    names.splice(idx, 1); // this is if you're playing around with indexes
  });

  // similar for your dislike button      

 });