while(true)循环如何影响函数

Question

我正试图为一项任务构建一个库存管理系统，我很难理解这个While(true(循环如何不会"阻塞"函数中的其余代码。

出于分配的目的，所有内容都应该显示在控制台中。

问题出在main((中；作用当我运行代码时，提示会按预期显示，但当输入输入时，控制台中不会显示任何内容，直到我在提示中输入"exit"，也就是循环应该中断的时候。

感谢您的帮助。

以下是迄今为止分配的代码，

function displayMenu() {
window.console.log("The Inventory Management App");
window.console.log("");
window.console.log("COMMAND MENU");
window.console.log("view - View all products");
window.console.log("update - Update Products");
window.console.log("del - Delete employee");
window.console.log("exit - Exit the application");
}
function view(chingaderas){ 
"use strict";
var i = 1;
chingaderas.forEach(function (thing) {
window.console.log(String(i) + ". " + thing);
i += 1;
});
window.console.log("");
}

function update(chingaderas) { // need to find out how to update a specific part of 2 dimensional array 
"use strict";
var sku = window.prompt("Enter the SKU# of the item you would like to update");
var changeMade = false;
for (var i = 0; i < chingaderas.length; i++) { 
if (sku == chingaderas[i][0]) {
var currentStock = window.prompt("How many " + chingaderas[i][1] + " are in stock?");
changeMade = true;
if (isNaN(currentStock)) {
window.alert("Invalid entry");
update(chingaderas);
} else {
chingaderas[i][2] = parseInt(currentStock);
window.console.log("The new inventory of " + chingaderas[i][1] + "is now " + chingaderas[i][2]);
}
} else if (sku == null) {
break
}
}
if (changeMade == false & sku != null) {
window.alert("Sku number not found")
update(chingaderas);
}
}
var inventory = [
[2233, "Hat",    12, "$14.99"],
[3223, "Socks",  36, "$9.99"],
[4824, "Shirt",  10, "$15.99"],
[6343, "Jeans",  22, "$39.99"],
[9382, "Jacket", 5,  "$49.99"],
];
var main = function () {
window.console.log("say something")

let command; 
displayMenu();
while (true) {
command = window.prompt("What would you like to do? (view, update, exit)");
if (command == "view") { // if to view inventory
view(inventory); 
} else if (command == "update") { // to run the update function 
update(inventory); 
} else if (command == "exit"){ // to exit the program 
break; 
} 
else {
window.document.write("invalid entry"); 
}


}
window.console.log("Program has ended"); 
}
main();

Answer 1

您需要给浏览器时间来显示新信息。prompt和while(true)块-它们不允许当前选项卡执行任何操作，直到prompt完成并且循环完全完成。

您可能让main在setTimeout之后递归地调用自己，这样就有机会呈现：

var main = function() {
window.console.log("say something")
let command;
displayMenu();
command = window.prompt("What would you like to do? (view, update, exit)");
if (command == "view") { // if to view inventory
view(inventory);
} else if (command == "update") { // to run the update function 
update(inventory);
} else if (command == "exit") { // to exit the program 
window.console.log("Program has ended");
return;
} else {
window.document.write("invalid entry");
}
setTimeout(main);
}

function displayMenu() {
window.console.log("The Inventory Management App");
window.console.log("");
window.console.log("COMMAND MENU");
window.console.log("view - View all products");
window.console.log("update - Update Products");
window.console.log("del - Delete employee");
window.console.log("exit - Exit the application");
}
function view(chingaderas) {
"use strict";
var i = 1;
chingaderas.forEach(function(thing) {
window.console.log(String(i) + ". " + thing);
i += 1;
});
window.console.log("");
}
function update(chingaderas) { // need to find out how to update a specific part of 2 dimensional array 
"use strict";
var sku = window.prompt("Enter the SKU# of the item you would like to update");
var changeMade = false;
for (var i = 0; i < chingaderas.length; i++) {
if (sku == chingaderas[i][0]) {
var currentStock = window.prompt("How many " + chingaderas[i][1] + " are in stock?");
changeMade = true;
if (isNaN(currentStock)) {
window.alert("Invalid entry");
update(chingaderas);
} else {
chingaderas[i][2] = parseInt(currentStock);
window.console.log("The new inventory of " + chingaderas[i][1] + "is now " + chingaderas[i][2]);
}
} else if (sku == null) {
break
}
}
if (changeMade == false & sku != null) {
window.alert("Sku number not found")
update(chingaderas);
}
}
var inventory = [
[2233, "Hat", 12, "$14.99"],
[3223, "Socks", 36, "$9.99"],
[4824, "Shirt", 10, "$15.99"],
[6343, "Jeans", 22, "$39.99"],
[9382, "Jacket", 5, "$49.99"],
];
var main = function() {
window.console.log("say something")
let command;
displayMenu();
command = window.prompt("What would you like to do? (view, update, exit)");
if (command == "view") { // if to view inventory
view(inventory);
} else if (command == "update") { // to run the update function 
update(inventory);
} else if (command == "exit") { // to exit the program 
window.console.log("Program has ended");
return;
} else {
window.document.write("invalid entry");
}
setTimeout(main);
}
main();

如果可能的话，最好完全避免prompt，因为它对用户非常不友好，并且阻止了渲染和与页面的交互——考虑在页面上创建一个输入框和一个按钮。