为什么使用函数参数。全局变量?

时间:2016-12-24 03:09:04

标签: javascript html

是的,我知道这可能是一个非常愚蠢的问题,但这已经困扰了我一段时间。

好的,所以我已经学习了一段时间的JavaScript并完全理解了一切。 。 .except for function" parameters" (我相信他们被称为)。

我被告知他们的工作方式如下:



function test(number) {
  document.write(number);
  };

test(1);
test(12);




这对我来说非常有意义。然而,最近,我发现了一些有点不同的东西。



var counterDays = document.getElementById('days');
var counterHours = document.getElementById('hours');
var counterMinutes = document.getElementById('minutes');
var counterSeconds = document.getElementById('seconds');


var date = new Date('December 28, 2016 00:00:00');

function updateTimer(date) {
    
    var time = date - new Date();
 
    return {
        'days': Math.floor(time / (1000 * 60 * 60 * 24)),
        'hours': Math.floor((time/(1000 * 60 * 60)) % 24),
        'minutes': Math.floor((time / 1000 / 60) % 60),
        'seconds': Math.floor((time / 1000) % 60),
        'total': time
    };
};

function startTimer(counterDays, counterHours, counterMinutes, counterSeconds, date) {
    
    var timerInterval = setInterval(function() {
        var timer = updateTimer(date);
        
        //Changes the text of the 'counter'
        counterDays.innerHTML = timer.days;
        counterHours.innerHTML = timer.hours;
        counterMinutes.innerHTML = timer.minutes;
        counterSeconds.innerHTML = timer.seconds;
      
      window.onload = function() {
    
    startTimer(counterDays, counterHours, counterMinutes, counterSeconds, date);
        };

 <span id="days">&nbsp;</span>
 <span id="hours">&nbsp;</span>
 <span id="minutes">&nbsp;</span>
 <span id="seconds">&nbsp;</span>
&#13;
&#13;
&#13;

我真正不明白的是,当变量updateTimer是全局范围内已存在的变量时,date在括号内始终需要date。与startTimer相同。我不明白为什么我需要传递它。为什么不只是访问函数中的变量,因为它们确实具有全局范围,并且完成它。相反,我需要将变量作为参数传递,以使函数起作用。

我已经尝试过,但是让功能正常工作的唯一方法就是传入变量。为什么??? ???

在我还在学习的时候,我已经在互联网上搜索了有关功能及其参数的更多信息,但所有这些都向我展示了类似于我的第一个例子。我知道这可能只是我的头脑,但对于我的生活,我只是不明白。

注意:我还在学习,如果整个问题很简单,那就很抱歉。

此外,我遇到问题的JS代码实际上已经运行了。这是因为我不想放入我的所有代码,而只是我遇到的代码。

2 个答案:

答案 0 :(得分:9)

  

相反,我需要将变量作为参数传递给   工作的功能。

您不需要使用参数定义函数。您可以利用更高范围的变量来调用它们

https://developer.mozilla.org/en-US/docs/Glossary/Scope

此:

var x = 'baz';
function foo(x) {
  return x;
}
foo(x);

会做同样的事情:

var x = 'baz';
function foo() {
  return x;
}
foo();

编写以参数作为输入的函数有助于保持代码模块化和副作用免受许多其他好处......

1。)如果在较高范围内无法访问x,则第二个示例将始终抛出错误

2.)如果另一个函数改变了x的值,它将影响第二个示例的输出,并且会导致应用程序中出现意外且可能难以调试的行为。而我总能确定第一个例子的输出

3。)阅读和维护以第一个例子的风格编写的代码要容易得多

答案 1 :(得分:2)

我看到你的代码

var timer = updateTimer(date);

请在此处以及被调用函数中删除日期参数。现在,日期变量将在全局范围内起作用。 所以它将是

function updateTimer() 
{
//date variable will be present here as global variable    
 }
 var timer = updateTimer();