JavaScript Foreach 数组中的值到字符串

Question

在 JS 中寻求帮助。我有一个数组的数组

var totalOrder = []
function CafeService(meal, starter, main, dessert){//takes value from text box input
var customerOrder = [meal, starter, main, dessert]

totalOrder.push(customerOrder ); 
}

这是正确填充的。可以有无限数量的订单。我想在发送到厨房之前检查订单。如何将数组中的每个索引放入字符串中，例如填充以下内容：

var mealTime;
var mealStarter;
var mealMain;
var mealDessert;

我希望我需要为每个执行此操作？

foreach (customerOrder in totalOrder){
    var mealTime; //how to populate
    var mealStarter;
    var mealMain;
    var mealDessert;
}

编辑一个客户订单的总订单：

var totalOrder = ["Breakfast","Coffee","Toast","Apple"]

Answer 1

您可以使用它们的索引简单地影响这些变量：

var totalOrder = [];

function CafeService(meal, starter, main, dessert) {
  var customerOrder = [meal, starter, main, dessert];
  totalOrder.push(customerOrder);
}

CafeService('1', 'Salad', 'Hamburger', 'Soda');
CafeService('1', 'Salad', 'Hamburger', 'Soda');
CafeService('1', 'Salad', 'Hamburger', 'Soda');

totalOrder.forEach(function (customerOrder) {
  var mealTime = customerOrder[0];
  var mealStarter = customerOrder[1];
  var mealMain = customerOrder[2];
  var mealDessert = customerOrder[3];
  
  console.log(mealTime, mealStarter, mealMain, mealDessert);
});

或者，如果你使用 ES6 语法，你可以使用destructuring assignment：

var totalOrder = [];

function CafeService(meal, starter, main, dessert) {
  var customerOrder = [meal, starter, main, dessert];
  totalOrder.push(customerOrder);
}

CafeService('1', 'Salad', 'Hamburger', 'Soda');
CafeService('1', 'Salad', 'Hamburger', 'Soda');
CafeService('1', 'Salad', 'Hamburger', 'Soda');

totalOrder.forEach(function (customerOrder) {
  var [mealTime, mealStarter, mealMain, mealDessert] = customerOrder;
  
  console.log(mealTime, mealStarter, mealMain, mealDessert);
});

注意我用.forEach 代替for...in 代替reasons；经典for-loop 也是一个有效选项。你可以在 ES6 中使用 for...of。

Answer 2

我会更改您的结构以使用对象而不是数组中的数组。你甚至可以创建一个constructor function 所以：

var totalOrder = [];

function Order(meal, starter, main, dessert)
{
   this.meal = meal;
   this.starter = starter;
   this.main = main;
   this.dessert = dessert;
}

function CafeService(meal, starter, main, dessert){//takes value from text box input

   totalOrder.push(new Order(meal, starter, main, dessert)); 
}

访问属性非常直观：

totalOrder.forEach(function (customerOrder) {
   customerOrder.meal;
   ...
}

Answer 3

如果我可以提出一个小建议：将膳食成分存储在一个对象中而不是一个数组中。然后，您可以简单地通过密钥访问它们。这将使您的代码更易于阅读，尤其是当它变得更大时，因为您不需要记住每个索引如何对应于餐的部分。 （即 customerOrder[1] 是首发）

例如：

var totalOrder = []
function CafeService(meal, starter, main, dessert){//takes value from text box input
    var customerOrder = {
      meal:meal,
      starter: starter,
      main: main,
      dessert: dessert
    }
    totalOrder.push(customerOrder ); 
}

CafeService("Dinner", "soup", "roast duck", "cake")
CafeService("Dinner", "Salad", "t-bone", "pudding")
CafeService("Breakfast", "Fruit", "Omlette", "muffin")

// Now just access by key and your code is self-documenting
totalOrder.forEach(function(order){
  console.log(order.meal)
  console.log(order.starter)
  // etc.
}) 

Answer 4

你可以拿一个物体来计算想要的物品。

function service(meal, starter, main, dessert) {
    totalOrder.push([meal, starter, main, dessert]);    
}

function getCount() {
    var count = { time: {}, starter: {}, main: {}, dessert: {} };
    totalOrder.forEach(function (a) {
        ['time', 'starter', 'main', 'dessert'].forEach(function (item, i) {
            if (a[i]) {
                count[item][a[i]] = (count[item][a[i]] || 0) + 1;
            }
        });
    });
    return count;
}

var totalOrder = [];

service('breakfast', 'coffee', 'toast', '');
service('breakfast', 'coffee', 'toast', 'apple');
service('lunch', 'soup', 'pizza', 'ice');
service('lunch', 'soup', 'pizza', 'cookie');
service('dinner', 'toast', 'spaghetti', 'banana');
service('dinner', '', 'pizza', 'banana');

console.log(getCount());

.as-console-wrapper { max-height: 100% !important; top: 0; }