JavaScript - 运行函数时声明的变量未定义错误

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了JavaScript - 运行函数时声明的变量未定义错误相关的知识,希望对你有一定的参考价值。

我正在尝试创建一个计算器,可以通过在输入中输入一年然后单击按钮来显示一年中有多少个星期五,结果将显示一个警告():

<script>
    function Fridaythe13(j) {
        var count = document.getElementById('year').value;
        var count = 0;
        for (var month=0; month<12; month++) {
            var d = new Date(j,month,13);
            if(d.getDay() == 5){
                count++;
            }
        }
        return count;                            
    }

    document.getElementById("run").addEventListener("click", function(){
        alert(Fridaythe13(count));
    })
</script>

<input type="text" name="year" id="year" />
<section class="material">
    <div class="actions">
        <button type="button" id="run">Run</button>
    </div>
</section>    

当我点击按钮时,它表示没有定义count变量,但是我用输入('year')声明了它,所以我不明白......提前感谢你的帮助!

答案

你的一些逻辑被打破了,这是一个有效的例子。

首先,您在函数中定义了两次变量count

此外,从您的单击处理程序,您将一个参数count传递给您的内部函数,但此变量也未被声明。

考虑为变量使用更好的名称。例如year而不是j

也更喜欢使用let/constvar来声明变量。

function fridayThe13(year) {
    let count = 0;
    for (let month = 0; month < 12; month++) {
      const date = new Date(year, month, 13);
      if (date.getDay() == 5) {
        count++;
      }
    }
    return count;                            
}

document.getElementById("run").addEventListener("click", () => {
  const year = document.getElementById('year').value;
  alert(fridayThe13(year));
})
<input type="text" name="year" id="year" />
<section class="material">
  <div class="actions">
    <button type="button" id="run">Run</button>
  </div>
</section>
另一答案

在函数Fridaythe13中定义了变量count(@GetOffMyLawn指出的两倍),并且警报试图在该函数之外访问它。我相信您希望您的代码看起来像这样:

var count = document.getElementById('year').value;

function Fridaythe13(j) {
  var count = 0;
  for (var month = 0; month < 12; month++) {
    var d = new Date(j, month, 13);
    if (d.getDay() == 5) {
      count++;
    }
  }
  return count;
}

document.getElementById("run").addEventListener("click", function() {
    alert(Fridaythe13(count));
})

但为了避免混淆,我建议将第一个声明的count变量更改为不同的变量名称。也许是这样的:

var thisYear = document.getElementById('year').value;

function Fridaythe13(j) {
  var count = 0;
  for (var month = 0; month < 12; month++) {
    var d = new Date(j, month, 13);
    if (d.getDay() == 5) {
      count++;
    }
  }
  return count;
}

document.getElementById("run").addEventListener("click", function() {
  alert(Fridaythe13(thisYear));
})
另一答案

您在错误的函数(document.getElementById('year').value)中声明了您的计数。将它移动到另一个功能,它将工作。

function Fridaythe13(j) {
  var count = 0;
  for (var month = 0; month < 12; month++) {
    var d = new Date(j, month, 13);
    if (d.getDay() == 5) {
      count++;
    }
  }
  return count;
}

document.getElementById("run").addEventListener("click", function() {
  var count = document.getElementById('year').value;
  alert(Fridaythe13(count));
})
<input type="text" name="year" id="year" />
<section class="material">
  <div class="actions">
    <button type="button" id="run">Run</button>
  </div>
</section>
另一答案

您定义计数两次。移动第一个声明并重命名。

     <script>
     function Fridaythe13(year) {
            var count = 0;
            for (var month=0; month<12; month++) {
                var d = new Date(year,month,13);
                if(d.getDay() == 5){
                  count++;
                }
            }
            return count;                            
        }

        document.getElementById("run").addEventListener("click", function 
        (){
            var selected_year = document.getElementById('year').value;

            alert(Fridaythe13(selected_year));
        })
  </script>
另一答案

您可以使用map()函数收集每个月的第13天,然后仅过滤星期五。

const count = [1,2,3,4,5,6,7,8,9,10,11,12]
                   .map(m=>new Date(2019,m,13).getDay())
                   .filter(d=>d==5)
                   .length;
console.log(count);
另一答案

认识到Fri 13表示星期日是第一个,并且使用年和月偏移,可以在不参考日期对象的情况下进行算术运算(注意:此版本仅适用于格里高利历和大于0的年份)

function countFri13(year) {
  var count = 0;
  const leapYear = (year % 4 && !((year % 100) && !(year % 400)))
  var yearOffset = (1 + 5 * ((year - 1) % 4) + 4 * ((year - 1) % 100) + 6 * ((year - 1) % 400)) % 7;
  if (leapYear) {
    var monthOffsets = [0, 3, 4, 0, 2, 5, 0, 3, 6, 1, 4, 5]
  } else {
    monthOffsets = ([0, 3, 3, 6, 1, 4, 6, 2, 5, 0, 3, 4])
  }
  for (var month = 0; month < 12; month++) {
    if ((yearOffset + monthOffsets[month]) %  7 === 0) {
      count++;
    }
  }
  return count;
}

// in ES6...

function countFri13es6(year) {
  let count = 0,
    monthOffsets = [];
  const yearOffset = (1 + 5 * ((year - 1) % 4) + 4 * ((year - 1) % 100) + 6 * ((year - 1) % 400)) % 7;
  (year % 4 && !((year % 100) && !(year % 400))) ? monthOffsets = [0, 3, 4, 0, 2, 5, 0, 3, 6, 1, 4, 5]: monthOffsets = ([0, 3, 3, 6, 1, 4, 6, 2, 5, 0, 3, 4])
  for (var month = 0; month < 12; month++) {
    if ((yearOffset + monthOffsets[month]) % 7 === 0) count++;
  }
  return count;
}

以上是关于JavaScript - 运行函数时声明的变量未定义错误的主要内容,如果未能解决你的问题,请参考以下文章

JavaScript 变量和函数提升问题总结

JavaScript 变量声明提升

使用 javascript 使用 for 循环声明变量

JavaScript之变量提升

JavaScript 变量作用域 详解

Javascript基础