javascript - 随机数组不会更新

Question

我正在编写代码，其中数组中有多个操作。

var randomStringsWriting = [
'Write about ' + randomObjectsPlural,
'Think about ' + randomObjectsPlural,
'Love ' + randomObjectsPlural

“randomObjectsPlural”变量是另一个带有名词的数组

var randomObjectsPluralList = [
'cats',
'dogs',
'people',
]

为了让我更容易编写一个变量而不是方程，我一开始就设置了这个(请注意，这是初始数组中的变量，而不是“randomObjectsPluralList”)

 var randomObjectsPlural = randomObjectsPluralList[0]

我希望每次点击时文本都会更新，所以我编写了这个函数:

$("#screen" ).click(function(){
randomObjectsPlural =  randomObjectsPluralList[Math.floor(Math.random()*randomObjectsPluralList.length)];
});

奇怪的是，当我单击随机化时，尽管单击随机化，但仍保留相同的“randomObjectsPlural”变量。例如，屏幕最终会显示...

Write about cats
Think about cats
Love cats

...当我想要更像的东西时

Write about cats
Think about people
Love dogs

名词改变的唯一方法是刷新页面。这里究竟发生了什么？

Answer 1

我不确定您是如何将所有这些连接起来的，但是当您单击时，您必须一次又一次地随机化每个项目。

到目前为止您所显示的内容表明您仅在开始时设置了 randomStringsWriting 数组，因此您仅在页面加载时更新它。

您还将每个项目设置为randomObjectsPlural，但似乎您只设置了变量。您需要为每个对象随机化一个新的 randomObjectsPlural。

同样，因为我不知道您实际上是如何将其全部连接起来的，下面是一个演示来实现您正在寻找的东西。

下面是一个例子。您仍然需要采用逻辑并将其调整到您自己的实现中。

假设以下 HTML:

<button id="screen">Click</button>
<div id="output"></div>

下面的 JavaScript 就可以实现这个目的:

var getRandomListItem = function () {
    return randomObjectsPluralList[Math.floor(Math.random() * randomObjectsPluralList.length)]
};

var randomObjectsPluralList = [
    'cats',
    'dogs',
    'people']

$("#screen").click(function () {
    var randomStringsWriting = [
    'Write about ' + getRandomListItem(),
    'Think about ' + getRandomListItem(),
    'Love ' + getRandomListItem()]

    $('#output').html(randomStringsWriting.join('<br />'));
});

<小时/>

DEMO - 随机化字符串值

<小时/>

由于您只是从可能的 3 个随机值中选择一个随机值，因此您很可能仍然得到所有 3 个相同的随机值。

如果你想要随机+不同，那么你还需要跟踪已经选择的每个值，直到所有值都被选择，然后重新设置跟踪器，但这是一个稍微复杂的过程。