Question

我对javascript很新，我在代码中遇到了逻辑错误。

var btn = document.querySelector("button");
var para = document.querySelector(".paragraph");
var prevVal = document.querySelector(".prevVal");

var randomArray = [" Hello", " Hi", " How are you?", " How was your day?", " Tell me a joke.", " I am having a good day."];
var previousValueArray = [];

btn.addEventListener("click", function(){
  var randomValue = randomArray[Math.floor(Math.random() * randomArray.length)];

  //pushing value in previousValueArray
  previousValueArray.push(randomValue);
  if (previousValueArray.length === 6){
     previousValueArray.shift();
  }
  if (previousValueArray[previousValueArray.length - 1] === randomValue){
     para.textContent = "Sorry, but this was the previous value. Click again please.";
  }

  para.textContent = randomValue;
  prevVal.textContent = previousValueArray;
});

我正在尝试让我的第二个if条件更改textConent的{{1}}。我正在测试para和previousValueArray中的最后一个值是否相等。为了使这一点更清楚，我正在尝试创建一个测试项目，如果用户单击一个按钮，它会从randomValue输出一个随机值 - 我得到了这个工作。接下来，我想进入下一级别，并确保我的程序连续两次没有执行相同的值。我不能让这个工作。有什么帮助吗？

这是HTML：

randomArray

Answer 1

您可以将随机选择的文本移动到数组的末尾。然后下次你只会看一个较少的元素来挑选一个随机文本。

以下是使用splice：

的方法

var btn = document.querySelector("button");
var para = document.querySelector(".paragraph");
var prevVal = document.querySelector(".prevVal");

var randomArray = [" Hello", " Hi", " How are you?", " How was your day?", 
                   " Tell me a joke.", " I am having a good day."];
var valueCount = randomArray.length;

btn.addEventListener("click", function(){
  var i = Math.floor(Math.random() * valueCount);
  var randomValue = randomArray[i];

  para.textContent = randomValue;
  prevVal.textContent = randomArray[valueCount] || '';
    
  // move selected value to the end
  randomArray.push(randomArray.splice(i, 1));
  // Next time this value cannot be selected
  valueCount = randomArray.length - 1;
});

<button type="button">Random Value</button>
<p class="paragraph"></p>
<p class="prevVal"></p>

注意：您的代码有两个问题：您已经测试了相等性太晚了，因为您已经推入了数组（因此条件始终为真），并且重复的警告消息从未被显示，因为它在下一个被覆盖言。

Answer 2

您的条件始终为真，因为您将新值推送到Array（= last元素），然后将其与自身进行比较。然后，para无论如何都会被randomValue覆盖。这有效（除了-2的快速修复：

var btn = document.querySelector("button");
var para = document.querySelector(".paragraph");
var prevVal = document.querySelector(".prevVal");

var randomArray = [" Hello", " Hi", " How are you?", " How was your day?", " Tell me a joke.", " I am having a good day."];
var previousValueArray = [];

btn.addEventListener("click", function(){
  var randomValue = randomArray[Math.floor(Math.random() * randomArray.length)];

  //pushing value in previousValueArray
  previousValueArray.push(randomValue);
  if (previousValueArray.length === 6){
     previousValueArray.shift();
  }

  // randomValue just pushed to the array -> last element.
  // comparison with itself is always true, so use the element before that:
  // (may fail at beginning with empty Array)
  if (previousValueArray[previousValueArray.length - 2] === randomValue){
     para.textContent = "Sorry, but this was the previous value. Click again please.";
  }
  else{
    // don't overwrite
    para.textContent = randomValue;
  }

prevVal.textContent = previousValueArray;

});

Answer 3

这个问题有点宽泛。我假设你想从数组中获得一个独特的随机元素？

这样做：

1。定义所有可用元素的数组：

var array = ["Hi", "Hello", "Hey", "Whatever"];

注意我不会在单词的开头留下任何尾随空格。如果要填充，请使用CSS。

2. 创建一个可以滚动值的函数，然后将其从数组中删除：

function roll(a){
    if(a.length > 0){
        var i = Math.floor(Math.random() * a.length);
        var e = a[i];
        a.splice(i, 1);
        return e;
    }
    else return false;
}

3. 照常添加监听器：

var array = ["Hi..", "..."];
btn.addEventListener("click", function(){
    var text = roll(array);
    if(!text){
        // ran out of unique values
    }
    else paragraph.innerHTML = text;
});

Answer 4

if (previousValueArray[previousValueArray.length - 1] == randomValue){

PreviousValueArray和randomValue不会导致===（true），因为一个是数组而另一个是数字，但在这种情况下你必须使用==进行验证。

我的第二个条件有什么问题？

4 个答案: