需要从变量中获取/显示属性[关闭]

Question

我已经搜索过，但可能只是不明白，需要一个真实的人来帮助解释。我有一个生成以下变量的脚本：

var trackerResult = {
    "sessionId": "16zA06FJt5sp",
    "customerId": "16zA06FJt5so",
    "contact": {
        "firstName": "Bilbo",
        "lastName": "Baggins",
        "email": "bbshireguy@gmail.com"
    },
    "orders": [{
        "orderId": "16zA06FJt5ss",
        "number": 11512,
        "items": [{
            "price": 97,
            "productId": "16zA06FJt3of",
            "productName": "Main"
        }]
    }, {
        "orderId": "16zA06FJt5sw",
        "number": 11513,
        "items": [{
            "price": 49,
            "productId": "16zA06FJt3op",
            "productName": "Upsell"
        }]
    }],
    "demoMode": "1"
};

我需要能够简单地显示产品名称和价格。如果生成的脚本更简单一点，我可以做到，但据我所知，我正在查看的属性在技术上是孩子的孩子？

提前谢谢你。

Answer 1

trackerResult.orders.forEach( function ( order ) {
    order.items.forEach( function ( item ) {
        console.log( item.productName, item.price );
    });
});

（forEach 未在 IE8/7 中实现，因此您需要为这些浏览器使用 shim）

Answer 2

首先，获取该对象并添加一些空格，以便您可以实际看到发生了什么：

var trackerResult = {
    "sessionId":"16zA06FJt5sp",
    "customerId":"16zA06FJt5so",
    "contact":{
        "firstName":"Bilbo",
        "lastName":"Baggins",
        "email":"bbshireguy@gmail.com"
    },
    "orders":[
        {
            "orderId":"16zA06FJt5ss",
            "number":11512,
            "items":[
                {
                    "price":97,
                    "productId":"16zA06FJt3of",
                    "productName":"Main"
                }
            ]
        },
        {
            "orderId":"16zA06FJt5sw",
            "number":11513,
            "items":[
                {
                    "price":49,
                    "productId":"16zA06FJt3op",
                    "productName":"Upsell"
                }
            ]
        }
    ],
    "demoMode":"1"
}; 

现在，要获取产品名称和价格，您可以执行以下操作：

var orders = trackerResult.orders,
    ordercnt = orders.length,
    items, itemcnt, i, j,
    output = "";
for( i=0; i<ordercnt; i++) {
    output += "Order #"+orders[i].number+"\n==========\n";
    items = orders[i].items;
    itemcnt = items.length;
    for( j=0; j<itemcnt; j++) output += items[j].productName+" "+items[j].price;
    output += "\n";
}
// do something with "output";

Answer 3

首先，"contact" 后面缺少一个冒号“:”。

现在，在trackerResult 变量中，您感兴趣的字段是orders 数组。在orders 数组的每个成员中，都有一个items 数组。每件商品都包含名称和价格。

所以我们将在两个嵌套循环中遍历这两个字段。

var trackerResult = {"sessionId":"16zA06FJt5sp","customerId":"16zA06FJt5so","contact": {"firstName":"Bilbo","lastName":"Baggins","email":"bbshireguy@gmail.com"},"orders":[{"orderId":"16zA06FJt5ss","number":11512,"items":[{"price":97,"productId":"16zA06FJt3of","productName":"Main"}]},{"orderId":"16zA06FJt5sw","number":11513,"items":[{"price":49,"productId":"16zA06FJt3op","productName":"Upsell"}]}],"demoMode":"1"};

var result = '';

for (var i = 0; i < trackerResult.orders.length; i++) {
    for (var j = 0; j < trackerResult.orders[i].items.length; j++) {
        result += trackerResult.orders[i].items[j].productName + ': ' +  trackerResult.orders[i].items[j].price + '\n';
    }
}

alert(result);

Answer 4

首先，var 中有一个错误 - 它在 "contact" 之后缺少 :。解决这个问题可以让我们继续 :)

然后，一旦设置好，您需要遍历您的订单以查看所有产品及其价格。

for ( var i = 0, l = trackerResult.orders.length; i < l; i++ ) {
    var order = trackerResult.orders[i];
    for ( var j = 0, k = order.items.length; j < k; j++ ) {
        var item = order.items[j];

        // here are the values you need to do something with
        // so do something with them now!
        var productName = item.productName;
        var price = item.price;
        console.log( productName, price );
    }
}

不确定您要对这些产品做什么，但这会让您访问它们！

Answer 5

要访问，请说出您将使用的订单项：

trackerResult.orders[1].items[0].price
trackerResult.orders[1].items[0].productId
trackerResult.orders[1].items[0].productName

要将这些信息放到 HTML 页面上，您需要执行以下操作：

document.getElementById('price').innerHTML = trackerResult.orders[1].items[0].price;
document.getElementById('productId').innerHTML = trackerResult.orders[1].items[0].productId;
document.getElementById('productName').innerHTML = trackerResult.orders[1].items[0].productName;

您可以在此处查看示例：http://jsfiddle.net/tNmRW/1/

Answer 6

但据我了解，我正在查看的属性在技术上是子项的子项？

是的！你还有一个属性，它是一个数组。

要访问对象中的属性，只需编写以下代码：

alert(trackerResult.sessionId);

这是一个值类型属性。数字是值类型的另一个例子。

要访问子对象的属性，只需遵循相同的逻辑：

alert(trackerResult.contact.firstName);

这与第一个示例没有太大不同。您正在访问一个属性，该属性是一个包含它自己的属性的类型。您可以通过大括号 {} 来判断这一点。

最后一个例子是数组类型。访问这些有点不同。首先，您需要确定数组的大小。您可以通过访问所有数组可用的长度属性来做到这一点。

alert("There are " + trackerResult.orders.length + " order(s)!");

一旦你有了数组的长度，你就可以像这样使用 for 循环来遍历它们：

for(var x = 0; x < trackerResult.orders.length; x++)
    alert("Order number " + trackerResult.orders[x].number + " has " + trackerResult.orders[x].items.length + " items!");

您可以从那里创建另一个循环来遍历每个订单的项目。