Question

我如何将整个东西变成一个可以创建新的可控计时器的函数？

var seconds = 0;
var interval;
//when you want the timer to stop
var endTime = 55;

function checkTimer() {
if (seconds == endTime) {
    restartPause();

}};

//reset timer
function restart() {
pause();
seconds = 0; interval = setInterval(function() {console.log(seconds); seconds++; checkTimer()}, 1000);
};

//pause timer
function pause() {
  clearInterval(interval);
};

//play timer
function start() {
  pause();
  interval = setInterval(function() {console.log(seconds); seconds++; checkTimer()}, 1000);
};

//Restart and Pause, for when the video ends
function restartPause() {
restart();
pause();
};

function timeChange(n) {
seconds = n;
}

说我想像这样创建多个计时器的能力

var myTimer = new timer();
var anotherTimer = new timer();
var thirdTimer = new timer();

Answer 1

有两种方法可以做到这一点。如果使用的浏览器可以处理ES6类，则可以创建一个将所有这些函数定义为方法的类。用Javascript执行此操作的传统方法是定义一个函数，然后将其他函数添加到0.508777205 0.229010718 0.092779946 0.038210585 -0.692175368 0.240419603 0.694627686 0.800665661 0.433820868 -0.133540337 -0.679403925 0.36020227 -1.031396049 0.91525797 0.701421715 0.355537228 -1.30483618 -1.304934251中。您需要从实例中使用prototype访问变量和函数。这是一个示例，其中使用了一些应显示其工作原理的函数：

this

请注意，计时器的准确性不是很高，因此，如果您需要准确的时间，则可能需要寻找其他方法。

Answer 2

您应该创建“类”（不是真正的类，ES5中没有类，但是可以与new一起使用的函数。有关更多信息，请参见MDN Docs）。然后，对于任何“类”，都有成员变量，它们仅是该类的当前实例。例如，要创建类Timer，请使用以下代码：

function Timer() {
  // Private memebers, accessed only inside the class

  var seconds = 0;
  var interval;
  // When you want the timer to stop
  var endTime = 55;

  // Private functions

  var that = this; // For the intervalFunc function, I explained in my comment below
  var intervalFunc = function() {
    console.log(seconds);
    seconds++;
    that.checkTimer();
  };

  // Public functions, acessed to anyone have an instance of the class

  this.checkTimer = function() {
    if (seconds == endTime) {
      this.restartPause();
    }
  };

  // Reset timer
  this.restart = function() {
    this.pause();
    seconds = 0;
    interval = setInterval(intervalFunc, 1000);
  };

  // Pause timer
  this.pause = function() {
    clearInterval(interval);
  };

  // Play timer
  this.start = function() {
    this.pause();
    interval = setInterval(intervalFunc, 1000);
  };

  // Restart and Pause, for when the video ends
  this.restartPause = function() {
    this.restart();
    this.pause();
  };

  this.timeChange = function(n) {
    seconds = n;
  };
}



// Create instances of the class
var t1 = new Timer(), t2 = new Timer();
t1.start(); // t2 doesn't start!
t2.start();
t2.pause(); // t1 doesn't pause!

编辑：

当您从班级访问公共成员时，this关键字是必需的！（但是，当您访问私有成员时则不会。）

Answer 3

 class Timer {
   constructor() {
     this.seconds = 0;
     this.endTime = 55;
     this.interval = null;
   }

   checkTimer() {
     if (this.seconds === this.endTime) {
       this.restartPause();
     }
   }

   restart() {
     this.pause();
     this.seconds = 0;
     this.interval = setInterval(() => {
       console.log(this.seconds);
       this.seconds++;
       this.checkTimer();
     }, 1000);
   }

   pause() {
     clearInterval(this.interval);
   }

   start() {
     this.pause();
     this.interval = setInterval(() => {
       console.log(this.seconds);
       this.seconds++;
       this.checkTimer();
     }, 1000);
   }

   restartPause() {
     this.restart();
     this.pause();
   }

   timeChange(n) {
     this.seconds = n;
   }
 }

 const timer1 = new Timer();
 timer1.start();

 const timer2 = new Timer();
 timer2.start();

创建多个可控计时器

3 个答案:

编辑：