JSFiddle - React, Tailwind, and code Playground
HTML
<div id="output"></div>
JavaScript
var inputObject = {
prop1: {
x: 19,
y: 43
},
prop2: {
another: {
here: 1
}
},
prop3: "hello"
};
// Josh from Qaribou
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;
}
// Tomalak
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;
}
}
var tomalak = 0
var josh = 0
for ( var i = 1; i < 10000; i++){
start = window.performance.now()
start = window.performance.now()
getProps(inputObject)
josh = (josh + (window.performance.now() - start)) / i
start = window.performance.now()
start = window.performance.now()
flattenKeys(inputObject)
tomalak = (tomalak + (window.performance.now() - start)) / i
}
console.log("Tomalak: " + tomalak)
console.log("Josh: " + josh)
console.log("------")