JSFiddle - React, Tailwind, and code Playground

by lookitstony

HTML

<ul id="results"></ul>

JavaScript

var model = {
    '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 getProp = function (obj, str) {
    var pt = str.split('.');
    var cv = obj;
    for (var p in pt) {
        var v = cv ? cv[pt[p]] : null;
        console.log(pt[p]);
        cv = v || v===0 ? v : null;
        if (!cv) break;
    }

    return cv;
}

var propArray = [
    "part1.name",
    "part2.qty",
    "part3[0].name"]

for (var p in propArray) {
    var value = getProp(model, propArray[p]);
    $('#results').append('<li>' + value + '</li>');
}