Селекторы jquery для простых объектов javascript вместо элементов DOM

Question

Я только начал использовать jquery, и мне действительно нравится использовать селекторы. Мне приходит в голову, что идиома была бы очень хорошим способом пройтись по деревьям объектов (например, результаты запроса JSON). Например, если у меня есть такой объект:

var obj = { 'foo': 1, 'bar': 2,
            'child': { 'baz': [3, 4, 5] }
          };

Я бы хотел написать что-то вроде $ ('child baz: last', obj) и получить 5. Я понимаю, что цепочка не будет работать, но я все равно хотел бы оператор выбора. Кто-нибудь знает, существует ли такой зверь, или какой самый простой способ написать его?

Answer 1

Вот реализация концепции для того, чтобы заставить сам jQuery работать над объектами. С помощью обёртки объекта (FakeNode) вы можете обмануть jQuery, используя встроенный механизм выбора (Sizzle) для простых объектов JavaScript:

function FakeNode(obj, name, parent) {
    this.obj = obj;
    this.nodeName = name;
    this.nodeType = name ? 1 : 9; // element or document
    this.parentNode = parent;
}

FakeNode.prototype = {
    documentElement: { nodeName: "fake" },

    getElementsByTagName: function (tagName) {
        var nodes = [];

        for (var p in this.obj) {
            var node = new FakeNode(this.obj[p], p, this);

            if (p === tagName) {
                nodes.push(node);
            }

            Array.prototype.push.apply(nodes,
                node.getElementsByTagName(tagName));
        }

        return nodes;
    }
};

function $$(sel, context) {
    return $(sel, new FakeNode(context));
}

И использование будет:

var obj = {
    foo: 1,
    bar: 2,
    child: {
        baz: [ 3, 4, 5 ],
        bar: {
            bar: 3
        }
    }
};

function test(selector) {
    document.write("Selector: " + selector + "<br>");

    $$(selector, obj).each(function () {
        document.write("- Found: " + this.obj + "<br>");
    });
}

test("child baz");
test("bar");

Предоставление вывода:

Selector: child baz
- Found: 3,4,5
Selector: bar
- Found: 2
- Found: [object Object]
- Found: 3

Конечно, вам придется реализовать намного больше, чем выше, чтобы поддерживать более сложные селекторы.

Кстати, вы видели jLinq ?

Answer 2

Самый простой и легкий способ - обернуть элемент с помощью jquery, а затем зациклить его на каждом

var obj = { 'foo': 1, 'bar': 2,
        'child': { 'baz': [3, 4, 5] }
      };

$(obj).each(function(){
console.log(this);
if(this.hasOwnProperty('foo'))
{
    console.log("hey i found " + this.foo ); 
}
});

Answer 3

Ну, я бы лично сказал, что чистый доступ к объектам выглядит лучше, чем jQuery-подобные запросы. Одна вещь, которая была бы хороша, была бы нарезкой и другими методами фильтрации.

Если вы действительно хотите поиграть с запросами доступа к объектам, следующие возможности (подумайте XPath):

var obj = {
    foo: 1,
    bar: 2,
    child: {
        foo: {
            baz: [3, {a: 1}, {a: 2, b: 3}]},
        bar: {
            baz: [42, {a: 123}, {a: -1}]},
        baz: null}};

// Implicitly start in the Global object, unless a context is provided.
// Keys in JavaScript objects are essentially stored in order (not valid for
// *all* flavors, but it's close to standard. So you could do slicing on keys.)

// Selects (does not return them)
// obj.child.foo.baz[1].a
// obj.child.foo.baz[2].a
// obj.child.bar.baz[1].a
// obj.child.bar.baz[2].a
// Then performs an aggregate that returns value 125.
$('obj.child[:2].baz[1:].a').sum()

// Selects obj.foo, obj.bar, obj.child.foo.baz[0] and obj.child.bar.baz[0]
$('obj *[typeof(number)]')

// Selects obj.foo and obj.child.foo
$('obj foo')

// Other possible methods: delete(), set(), get() (as an array of values),
// min(), max(), avg(), merge() etc etc.

В конце концов, я не вижу, как это очень полезно. Но это идея, я думаю =)

Answer 4

У объекта массива есть несколько методов, которые вы можете использовать:

last = obj.child.baz.slice(-1)[0];

Некоторые другие примеры:

first = obj.child.baz.slice(0,1)[0];
allExceptFirst = obj.child.baz.slice(1);
allExceptLast = obj.child.baz.(0,-1);