1. ホーム
  2. javascript

[解決済み] JavaScript のネストしたオブジェクトや配列に文字列パスでアクセスする

2022-03-17 19:52:23

質問

私はこのようなデータ構造を持っています。

var someObject = {
    'part1' : {
        'name': 'Part 1',
        'size': '20',
        'qty' : '50'
    },
    'part2' : {
        'name': 'Part 2',
        'size': '15',
        'qty' : '60'
    },
    'part3' : [
        {
            'name': 'Part 3A',
            'size': '10',
            'qty' : '20'
        }, {
            'name': 'Part 3B',
            'size': '5',
            'qty' : '20'
        }, {
            'name': 'Part 3C',
            'size': '7.5',
            'qty' : '20'
        }
    ]
};

そして、これらの変数を使用してデータにアクセスしたいと思います。

var part1name = "part1.name";
var part2quantity = "part2.qty";
var part3name1 = "part3[0].name";

part1nameには someObject.part1.name の値、つまり "パート1" です。part2quantity の値も同様で、60 で埋め尽くされています。

純粋なjavascriptまたはJQueryのどちらかでこれを実現する方法はありますか?

どのように解決するのですか?

すでに持っている類似のコードを元に作ったところ、うまくいったようです。

Object.byString = function(o, s) {
    s = s.replace(/\[(\w+)\]/g, '.$1'); // convert indexes to properties
    s = s.replace(/^\./, '');           // strip a leading dot
    var a = s.split('.');
    for (var i = 0, n = a.length; i < n; ++i) {
        var k = a[i];
        if (k in o) {
            o = o[k];
        } else {
            return;
        }
    }
    return o;
}

使用方法:。

Object.byString(someObj, 'part3[0].name');

動作するデモを見るには http://jsfiddle.net/alnitak/hEsys/

EDIT このコードで、左端のインデックスがオブジェクト内の正しくネストされたエントリに対応していない文字列を渡されると、エラーが発生することに気づいた人がいました。 これは正しい懸念ですが、私としては、このような場合は try / catch を黙って返すのではなく、呼び出し時にブロックを作成します。 undefined が無効なインデックスであった場合