Question

最近，我偷了一些JavaScript来在select元素中选择一个选项：

    var el=document.getElementById('mySelect');
    var opts=el.options;
    for (var opt, j = 0; opt = opts[j]; j++) {
        if (opt.value == 'Apple') {
          el.selectedIndex = j;
          break;
      }
    }

它工作正常，但是当我看着它时，我意识到它与我写的东西有所不同：

    var el=document.getElementById('mySelect');
    for (var j = 0; j < el.options.length; j++) {
        if (el.options[j].value == 'Apple') {
          el.selectedIndex = j;
          break;
      }
    }

在查看第一个代码时，如果找不到“ Apple”，什么会停止循环？哪个更好？

Answer 1

无论哪种情况，第二个表达式都确定循环是继续还是停止。在你的

for (var j = 0; j < el.options.length; j++) {}

很简单，j会递增，并且只要j小于选项的正确长度，就等于它的长度，然后停止。在另一个

for (var opt, j = 0; opt = opts[j]; j++) {}

区别在于，它们声明了变量opt，并在第二个表达式中将其设置为（也是递增的）数组索引。在某个时刻，j超出了数组的范围，而opts[j]是undefined。而且，由于JS中的相等表达式是正确站点的值，因此该表达式也是undefined，这是虚假的，并且循环终止。

哪个更好？两者都可以。但是，由于您不得不挠头思考其中的一个问题，您想在多大程度上依赖于更难阅读的代码？

Answer 2

长话短说：

在您的for循环var opt中执行一次，之后再执行opt = data[i]。

这很重要，因为：

var opt, data = [1, 2];    // defined once
console.log(opt = data[0]) // 1
console.log(opt = data[1]) // 2
console.log(opt = data[2]) // undefined

当for loop condition评估为falsy时，它将暂停。

因此，在您的情况下，当opt = data[i]最终成为falsy值-undefined

时，它确实停止了

在i处5和data[i]变得不确定并被分配给opt ...的点，作为最终结果{{1}返回}。

您还应该考虑使用此功能（如果可以选择使用ES6）：

undefined

它很短并且更容易阅读：）。

用于遍历选择选项的javascript选择

2 个答案: