如何將JavaScript函數儲存在佇列中並依序執行？
- 王林轉載
- 2023-08-24 18:05:02688瀏覽
有時，開發人員可能需要將函數儲存在佇列中，並按照儲存在佇列中的順序執行它。在JavaScript中，我們可以使用陣列來建立一個佇列。我們可以使用陣列的push()方法將函數入佇列，並使用shift()方法從佇列中出隊函數。
Below, we will see examples of storing JavaScript functions in the queue and executing them in the queue order.
Syntax
使用者可以依照下列語法將JavaScript函數儲存在佇列中，並且依序執行。
while (queue.length > 0) {
queue[0]();
queue.shift();
}
我們使用上述語法中的while迴圈來遍歷佇列。我們執行佇列中的第一個函數，然後將該函數從佇列中移除。
Example
在下面的範例中，我們建立了一個名為queue的變量，並用空數組初始化它，使其成為一個隊列。
After that, we created three different functions and used the push() method of the array to add all functions into the queue. Whenever users press the button, it calls the executeFunctions( we use the while loop to deque the function from the queue. In every iteration of the loop, we execute the first function from the array and use the array.shift() method to remove the first element from the array.
<html>
<body>
<h3>Using the array to add functions in Queue and execute functions in particular order</h3>
<div id = "content"> </div></br>
<button onclick = "executeFunctions()"> Execute function in queue order </button>
<script>
let content = document.getElementById("content");
// execute the functions in the order they are added to the queue
var queue = [];
function executeFunctions() {
while (queue.length > 0) {
queue[0]();
queue.shift();
}
}
function function1() {
content.innerHTML += "Function 1 executed <br>";
}
function function2() {
content.innerHTML += "Function 2 executed <br>";
}
function function3() {
content.innerHTML += "Function 3 executed <br>";
}
queue.push(function1);
queue.push(function2);
queue.push(function3);
</script>
</body>
</html>
Example
在下面的範例中，我們建立了一個數組，用作佇列，就像第一個範例一樣。之後，我們將sum()、sub()、mul()和div()函數加入佇列。
在executeFunctions()函數中，我們使用for迴圈來依照佇列順序呼叫所有函數。此外，我們也使用了call()方法從佇列中呼叫函數。
<html>
<body>
<h3>Using the array to add functions in Queue and execute functions in particular order</h3>
<div id = "content"> </div> </br>
<button onclick = "executeFunctions()"> Execute function in queue order </button>
<script>
let content = document.getElementById("content");
// execute the functions in the order they are added to the queue
var queue = [];
function executeFunctions() {
for (let i = 0; i < queue.length; i++) {
queue[i].call();
}
}
let a = 10;
let b = 5;
function sum() {
content.innerHTML += "Sum of " + a + " and " + b + " is " + (a + b);
}
function sub() {
content.innerHTML += "<br>Subtraction of " + a + " and " + b + " is " + (a - b);
}
function mul() {
content.innerHTML += "<br>Multiplication of " + a + " and " + b + " is " + (a * b);
}
function div() {
content.innerHTML += "<br>Division of " + a + " and " + b + " is " + (a / b);
}
queue.push(sum);
queue.push(sub);
queue.push(mul);
queue.push(div);
</script>
</body>
</html>
使用者學會了將函數儲存在佇列中，並按照佇列順序執行它們。在JavaScript中，沒有內建的佇列資料結構，但我們可以使用陣列作為佇列。
In the first example, we have used the shift() method to deque the queue. In the second example, we have used the for loop to execute the functions in order.
以上是如何將JavaScript函數儲存在佇列中並依序執行？的詳細內容。更多資訊請關注PHP中文網其他相關文章！