2015-03-08 2 views
1

Я интересно, если его можно извлечь все пути объектов JavaScript содержитПолучить Path элементов Object

Пример:

obj = { 
    prop1 : { 
    x: 19 
    y: 43 
    } 
    prop2 : { 
    another: { 
     here: 1 
    } 
    } 
    prop3: "hello" 
} 

В случае, если результат был бы массив со следующими элементами:

Result: ["prop1.x", "prop1.y", "prop2.another.here", "prop3"] 

Возможно ли это?

Спасибо!

+0

рекурсивной итерации? –

+0

Возможный дубликат [Рекурсивно перебирать объект для создания списка свойств] (http://stackoverflow.com/questions/15690706/recursively-looping-through-an-object-to-build-a-property-list) –

ответ

3
function flattenKeys(obj, delimiter) { 
    delimiter = delimiter || '.'; 

    return recurse(obj, '', []); 

    function recurse(obj, path, result) { 
     if (typeof obj === "object") { 
      Object.keys(obj).forEach(function (key) { 
       recurse(obj[key], path + delimiter + key, result); 
      }); 
     } else { 
      result.push(path.slice(delimiter.length)); 
     } 
     return result; 
    } 
} 

используется как

var obj = { 
    prop1 : { 
    x: 19, 
    y: 43 
    }, 
    prop2 : { 
    another: { 
     here: 1 
    } 
    }, 
    prop3: "hello" 
}; 

flattenKeys(obj); 

// -> ["prop1.x", "prop1.y", "prop2.another.here", "prop3"] 

Альтернативного выполнения без строковых операций:

function flattenKeys(obj, delimiter) { 
    delimiter = delimiter || '.'; 

    return recurse(obj, [], []); 

    function recurse(obj, path, result) { 
     if (typeof obj === "object") { 
      Object.keys(obj).forEach(function (key) { 
       path.push(key); 
       recurse(obj[key], path, result); 
       path.pop(); 
      }); 
     } else { 
      result.push(path.join(delimiter)); 
     } 
     return result; 
    } 
} 
+0

Отличная работа! Некоторые «контрольные показатели»: http://jsfiddle.net/jkoudys/w49rcp40/ (может быть неправильно tho :)) –

+0

Вы ввели неправильную ссылку? Это просто мой jsfiddle. –

+0

Вы правы, неправильная ссылка: http://jsfiddle.net/w49rcp40/2/. Похоже, что он зависит от браузера. Они оба превосходны;) –

2

Написал это время Томалак помещал здесь вместе. Рекурсия - это очевидный подход для этого.

var inputObject = { 
    prop1: { 
     x: 19, 
     y: 43 
    }, 
    prop2: { 
     another: { 
      here: 1 
     } 
    }, 
    prop3: "hello" 
}; 

function getProps(obj) { 
    var props = []; 

    var findPropsRecursive = function (robj, str) { 
    robj = robj || {}; 
    var keys = Object.keys(robj); 
    if (keys.length > 0 && (robj instanceof Object)) { 
     return keys.map(function (key) { 
     return findPropsRecursive(robj[key], str + (str ? '.' : '') + key); 
     }); 
    } else { 
     props.push(str); 
     return ''; 
    } 
    }; 

    findPropsRecursive(obj, ''); 

    return props; 
} 

console.log(getProps(inputObject)); 

на jsfiddle: http://jsfiddle.net/jkoudys/w49rcp40/

+0

В вашем коде есть ошибка, Internet Explorer показывает это: 'TypeError: Object.keys: аргумент не является объектом. – Tomalak

+1

Object.keys не поддерживается в

+0

Вот для чего нужны полисы. Кстати, если вы хотите следовать их примеру, в приложениях Google только инструкция поддержки n-1 для IE, и поскольку последняя стабильная версия - IE11, то даже 9 не поддерживается. Лично я, как правило, делаю n-2, но IE8 будет n-3 - достаточно стар, чтобы просто поставить страницу «ваш браузер не поддерживается», хотя я обычно жду, пока n-4 для этого. n-3, как правило, просто лучше всего. –

Смежные вопросы