Как получить полный путь до значения в объекте JavaScript?

Question

[VasilievAleksey]

Есть объект:

{
    MainService: [
        {
            Id: "733",
            Name: "service",
            MainService: [
                {
                    Id: "238",
                    Name: "service 1",
                    Service: [
                        {
                            Id: "145",
                            Name: "Service 2"
                        }
                    ]
                }
            ]
        }
    ]
}

необходимо получить путь вида:

MainService.0.MainService.0.Service.0.id (Если не ошибаюсь то путь должен быть таким.)

До сервиса

Id: "145",
 Name: "Service 2"

пробовал делать через рекурсию

function recur(branch, str) {
    var str = str || '',
        item;
    for (item in branch) {
        console.log(item)
        if (typeof(branch[item]) === 'object') { 
            str += item;
            str = recur(branch[item], str);
        } else {
            str += item;
        }
    }
    return str;
}

Но тут все выходит в какую то кашу.

Буду очень благодарен за любую попытку помощи.

Comments

[Илья Шатохин]

Неправильная проверка на объект, null тоже вернет 'object'.

[Илья Шатохин]

И еще: "var str" затрет "str" из arguments, уберите там var.

[VasilievAleksey]

Илья Шатохин: Спасибо за замечание, но это не решает основной проблемы, я лишь показал свои попытки. Мне необходимо получить все возможные пути (keys) в выстроенном порядке по иерархии.

Answer 1

[Илья Шатохин]

var isArray = Array.isArray || function (arr) {
  return Object.prototype.toString.call(arr) === "[object Array]";
}

var isObject = function (obj) {
  return Object.prototype.toString.call(obj) === "[object Object]";
}

function three (tr) {
  var paths = [];

  function findPath(branch, str) {
    Object.keys(branch).forEach(function (key) {
      if (isArray(branch[key]) || isObject(branch[key]))
        findPath(branch[key], str ? str + "." + key : key);
      else
        paths.push(str ? str + "." + key : key);
    });    
  }

  findPath(tr, "");
  return paths;
}

Вернет от вашего объекта такое:

[
  "MainService.0.Id", 
  "MainService.0.Name", 
  "MainService.0.MainService.0.Id", 
  "MainService.0.MainService.0.Name", 
  "MainService.0.MainService.0.Service.0.Id", 
  "MainService.0.MainService.0.Service.0.Name"
]

Comments

[Евгений Петров]

А чего не isPrototypeOf()?

[Илья Шатохин]

Евгений Петров: где? :)

[Евгений Петров]

Array.prototype.isPrototypeOf(arr)

[Илья Шатохин]

Евгений Петров:

Object.prototype.isPrototypeOf(new String("a")) ----> true
Object.prototype.isPrototypeOf(new RegExp("/")) ----> true
Object.prototype.isPrototypeOf(new Number(1)) ----> true

var ar = Object.create(Array);
Array.prototype.isPrototypeOf(ar) ----> true
ar. test = 1;
JSON.stringify(a); ----- > "{"test":1}"

Проверить настоящий тип в JS можно только через Object.prototype.toString.call :)

[Евгений Петров]

Я тебе только про Array написал:)

[Илья Шатохин]

Евгений Петров:
Да, это еще нужно из-за совместимости с:
Array.isArray(ar) ---> false

[Илья Шатохин]

Евгений Петров: Там и есть про Array, прочти внимательней с "ar" :)

[Евгений Петров]

Илья Шатохин: Ну это несерьёзно:) Ты же понимаешь, что массиву, как и прочим объектам можно назначить любое свойство. Массив при этом останется массивом.
Ну а что Object заявит свои права на всё, на что только возможно — это факт, да.

[Илья Шатохин]

Евгений Петров: Object.create(Array) не является массивом, давай объясню на пальцах :)

var ar1 = [];
var ar2 = Object.create(Array);

Array.prototype.isPrototypeOf(ar1) ----> true
Array.prototype.isPrototypeOf(ar2) ----> true

Array.isArray(ar1) ---> true
Array.isArray(ar2) ---> false

JSON.stringify(ar1); ----- > "[]"
JSON.stringify(ar2); ----- > "{}"

ar1.push(1);
ar2.push(1);

JSON.stringify(ar1); ----- > [1]
JSON.stringify(ar2); ----- > {"1":1, "length":1}

ar1.test = 1;
ar2.test = 1;

JSON.stringify(ar1); ----- > [1]
JSON.stringify(ar2); ----- > {"1":1, "length":1, "test":1}

[Евгений Петров]

Илья Шатохин: Вот любопытны 2 вещи:)
1. Зачем ты передаёшь в качестве прототипа не прототип Array?

console.log(Array.prototype.isPrototypeOf(ar1)); //true
console.log(Array.prototype.isPrototypeOf(ar2)); //false — вот про это я и говорил

console.log(ar1.isArray); //undefined
console.log(ar2.isArray); //function isArray() — откуда в Африке названия воронежских улиц?)

2. Ты разбираешь литерал объекта, в котором могут появиться литералы массива. Вот покажи мне создание этого псевдо-массива (который вовсе не массив) на примере литерала:)

[Илья Шатохин]

Евгений Петров: Я знал, что ты на это обратишь внимание, потому немного магии:

var ar2 = Object.create(Array.prototype);
Array.prototype.isPrototypeOf(ar2); ---> true
Array.isArray(ar2); ---> false                         // и тут мы случайно сломали свой полифил
ar2.test = 1;
ar2.push(1);
JSON.stringify(ar2); ----> {"1":1, "length":1, "test":1}

Object.prototype.toString.call(ar2); ----> "[object Object]"

[Илья Шатохин]

Забыл дописать, ar2.isArray ----> undefined

[Евгений Петров]

Илья Шатохин: Я знал, что ты вывернешься:) Только никакой полифилл мы не сломали — вторая часть будет выполнена.
Я же и второй вопрос задал. Не думаю, что вопросы создания объектов с помощью Object.create(Array.prototype) сильно волнуют ТС:) К тому же мы ещё не вспомнили про:

console.log(ar1 instanceof Array); //true
console.log(ar2 instanceof Array); //true

[Илья Шатохин]

Евгений Петров: а кто ж знает, откуда топикстартер взял данные, вдруг там какая-то модная inmemory-db со своими унаследованными прототипами.

p.s. Мозила, кстати, придерживается такого же мнения об полифиллах: https://developer.mozilla.org/ru/docs/Web/JavaScri...

Для красоты можно сделать так:

function getType (inst) {
  return Object.prototype.toString.call(inst).slice(8, -1).toLowerCase();
}

typeof {} ----> 'object'
getType({}) ----> 'object'

typeof new Date() ----> 'object'
getType(new Date()) ----> 'date'

[Евгений Петров]

Илья Шатохин: Да, я для точного определения обычно брал от строкового представления регулярку, хотя slice быстрее будет. Интересно, ТС не сойдёт с ума, читая этот пинг-понг?)

[Илья Шатохин]

Евгений Петров: я уже и забыл про ТС, зато поболтали на умную тему :)

[Bhudh]

А мне вот вообще интересно, как это получилось

var ar2 = Object.create(Array);
ar2.push(1);

У меня вышло:

>>> var arr = Object.create(Array);
undefined
>>> arr.push(1);
Unhandled Error: 'arr.push' is not a function

[Илья Шатохин]

Bhudh: это была моя опечатка, я забыл "prototype", мы дальше это выяснили.

[Евгений Петров]

Илья Шатохин: Мне на днях пришлось грамотно определять тип объекта, вспомнил про диалог:)
Вот что вышло jsfiddle.net/petroveg/u4e21qd0
И без isPrototypeOf таки не удалось обойтись (на втором массиве это можно проверить).

[Евгений Петров]

Bhudh: Потому что получился прототип в виде функции. Статические методы от Array мы получили в наследство, а про прототип Array никто и ничего не знает.

[Илья Шатохин]

Евгений Петров: ты про Object.create(Array.prototype)? но он же и не массив, а все-таки объект)

[Евгений Петров]

Илья Шатохин: Объект, но, в то же время, он — полноценный массив. А иначе почти про всё можно сказать, что это — объект:)

[Илья Шатохин]

Евгений Петров: но ведь JSON.stringify вернет именно объект, и потому при передачи его за пределы VM (или даже просто в соседней webworker), ты получишь {} (причем с полем length, если ты использовал методы массива) :)

[Евгений Петров]

А с каких пор JSON.stringify стал определяющим при определении того, как я могу работать с объектом?)
Строго говоря, свойства в массиве записываются как строки. Так что никаких разногласий тут нет. А то, что строка получилась не совсем привычного вида — дело восприятия:)

[Илья Шатохин]

Евгений Петров: с тех пор, что является стандартным транспортом передачи объектов между связкой клиент-сервер или клиент-вебворкер. Вот захочешь ты этот "массив" обработать параллельно в соседнем потоке, а при передаче в поток ты получишь неожиданно обычный объект. Или отправишь ajax-ом серверу, а он тоже получит объект. Сначала твой "массив" придется преобразовать в массив (уже без кавычек) с помощью Array.from (или через map). Но как же мы узнаем, что это "массив", а не массив, если твой getType возвращает нам тип массив :)

[Евгений Петров]

Илья Шатохин: Разве я тебе не говорил про то, что так массивы создавать не нужно:)
Что же касается определения типа, мне нужно понять — можно ли его конкатенировать и сортировать. Как бы JSON.stringify тут совсем не причём.

[Илья Шатохин]

Евгений Петров: ну так и не создавай :)
p.s. ну это точно "Something Else", примитив же, хоть и экземпляр конструктора.

Кстати, getType(new Int16Array(2)) возвращает undefined :P

[Евгений Петров]

Илья Шатохин: Так я и не создаю, и раза 3 спрашивал — зачем в литерале вставлять подобное?) Ты же ответил: «а кто ж знает, откуда топикстартер взял данные».

Да, я не все типы данных ставил в обработку. Спасибо за подсказку — пойду-ка модифицирую код.

[Евгений Петров]

Илья Шатохин: Вроде никого не забыл:) jsfiddle.net/petroveg/u4e21qd0/1

Answer 2

[Aliansys]

var obj = {
    MainService: [
        {
            Id: "733",
            Name: "service",
            MainService: [
                {
                    Id: "238",
                    Name: "service 1",
                    Service: [
                        {
                            Id: "145",
                            Name: "Service 2"
                        }
                    ]
                }
            ]
        }
    ]
};

function recur(branch, str_paths) {
    var paths = str_paths.paths || [],
        str = str_paths.str || '',
        item;
    for (item in branch) {
        console.log(item)
        if (typeof(branch[item]) === 'object' && branch[item] !== null) { 
            str += str.length ? '.' + item : item;
            recur(branch[item], {str: str, paths: paths});
        } else {
//            str += '.' + item;
            paths.push(str + '.' + item);
        }
    }
    return paths;
}

var res = recur(obj, {});
console.log('Final res: ', res);

Если я правильно понимаю задачу, то с этим фиксом вашего кода в результате в массиве "путей" будут всевозможные пути.

["MainService.0.Id", 
"MainService.0.Name",
"MainService.0.MainService.0.Id", 
"MainService.0.MainService.0.Name", 
"MainService.0.MainService.0.Service.0.Id", 
"MainService.0.MainService.0.Service.0.Name"]

Comments

[Илья Шатохин]

Появление null все поломает.

[Aliansys]

да, я взял код автора и предположил, что в объекте никогда не будет null, раз автор не учел этого. В любом случае, добавить проверку на null не такая проблема. Можн просто дописать в проверку null

[Илья Шатохин]

Aliansys: там еще нет проверки на hasOwnProperty, и for...in не оптимален по скорости.

[Aliansys]

Илья Шатохин: Да бога ради ) Мне Ваш вариант нравится куда больше. Я лишь для скорости модифицировал код автора.

[Илья Шатохин]

Aliansys: вы не подумайте, я просто дал справку, чтобы защитить автора от выстрела в ногу :)

Answer 3

[Dmitriy Mozgovoy]

И на массивах =)

var obj = {
    MainService: [
        {
            Id: "733",
            Name: "service",
            MainService: [
                {
                    Id: "238",
                    Name: "service 1",
                    Service: [
                        {
                            Id: "145",
                            Name: "Service 2"
                        }
                    ]
                }
            ]
        }
    ]
  };  

       function mapObject(obj,asArrays){
           var paths=[];

           function scan(obj,stack){
               var k, v, path;

               for(k in obj){
                   if(obj.hasOwnProperty(k)){
                       path=stack.concat([k]);
                       if((v=obj[k])!==null&&typeof v=='object'){
                           scan(v,path);
                       }else{
                           paths.push(asArrays?path:path.join('.'));
                       }
                   }
               }
           }
           scan(obj,[]);
           return paths;
       }

       console.warn(mapObject(obj));

       console.warn(mapObject(obj,true)); //вдруг где пригодиться ;)

Comments

[Илья Шатохин]

И снова грабли с typeof :)

[Dmitriy Mozgovoy]

Илья Шатохин: да ладно, с typeof все нормально, перекрывает 99,99% случаев- вряд ли у него там будут псевдообъекты всякие дабы использовать любимый toString, вероятность почти 0=)

[Илья Шатохин]

Дмитрий: Не известно откуда такой объект, вдруг это какая-то inmemory-db реализация. Неизвестно, что находится в ее прототипах для быстрого поиска, индексации и т.д :)

[Dmitriy Mozgovoy]

Илья Шатохин: при таком уровне тогда уж думаю автор уже давно имеет функции где то аля "isTrulyObject" =) и он способен заменить typeof на нее, а так просто много букаф получается...

[Илья Шатохин]

Дмитрий: а кто сказал, что автор написал этот конструктор? Может он просто пытается получать данные из него неестественным путем.

[Илья Шатохин]

Дмитрий: как вариант, простейший пример с датами в объекте сломает ваш код, т.к.
typeof new Date() ----> 'object'

[Dmitriy Mozgovoy]

Илья Шатохин: ну тогда а кто сказал что автор не пишет под IE6 без Object.keys и forEach=)) всего не предусмотреть, автор сам допилит до таких тонкостей, если это ему нужно, а то придется Вам ему все полифилы еще написать ;)