如何在$ .each(?

时间:2016-10-08 13:59:32

标签: javascript jquery arrays

我当前的代码将密钥推送到普通数组,但我想将键和值都推送到对象数组。如果专家告诉我如何做到这一点,我感激不尽。谢谢

创建对象数组的Javascript:

var xml ='<?xml version="1.0" encoding="UTF-8"?> <dict><key>ItemLists</key> <array><dict><key>id</key> <string>1</string> <key>name</key> <string>fruits</string> <key>category</key> <string>US Fruits</string> <key>categoryIcon</key> <string>http://www.somsite.com/categories/1.jpg</string> <key>country</key> <string>US</string> </dict> <dict><key>id</key> <string>2</string> <key>name</key> <string>Vegetable</string> <key>category</key> <string>Eu Vegetable</string> <key>categoryIcon</key> <string>http://www.somsite.com/categories/2.jpg</string> <key>country</key> <string>EU</string> </dict> </array> </dict>';

        xmlDoc = $.parseXML(xml),
        $xml = $(xmlDoc);

var MyArray=[];
$(xml).find("array key").each(function(){
    var key = $(this).text();
    var value = $(this).next().text();  
    console.log(key + "=" + value);
    //here  i want to create array of objects instead of normal array
    //and push both key and value to array of object
    MyArray.push(key);
});

我想要构造的对象数组示例:

var myArray = [{
    id: 1,
    name: 'fruits',
    category: 'US Fruits',
    categoryIcon: 'http://www.somsite.com/categories/1.jpg',
    country: 'US'
}, {
    id: 2,
    name: 'Vegetable',
    category: 'Eu Vegetable',
    categoryIcon: 'http://www.somsite.com/categories/2.jpg',
    country: 'EU'
}, ];

编辑: 我试图打印像这样的对象数组,但我没有为所有人定义 值:

$.each(MyArray,function(j, object){

var div = "<tr id=\""+j+"\">\n" +
    "<td>"+j+"</td>\n" +
    "<td><img src=\""+ object.categoryIcon +"\" height=\"42\" width=\"42\"></td>\n" +
    "<td>\n" +
    "<a href=\"javascript:doit('id=" + object.id + "&name=" + object.name + "&category=" + object.category + "&categoryIcon=" + object.categoryIcon + "','"+ object.country +"')\" onclick=\"selectLink(this);\">" + object.name + "</a><br> \n" +
    "<br></td></tr>\n\n";
 $("#myDiv").append(div);

});

2 个答案:

答案 0 :(得分:5)

如果你只是替换

MyArray.push(key);

var o = {};
o[key] = value;

MyArray.push(o);

它会这样做,但您似乎想要迭代每个dict,然后在父key等内获取每个dict的值。

&#13;
&#13;
var xml = '<?xml version="1.0" encoding="UTF-8"?> <dict><key>ItemLists</key> <array><dict><key>id</key> <string>1</string> <key>name</key> <string>fruits</string> <key>category</key> <string>US Fruits</string> <key>categoryIcon</key> <string>http://www.somsite.com/categories/1.jpg</string> <key>country</key> <string>US</string> </dict> <dict><key>id</key> <string>2</string> <key>name</key> <string>Vegetable</string> <key>category</key> <string>Eu Vegetable</string> <key>categoryIcon</key> <string>http://www.somsite.com/categories/2.jpg</string> <key>country</key> <string>EU</string> </dict> </array> </dict>';

var xmlDoc = $.parseXML(xml),
    $xml = $(xmlDoc);

var MyArray = [];
$(xml).find("array dict").each(function(_,elem) {
	var o = {};
	$('key', elem).each(function() {
        var key = $(this).text();
        var value = $(this).next().text();
        o[key] = value;
    });
    MyArray.push(o);
});
console.log(MyArray)
&#13;
.as-console-wrapper {top:0; min-height:100%!important}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
&#13;
&#13;
&#13;

另外,您可以使用map()reduce()

var MyArray = $(xml).find("array dict").map(function(_,elem) {
    return $('key', elem).toArray().reduce(function(a,b) {
        return a[$(b).text()] = $(b).next().text(), a;
    }, {});
}).get();

答案 1 :(得分:1)

在收集不同的对象时,实际上应该有两个循环:一个用于收集一个dict的对象属性,另一个用于将这些对象收集到一个数组中:

var myArray=[];
$(xml).find("array dict").each(function(){
    var obj = {};
    $(this).find("key").each(function () {
        var key = $(this).text();
        var value = $(this).next().text();  
        console.log(key + "=" + value);
        obj[key] = value;
    });
    myArray.push(obj);
});

使用ES6,您可以将其缩短为以下代码:

var myArray = $(xmlDoc).find("array dict").get().map( dict =>
    $(dict).find("key").get().reduce( (obj, el) =>
        Object.assign(obj, { [$(el).text()]: $(el).next().text() }), {}));

&#13;
&#13;
var xml ='<?xml version="1.0" encoding="UTF-8"?> <dict><key>ItemLists</key> <array><dict><key>id</key> <string>1</string> <key>name</key> <string>fruits</string> <key>category</key> <string>US Fruits</string> <key>categoryIcon</key> <string>http://www.somsite.com/categories/1.jpg</string> <key>country</key> <string>US</string> </dict> <dict><key>id</key> <string>2</string> <key>name</key> <string>Vegetable</string> <key>category</key> <string>Eu Vegetable</string> <key>categoryIcon</key> <string>http://www.somsite.com/categories/2.jpg</string> <key>country</key> <string>EU</string> </dict> </array> </dict>';

var xmlDoc = $.parseXML(xml);

var myArray = $(xmlDoc).find("array dict").get().map( dict =>
    $(dict).find("key").get().reduce( (obj, el) =>
        Object.assign(obj, { [$(el).text()]: $(el).next().text() }), {}));

console.log(myArray);
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
&#13;
&#13;
&#13;