Question

此代码是游戏的一部分，用户有一定的时间输入答案。

如果用户决定在分配的时间过去之前提交答案，我希望能够从对象外部清除间隔。

我已经尝试使用ID返回间隔，以便稍后可以调用它，虽然这允许我从对象外部清除它，但这意味着interval函数内的代码永远不会运行。

const clock = {
    timer: 30,
    countdown() {
        let interval = setInterval(function () {
            selectors.timerDisplay.textContent = clock.timer
            clock.timer--
            if (clock.timer < 0) {
                clearInterval(interval)
                selectors.wordSubmit.click();
            }
        }, 1000)
    },
}

我很欣赏我可能只是为了清除这段时间而设置得非常糟糕，所以我们将不胜感激任何关于如何改进它的建议。

提前致谢。

Answer 1

您可以使用箭头功能来利用对象this

clock

添加一种方法，即clear。
使用this上下文来引用您的内部属性。

const clock = {

    timer: 3,
    interval: 0,
    
    reset() {
      this.timer = 3;
      this.interval = 0;
    },
    
    clear() {      
      clearInterval(this.interval);
      this.reset();
    },
    
    countdown() {
        this.interval = setInterval(() => {
            //selectors.timerDisplay.textContent = clock.timer
            this.timer--;
            console.log(this.timer)
            if (this.timer < 0) {                
                clearInterval(this.interval)
                //selectors.wordSubmit.click();
            }
        }, 1000);
    },
}

clock.countdown();
setTimeout(function() {
  clock.clear();
}, 1500)

请参阅？间隔函数在1.5秒后结束

Answer 2

您可以公开方法以清除间隔

＆＃13;

#!/bin/bash -x

source credentials.sh
OPTARG=""
while getopts i:x:n: name
do
    case $name in
        x)  inputfile="$OPTARG" ;;
        i)  outputPath="$OPTARG" ;;
        n)  dirName="$OPTARG" ;;
    esac
done

if [ ! -d "$dirName" ]
then
    mkdir "$dirName" || echo "error while creating dir"
fi
while read -r line;
do
    touch "$line"
    mv  "$line" "$dirName"
done < "$inputfile"

＆＃13;

const selectors = document.querySelector('div');
const clearTimer = document.querySelector('button');
const clock = {
    timer: 5,
    // Initiate the interval
    int: null,
    // This exposes a way to clear the interval outside of the object
    clearTimer() {
      clearInterval(this.int);
    },
    countdown() {
        // This is where you define this.int
        this.int = setInterval(() => {
            //selectors.timerDisplay.textContent = clock.timer
            selectors.innerText = clock.timer.toString();
            clock.timer--
            console.log(clock.timer);
            if (clock.timer < 0) {
                this.clearTimer();
                //selectors.wordSubmit.click();
            }
        }, 1000)
    },
}

clock.countdown();
clearTimer.addEventListener('click', () => {
  clock.clearTimer();
})

＆＃13;

Answer 3

与suggested in the comments一样，只需返回interval即可稍后停止。例如

countdown() {
    let interval = setInterval(function () {
        selectors.timerDisplay.textContent = clock.timer
        clock.timer--
        if (clock.timer < 0) {
            clearInterval(interval)
            selectors.wordSubmit.click();
        }
    }, 1000)
    return interval // added this line
},

然后，消费者可以在需要时取消间隔

const interval = clock.countdown()

// and later...

clearInterval(interval)

在对象方法内清除间隔

3 个答案: