9

thumb以下のオブジェクトでは、プロパティ名、、をに変更したいと思いますthumbnail。また、タグtitleを含めるためにの値を変更したいと思います。<span>

これが私のオブジェクトです：

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

これが私がそれをどのように見せたいかです：

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>',
}];

これが私が試したものですが、うまくいきません：

 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>";
   }
4

3 に答える 3

21

これはトリックを行うようです：

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);

編集：

関数をジェネリックにしようとしましたが、非常に具体的なことを行うように回答を更新したので、関数にビジネスロジックを追加しました。

于 2012-05-30T15:57:26.390 に答える
10

配列を反復処理し、各オブジェクトに新しいプロパティを設定しdelete、古いプロパティを設定できます。

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

これが実際の例です（コンソールの出力を確認してください）。

明らかに、古いブラウザをサポートしたい場合は、ポリフィルを使用することをお勧めします（上記でリンクしたMDNの記事にポリフィルがあります。または、通常のループArray.prototype.forEachを使用することもできます）。for

于 2012-05-30T15:57:36.640 に答える
2

プロパティ名の名前を変更するための優れた関数を作成しました：https ：//github.com/meni181818/simpleCloneJS/blob/master/renameProperties.js

例：

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'}
    };

Jqueryを使用しているので、$.eachこの関数内で関数を使用できます。

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;
}

デモ： http： //jsfiddle.net/g2jzse5k/

于 2014-08-10T18:59:56.727 に答える