javascript - 在 JavaScript foreach 中使用数组

Question

我有以下(简化的)php 函数，它可以为我计算总值。它基本上从 WordPress 数据库中获取一系列项目并检查每个项目的类型，然后将其值与特定的给定值进行比较，并将所有比较结果相加。

        function total(){ 
        $value1 = 10; // compare value for type 1 items
        $value1 = 20; // type 2 items
        $value1 = 30; // type 3 items
        $total = 0; // reset total variable

global $wpdb;
        $items = $wpdb->get_results("SELECT `item_type` as type, `item_value` as value FROM `table`"); // get all the items from database

        foreach ($items as $item) {

    // check which item type
        switch ($item->type) { 
          case 1:
         $total = $total + min($value1, $item->value);
            break;
          case 2:
          $total = $total + min($value2, $item->value);
            break;
          case 3:
         $total = $total + min($value3, $item->value);
            break;
        }}

        return $total;
        }

现在我想在 JavaScript 中重新制作相同的函数，这样我就可以在表单中使用它进行计算。这是我到目前为止所得到的；

<SCRIPT type="text/javascript">
 function calculate_total (){
    var items = <?php echo json_encode($items); ?>;
    var value1 = document.form.range1Input.value;
    var value2 = document.form.range2Input.value;
    var value3 = document.form.range3Input.value;

  for each (var item in items){
     switch (**(refer to item type in array)**) { 
          case 1:
         total = total + min(value1, **(refer to item value in array)**);
            break;
          case 2:
          total = total + min(value2, **(refer to item value in array)**);
            break;
          case 3:
         total = total + min(value3, **(refer to item value in array)**);
            break;
        }}

 document.form.total.value = total;
}
</script>

如何引用 items 数组中的值？我希望有人能给我一些建议。

我还看到 echo json_encode($items) 将数组格式化为 {"type":"3","value":"1.00"},{"type": "1","value":"20.50"} 等等，我想知道这是否是 javascript 的可用格式，因为当我尝试 total = items[1]; 我看到表单中的[Object Object]。

$items = $pdb->get_results() 顺便说一句，格式为 Array ( [0] => stdClass Object ( [type] => 1 [value] => 35.00 ) [1] => stdClass 对象 ( [type] => 3 [value] => 1.00 )

Answer 1

正如您推测的那样，您的第一个项目可以称为 items[0]，第二个项目可以称为 items[1]，依此类推。

因此，在您的 switch 语句中/在 for 循环中，其中 item 指的是当前索引(0、1、2 等)，您可以说 items[item] 来引用您当前在循环中查看的项目:首先它将等于 items[0]，然后是 items[1] ，等等。

因此，switch (items[item].type) { 应该就是您所需要的。

<小时/>

(JS 快速回顾:数组和对象在 JS 中是不同的东西，如果不确定，请查找差异。引用它们时，可以使用 myArray[0] 来获取内容来自数组，您可以使用 myObject['myKey'] 或 myObject.myKey 从对象中获取内容。在您的情况下，items 是一个数组，它的每个元素都是一个对象。因此，您可以执行 items[0]['type'] 或 items[0].type 访问第一个项目的类型)。

<小时/>

当您尝试时 items[1] 只是显示 [Object object] 的原因是浏览器不擅长在屏幕上显示对象 - 对象就在那里，JS也能看到，只是大部分对象打印为[Object object]。您最好显示 JSON.stringify(items[1]) 以将对象的 JSON 表示形式视为字符串。更好的是，尝试 console.log(items) 或 console.log(items[1]) 在浏览器的控制台中查看整个对象控制台 (您可以搜索如何调出浏览器控制台，每个浏览器/操作系统都有所不同，但它非常适合调试)。