Question

我希望下面的函数 tim 每500毫秒从Array获得一条不断变化的路径。相反，在我的JS控制台中，我收到以下重复错误：

VM5550：1未捕获的SyntaxError：意外的输入结束

这里发生了什么，我需要做些什么来获得我正在寻找的结果？

我的代码：

var Array = ["http://files.parsetfss.com/9.png", 
"http://files.parsetfss.com/5.png",
"http://files.parsetfss.com/6.png",
"http://files.parsetfss.com/7.png",
"http://files.parsetfss.com/8.png"];

var sampl = _.first(_.sample(Array, 1));
var tim = setInterval(sampl, 500);

我还尝试将示例包装在如下函数中：

var sampl = function(){return _.first(_.sample(Array, 1))};

我仍然没有得到理想的结果，但现在我得到的结果一直是7或11（在重新屏幕多次之后。

Answer 1

首先，您绝对应该将var的名称更改为其他内容，而不是覆盖Array对象。

接下来，_.first似乎没必要。 1的样本返回一个字符串。

运行代码段以查看所需的效果。

var arr = [
  "http://files.parsetfss.com/9.png", 
  "http://files.parsetfss.com/5.png",
  "http://files.parsetfss.com/6.png",
  "http://files.parsetfss.com/7.png",
  "http://files.parsetfss.com/8.png"
];

var tim = setInterval( function() {
  document.body.innerHTML = _.sample(arr);
}, 500);

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/3.10.0/lodash.js"></script>

Answer 2

您需要将一个函数传递给setInterval，而您通过下划线的first和sample方法（通过下划线）运行数组的结果将其传递给它在你的情况下是一个字符串）。正如@Tony指出的那样，first的使用是不必要的，因为sample方法的第二个参数指定了您期望的结果数量（请参阅documentation）。

以下是我认为您正在寻找的内容：

var array = ["http://files.parsetfss.com/9.png", 
"http://files.parsetfss.com/5.png",
"http://files.parsetfss.com/6.png",
"http://files.parsetfss.com/7.png",
"http://files.parsetfss.com/8.png"];

function getRandom() {
    return _.sample(array, 1)[0];
} 

function showRandom() {
    console.log(getRandom());
}

// setInterval returns a pointer to the interval ...
var interval = setInterval(showRandom, 500);

// ... which you can use to stop it
//clearInterval(interval);

Answer 3

您可以使用此函数从数组中获取随机元素：

var url = getRandomeEle(array);

function getRandomEle(arr) {
   return arr[~~(Math.random()*arr.length)];
}

Answer 4

已经有了很好的答案，我同意Tony的观点，你确实应该更改变量名Array。

我认为您希望在某些时候停止此间隔，在这种情况下您需要拨打clearInterval。

这是一个快速DEMO。

<强>的script.js

var intervalId,

    startButton = document.getElementById('start'),
    stopButton  = document.getElementById('stop'),

    urls = [
      "http://files.parsetfss.com/9.png", 
      "http://files.parsetfss.com/5.png",
      "http://files.parsetfss.com/6.png",
      "http://files.parsetfss.com/7.png",
      "http://files.parsetfss.com/8.png"
    ];

startButton.addEventListener('click', tim, false);
stopButton.addEventListener('click', stopTim, false);


function tim() {
  intervalId = setInterval(printRandomUrl, 500);
}

function stopTim(){
  clearInterval(intervalId)
}

function printRandomUrl(){
  console.log(_.sample(urls));
}

<强>的index.html

<!DOCTYPE html>
<html>

  <head>
    <meta charset="utf-8" />
    <title></title>
    <link rel="stylesheet" href="style.css" />
    <script data-require="jquery" data-semver="2.1.4" src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
    <script data-require="lodash.js@3.8.0" data-semver="3.8.0" src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/3.8.0/lodash.js"></script>

  </head>

  <body>
    <h1>Basic plunk!</h1>
     <button id="start">Start</button>
     <button id="stop">Stop</button>

     <script src="script.js"></script>
  </body>

</html>

如何使用javascript在一段时间间隔内从数组中获取随机结果？

4 个答案: