Benennen Sie die Eigenschaftsnamen um und ändern Sie die Werte mehrerer Objekte.

Question

Im folgenden Objekt möchte ich den Eigenschaftsnamen thumb in thumbnail ändern. Ich möchte auch die Werte des title ändern, um <span> Tags einzuschließen.

Hier ist mein Ziel:

var data = [{ 
    thumb: '/images/01.png', 
    title: 'My title', 
},{ 
    thumb: '/images/02.png', 
    title: 'My title', 
},{ 
    thumb: '/images/03.png', 
    title: 'My title', 
}]; 

hier ist, wie ich es sehen möchten:

var data = [{ 
    thumbnail: '/images/01.png', 
    title: '<span class="red">title 1</span>', 
},{ 
    thumbnail: '/images/02.png', 
    title: '<span class="red">title 2</span>', 
},{ 
    thumbnail: '/images/03.png', 
    title: '<span class="red">title 3</span>', 
}]; 

Hier ist, was habe ich versucht habe, die nicht funktioniert:

var i=0, count=data.length; 
    for (i=0;i<=count;i++){ 
    data[i].thumbnail=data[i].thumb; 
    data[i].title="<span class='red'>"+data[i].title+"<span>"; 
    } 

Answer 1

Dies scheint den Trick zu tun:

function changeData(data){ 
    var title; 
    for(var i = 0; i < data.length; i++){ 
     if(data[i].hasOwnProperty("thumb")){ 
      data[i]["thumbnail"] = data[i]["thumb"]; 
      delete data[i]["thumb"]; 
     } 

     if(data[i].hasOwnProperty("title")){ //added missing closing parenthesis 
      title = data[i].title; 
      data[i].title = '<span class="red">' + title + '</span>'; 
     } 
    } 
} 

changeData(data); 

EDIT:

Ich habe versucht, die Funktion generisch zu machen, aber da Sie Ihre Antwort aktualisiert ganz bestimmte Dinge zu tun, ich habe die Geschäftslogik auf die Funktion hinzugefügt.

Answer 2

Sie können iterate over the array, stellen Sie eine neue Eigenschaft in jedem Objekt und delete die alte Immobilie:

data.forEach(function(e) { 
    e.thumbnail = e.thumb; 
    delete e.thumb;  
}); 

hier ein working example (überprüfen Sie die Ausgabe in der Konsole).

Offensichtlich wollen Sie ein Polyfill für Array.prototype.forEach verwenden, wenn Sie ältere Browser unterstützen möchten (es gibt einen im MDN-Artikel, mit dem ich oben verlinkt habe, oder Sie könnten einfach eine normale for-Schleife verwenden).

Answer 3

Ich habe eine nette Funktion erstellt Eigenschaften Namen umbenennen: https://github.com/meni181818/simpleCloneJS/blob/master/renameProperties.js

Beispiel:

var sourceObj = { 
    foo: 'this is foo', 
    bar: {baz: 'this is baz', 
      qux: 'this is qux'} 
}; 
//        the source, rename list 
var replacedObj = renameProperties(sourceObj, {foo: 'foooo', qux: 'quxxxx'}); 
// replacedObj output => { 
     foooo: 'this is foo', 
     bar: {baz: 'this is baz', 
       quxxxx: 'this is qux'} 
    }; 

Da Sie Jquery verwenden Sie $.each Funktion in dieser Funktion verwenden:

function renameProperties(sourceObj, replaceList, destObj) { 
    destObj = destObj || {}; 
    $.each(sourceObj, function(key) { 
     if(sourceObj.hasOwnProperty(key)) { 
      if(sourceObj[key] instanceof Array) { 
       if(replaceList[key]) { 
        var newName = replaceList[key]; 
        destObj[newName] = []; 
        renameProperties(sourceObj[key], replaceList, destObj[newName]); 
       } else if(!replaceList[key]) { 
        destObj[key] = []; 
        renameProperties(sourceObj[key], replaceList, destObj[key]); 
       } 
      } else if(typeof sourceObj[key] === 'object') { 
       if(replaceList[key]) { 
        var newName = replaceList[key]; 
        destObj[newName] = {}; 
        renameProperties(sourceObj[key], replaceList, destObj[newName]); 
       } else if(!replaceList[key]) { 
        destObj[key] = {}; 
        renameProperties(sourceObj[key], replaceList, destObj[key]); 
       } 
      } else { 
       if(replaceList[key]) { 
        var newName = replaceList[key]; 
        destObj[newName] = sourceObj[key]; 
       } else if(!replaceList[key]) { 
        destObj[key] = sourceObj[key]; 
       } 
      } 
     } 
    }); 
    return destObj; 
} 

demo: http://jsfiddle.net/g2jzse5k/