时间戳

首页 > 解决方案 > Word random api 没有给我下一个单词

javascript - Word random api 没有给我下一个单词

问题描述

我有一个小项目，其工作方式如下：

所以，问题是当我要生成第二个词时，它以某种方式结合了第一个词。例如，假设第一个单词是fizz。游戏开始并猜出所有的字母。第二个词生成为buzz。我看到第二个单词生成得很好。但是当我尝试猜测字母时，它也会以某种方式检查第一个单词。它视为fibuzz。我的目标是每次猜测所有字母时都生成一个新的随机单词。

我的 API：

class API{
    static baseURL = "api-url"

     static generateRandomWord() {
        var len = 0
        var rndIndex = 1;

        fetch(API.baseURL)
        .then(response => response.json()) 
        .then(words => {
            len = words.length;
            rndIndex = this.getRandomIndex(len);
            console.log(words[rndIndex]);
        });
    }

}

我称之为API.generateRandomWord()生成一个新的随机词。我将所有字母作为按钮的事件：

button.addEventListener("click", (e) => {
   e.target.disabled = true
   let value = e.target.value

    // letter guess logic here
    
})

事件按预期进行。问题又来了，它对第一个初始随机词效果很好，但是当我们继续处理第二个词时，第一个词和第二个词被混合在一起了。

我所做的是为按钮事件添加一些逻辑，例如如果之前有一个单词，请将其删除。而且我还尝试删除包含随机单词的 div。到目前为止，这些都没有帮助。任何帮助都会得到帮助。

编辑：我处理 API 的方式如下：基本上将生成的随机词传递给Word类构造函数。

.....
.then(words => {
   len = words.length
   rndIndex = this.getRandomIndex(len);
   console.log(words[rndIndex]);
   
   new Word(words[rndIndex])
});

然后这个Word类开始游戏。

class Word{
    static all = []

    constructor(wordObject){
        this.name = wordObject.name
        this.id = wordObject.id
        this.category = wordObject.category
        Word.all.push(this); // this is the array I store the word each time
        this.space = this.renderSpace(); // this is the starting point.
    }

.... // other functions and logic
}

标签： javascriptapi

解决方案

“也许”的原因是您的Word类正在缓存其静态属性中的所有单词all。您的事件实际上无法删除任何先前的单词，因为您的删除逻辑不正确。因此，它最终会检查“所有生成的单词”的字母，而不是“仅”当前随机单词的字母

对此可能有两种解决方案：

  1. 检查事件中的删除逻辑，以确保它正在变异all并删除前一个单词。你可以尝试使用
Word.all.shift();

但我非常怀疑你会错过这个。这让我想到了下一点

  1. 调整代码的设计方式以避免奇怪的副作用：

要每次生成一个新的随机词并仅在您的事件中访问该新词，如果您的static属性是一个对象而不是数组会更好。所以，你有：

class Word {
    static currentWord = {}
    constructor(wordObject){
        Word.currentWord = wordObject;
    }
}

现在每次生成一个新词，Word.currentWord都会被重置为这个新词。您不必再担心删除活动中的前一个单词

所以现在您的活动可能如下所示：

button.addEventListener("click", (e) => {
   e.target.disabled = true
   let value = e.target.value
   console.log(Word.currentWord); // accessing current Random Word
    // letter guess logic here
})

推荐阅读