javascript - 使用 setTimeout 打破长时间运行的功能以允许事件处理

Question

我必须找到一种方法来实现一个函数，该函数接受输入数字并返回/显示最接近的较小素数或输入本身(如果它是素数)。

但是，输入可能是一个非常大的数字，在这种情况下，内部函数会阻塞事件循环，我必须确保浏览器能够在计算期间处理事件。

我的实现是这样的:

function getClosestPrime(num) {
    return isPrime(num) ? num : getClosestPrime(num-1);
}

function isPrime(num) {
  for (let i = 2; i < num; i++) {
    if(num % i === 0) return false;
    }
  return num !== 1;
}

有人可以帮助我实现并给我解释/提示以供将来引用吗？

提前致谢。

Answer 1

因为 JavaScript 是单线程的，所以最好的解决方案是获得第二个线程来为您解决问题。这可以通过使用 Web Workers API 来实现.

有了网络 worker ，您的客户端算法很简单:

• 创建一个 worker 。
• 当我们希望它计算素数时，给它发送一条消息。
• 监听名为“done”的消息，这表明工作人员已完成。

客户端代码:

// create the worker
var primeWorker = new Worker('calculate-prime.js');

function doPrimeComputationInWorker(number) {

  function handleWorkerCompletion(message) {
    if (message.data.command == 'done') {
      // update UI using the 'primeNumber' value received in the message 
      console.log(message.data.primeNumber);
      // remove the event listener
      primeWorker.removeEventListener('message', handleWorkerCompletion);
    }
  }

  // add the event listener
  primeWorker.addEventListener('message', handleWorkerCompletion, false);

  // post the number to the worker
  primeWorker.postMessage({
    'number': number
  });
}

代码应该足够简单，您只需更改工作人员完成时更新 UI 的代码即可。

现在您需要网络 worker 代码。这是 calculate-prime.js 的框架:

// add the event listener
self.addEventListener('message', start);

function start(message) {
  // get the number value from the message
  var number = message.data.number;

  // perform the calculation
  var nearestPrime = calculateNearestPrime(number);

  // return the result
  self.postMessage({
    'command': 'done',
    'primeNumber': nearestPrime
  });
}

function calculateNearestPrime(number) {
  // your implementation goes here
  // return the result
  return result;
}

我会把质数的计算留给你，但是 Sieve of Eratosthenes很容易实现，如果您不想自己编写代码，您可以在网上找到 JavaScript 实现。你可以使用 Web Storage API保存生成的素数列表并加速 future 的计算。

为了将来引用，您应该了解 Promises和 Generators这样您就可以使用它们来解决您的异步问题。