If I have a reference to an object:
var test = {};
that will potentially (but not immediately) have nested objects, something like:
{level1: {level2: {level3: "level3"}}};
What is the best way to check for the existence of property in deeply nested objects?
alert(test.level1); yields undefined, but alert(test.level1.level2.level3); fails.
I’m currently doing something like this:
if(test.level1 && test.level1.level2 && test.level1.level2.level3) {
alert(test.level1.level2.level3);
}
but I was wondering if there’s a better way.
Solution 1
You have to do it step by step if you don't want a TypeError because if one of the members is null or undefined, and you try to access a member, an exception will be thrown.
You can either simply catch the exception, or make a function to test the existence of multiple levels, something like this:
function checkNested(obj /*, level1, level2, ... levelN*/) {
var args = Array.prototype.slice.call(arguments, 1);
for (var i = 0; i < args.length; i++) {
if (!obj || !obj.hasOwnProperty(args[i])) {
return false;
}
obj = obj[args[i]];
}
return true;
}
var test = {level1:{level2:{level3:'level3'}} };
checkNested(test, 'level1', 'level2', 'level3'); // true
checkNested(test, 'level1', 'level2', 'foo'); // false
ES6 UPDATE:
Here is a shorter version of the original function, using ES6 features and recursion (it's also in proper tail call form):
function checkNested(obj, level, ...rest) {
if (obj === undefined) return false
if (rest.length == 0 && obj.hasOwnProperty(level)) return true
return checkNested(obj[level], ...rest)
}
However, if you want to get the value of a nested property and not only check its existence, here is a simple one-line function:
function getNested(obj, ...args) {
return args.reduce((obj, level) => obj && obj[level], obj)
}
const test = { level1:{ level2:{ level3:'level3'} } };
console.log(getNested(test, 'level1', 'level2', 'level3')); // 'level3'
console.log(getNested(test, 'level1', 'level2', 'level3', 'length')); // 6
console.log(getNested(test, 'level1', 'level2', 'foo')); // undefined
console.log(getNested(test, 'a', 'b')); // undefined
The above function allows you to get the value of nested properties, otherwise will return undefined.
UPDATE 2019-10-17:
The optional chaining proposal reached Stage 3 on the ECMAScript committee process, this will allow you to safely access deeply nested properties, by using the token ?., the new optional chaining operator:
const value = obj?.level1?.level2?.level3
If any of the levels accessed is null or undefined the expression will resolve to undefined by itself.
The proposal also allows you to handle method calls safely:
obj?.level1?.method();
The above expression will produce undefined if obj, obj.level1, or obj.level1.method are null or undefined, otherwise it will call the function.
You can start playing with this feature with Babel using the optional chaining plugin.
Since Babel 7.8.0, ES2020 is supported by default
Check this example on the Babel REPL.
UPDATE: December 2019
The optional chaining proposal finally reached Stage 4 in the December 2019 meeting of the TC39 committee. This means this feature will be part of the ECMAScript 2020 Standard.
Solution 2
Here is a pattern I picked up from Oliver Steele:
var level3 = (((test || {}).level1 || {}).level2 || {}).level3;
alert( level3 );
In fact that whole article is a discussion of how you can do this in javascript. He settles on using the above syntax (which isn't that hard to read once you get used to it) as an idiom.
Solution 3
Update
Looks like lodash has added _.get for all your nested property getting needs.
_.get(countries, 'greece.sparta.playwright')
Previous answer
lodash users may enjoy lodash.contrib which has a couple methods that mitigate this problem.
getPath
Signature: _.getPath(obj:Object, ks:String|Array)
Gets the value at any depth in a nested object based on the path described by
the keys given. Keys may be given as an array or as a dot-separated string.
Returns undefined if the path cannot be reached.
var countries = {
greece: {
athens: {
playwright: "Sophocles"
}
}
}
};
_.getPath(countries, "greece.athens.playwright");
// => "Sophocles"
_.getPath(countries, "greece.sparta.playwright");
// => undefined
_.getPath(countries, ["greece", "athens", "playwright"]);
// => "Sophocles"
_.getPath(countries, ["greece", "sparta", "playwright"]);
// => undefined
Solution 4
I have done performance tests (thank you cdMinix for adding lodash) on some of the suggestions proposed to this question with the results listed below.
Disclaimer #1 Turning strings into references is unnecessary meta-programming and probably best avoided. Don't lose track of your references to begin with. Read more from this answer to a similar question.
Disclaimer #2 We are talking about millions of operations per millisecond here. It is very unlikely any of these would make much difference in most use cases. Choose whichever makes the most sense knowing the limitations of each. For me I would go with something like
reduceout of convenience.
Object Wrap (by Oliver Steele) 34 % fastest
var r1 = (((test || {}).level1 || {}).level2 || {}).level3;
var r2 = (((test || {}).level1 || {}).level2 || {}).foo;
Original solution (suggested in question) 45%
var r1 = test.level1 && test.level1.level2 && test.level1.level2.level3;
var r2 = test.level1 && test.level1.level2 && test.level1.level2.foo;
checkNested 50%
function checkNested(obj) {
for (var i = 1; i < arguments.length; i++) {
if (!obj.hasOwnProperty(arguments[i])) {
return false;
}
obj = obj[arguments[i]];
}
return true;
}
get_if_exist 52%
function get_if_exist(str) {
try { return eval(str) }
catch(e) { return undefined }
}
validChain 54%
function validChain( object, ...keys ) {
return keys.reduce( ( a, b ) => ( a || { } )[ b ], object ) !== undefined;
}
objHasKeys 63%
function objHasKeys(obj, keys) {
var next = keys.shift();
return obj[next] && (! keys.length || objHasKeys(obj[next], keys));
}
function nestedPropertyExists(obj, props) {
var prop = props.shift();
return prop === undefined ? true : obj.hasOwnProperty(prop) ? nestedPropertyExists(obj[prop], props) : false;
}
_.get 72%
deeptest 86%
function deeptest(target, s){
s= s.split('.')
var obj= target[s.shift()];
while(obj && s.length) obj= obj[s.shift()];
return obj;
}
sad clowns 100% slowest
var o = function(obj) { return obj || {} };
var r1 = o(o(o(o(test).level1).level2).level3);
var r2 = o(o(o(o(test).level1).level2).foo);
Solution 5
You can read an object property at any depth, if you handle the name like a string: 't.level1.level2.level3'.
window.t={level1:{level2:{level3: 'level3'}}};
function deeptest(s){
s= s.split('.')
var obj= window[s.shift()];
while(obj && s.length) obj= obj[s.shift()];
return obj;
}
alert(deeptest('t.level1.level2.level3') || 'Undefined');
It returns undefined if any of the segments is undefined.
Solution 6
var a;
a = {
b: {
c: 'd'
}
};
function isset (fn) {
var value;
try {
value = fn();
} catch (e) {
value = undefined;
} finally {
return value !== undefined;
}
};
// ES5
console.log(
isset(function () { return a.b.c; }),
isset(function () { return a.b.c.d.e.f; })
);
If you are coding in ES6 environment (or using 6to5) then you can take advantage of the arrow function syntax:
// ES6 using the arrow function
console.log(
isset(() => a.b.c),
isset(() => a.b.c.d.e.f)
);
Regarding the performance, there is no performance penalty for using try..catch block if the property is set. There is a performance impact if the property is unset.
Consider simply using _.has:
var object = { 'a': { 'b': { 'c': 3 } } };
_.has(object, 'a');
// true
_.has(object, 'a.b.c');
// true
_.has(object, ['a', 'b', 'c']);
// true
Solution 7
how about
try {
alert(test.level1.level2.level3)
} catch(e) {
...whatever
}
Solution 8
You can also use tc39 optional chaining proposal together with babel 7 - tc39-proposal-optional-chaining
Code would look like this:
const test = test?.level1?.level2?.level3;
if (test) alert(test);
Solution 9
ES6 answer, thoroughly tested :)
const propExists = (obj, path) => {
return !!path.split('.').reduce((obj, prop) => {
return obj && obj[prop] ? obj[prop] : undefined;
}, obj)
}
see Codepen with full test coverage
Solution 10
I tried a recursive approach:
function objHasKeys(obj, keys) {
var next = keys.shift();
return obj[next] && (! keys.length || objHasKeys(obj[next], keys));
}
The ! keys.length || kicks out of the recursion so it doesn't run the function with no keys left to test. Tests:
obj = {
path: {
to: {
the: {
goodKey: "hello"
}
}
}
}
console.log(objHasKeys(obj, ['path', 'to', 'the', 'goodKey'])); // true
console.log(objHasKeys(obj, ['path', 'to', 'the', 'badKey'])); // undefined
I am using it to print a friendly html view of a bunch of objects with unknown key/values, e.g.:
var biosName = objHasKeys(myObj, 'MachineInfo:BiosInfo:Name'.split(':'))
? myObj.MachineInfo.BiosInfo.Name
: 'unknown';
Solution 11
This question is old. Today you can use Optional chaining (?.)
let value = test?.level1?.level2?.level3;
Source:
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Optional_chaining
Solution 12
I think the following script gives more readable representation.
declare a function:
var o = function(obj) { return obj || {};};
then use it like this:
if (o(o(o(o(test).level1).level2).level3)
{
}
I call it "sad clown technique" because it is using sign o(
EDIT:
here is a version for TypeScript
it gives type checks at compile time (as well as the intellisense if you use a tool like Visual Studio)
export function o<T>(someObject: T, defaultValue: T = {} as T) : T {
if (typeof someObject === 'undefined' || someObject === null)
return defaultValue;
else
return someObject;
}
the usage is the same:
o(o(o(o(test).level1).level2).level3
but this time intellisense works!
plus, you can set a default value:
o(o(o(o(o(test).level1).level2).level3, "none")
Solution 13
create a global function and use in whole project
try this
function isExist(arg){
try{
return arg();
}catch(e){
return false;
}
}
let obj={a:5,b:{c:5}};
console.log(isExist(()=>obj.b.c))
console.log(isExist(()=>obj.b.foo))
console.log(isExist(()=>obj.test.foo))
if condition
if(isExist(()=>obj.test.foo)){
....
}
Solution 14
I didn't see any example of someone using Proxies
So I came up with my own.
The great thing about it is that you don't have to interpolate strings. You can actually return a chain-able object function and do some magical things with it. You can even call functions and get array indexes to check for deep objects
The above code works fine for synchronous stuff. But how would you test something that is asynchronous like this ajax call? How do you test that?
fetch('https://httpbin.org/get')
.then(function(response) {
return response.json()
})
.then(function(json) {
console.log(json.headers['User-Agent'])
})
sure you could use async/await to get rid of some callbacks. But what if you could do it even more magically? something that looks like this:
fetch('https://httpbin.org/get').json().headers['User-Agent']
You probably wonder where all the promise & .then chains are... this could be blocking for all that you know... but using the same Proxy technique with promise you can actually test deeply nested complex path for it existence without ever writing a single function
Solution 15
One simple way is this:
try {
alert(test.level1.level2.level3);
} catch(e) {
alert("undefined"); // this is optional to put any output here
}
The try/catch catches the cases for when any of the higher level objects such as test, test.level1, test.level1.level2 are not defined.
Solution 16
Based on this answer, I came up with this generic function using ES2015 which would solve the problem
function validChain( object, ...keys ) {
return keys.reduce( ( a, b ) => ( a || { } )[ b ], object ) !== undefined;
}
var test = {
first: {
second: {
third: "This is not the key your are looking for"
}
}
}
if ( validChain( test, "first", "second", "third" ) ) {
console.log( test.first.second.third );
}
Solution 17
I have created a little function to get nested object properties safely.
function getValue(object, path, fallback, fallbackOnFalsy) {
if (!object || !path) {
return fallback;
}
// Reduces object properties to the deepest property in the path argument.
return path.split('.').reduce((object, property) => {
if (object && typeof object !== 'string' && object.hasOwnProperty(property)) {
// The property is found but it may be falsy.
// If fallback is active for falsy values, the fallback is returned, otherwise the property value.
return !object[property] && fallbackOnFalsy ? fallback : object[property];
} else {
// Returns the fallback if current chain link does not exist or it does not contain the property.
return fallback;
}
}, object);
}
Or a simpler but slightly unreadable version:
function getValue(o, path, fb, fbFalsy) {
if(!o || !path) return fb;
return path.split('.').reduce((o, p) => o && typeof o !== 'string' && o.hasOwnProperty(p) ? !o[p] && fbFalsy ? fb : o[p] : fb, o);
}
Or even shorter but without fallback on falsy flag:
function getValue(o, path, fb) {
if(!o || !path) return fb;
return path.split('.').reduce((o, p) => o && typeof o !== 'string' && o.hasOwnProperty(p) ? o[p] : fb, o);
}
I have test with:
const obj = {
c: {
a: 2,
b: {
c: [1, 2, 3, {a: 15, b: 10}, 15]
},
c: undefined,
d: null
},
d: ''
}
And here are some tests:
// null
console.log(getValue(obj, 'c.d', 'fallback'));
// array
console.log(getValue(obj, 'c.b.c', 'fallback'));
// array index 2
console.log(getValue(obj, 'c.b.c.2', 'fallback'));
// no index => fallback
console.log(getValue(obj, 'c.b.c.10', 'fallback'));
To see all the code with documentation and the tests I've tried you can check my github gist: https://gist.github.com/vsambor/3df9ad75ff3de489bbcb7b8c60beebf4#file-javascriptgetnestedvalues-js
Solution 18
A shorter, ES5 version of @CMS's excellent answer:
// Check the obj has the keys in the order mentioned. Used for checking JSON results.
var checkObjHasKeys = function(obj, keys) {
var success = true;
keys.forEach( function(key) {
if ( ! obj.hasOwnProperty(key)) {
success = false;
}
obj = obj[key];
})
return success;
}
With a similar test:
var test = { level1:{level2:{level3:'result'}}};
utils.checkObjHasKeys(test, ['level1', 'level2', 'level3']); // true
utils.checkObjHasKeys(test, ['level1', 'level2', 'foo']); // false
Solution 19
I was looking for the value to be returned if the property exists, so I modified the answer by CMS above. Here's what I came up with:
function getNestedProperty(obj, key) {
// Get property array from key string
var properties = key.split(".");
// Iterate through properties, returning undefined if object is null or property doesn't exist
for (var i = 0; i < properties.length; i++) {
if (!obj || !obj.hasOwnProperty(properties[i])) {
return;
}
obj = obj[properties[i]];
}
// Nested property found, so return the value
return obj;
}
Usage:
getNestedProperty(test, "level1.level2.level3") // "level3"
getNestedProperty(test, "level1.level2.foo") // undefined
Solution 20
The answer given by CMS works fine with the following modification for null checks as well
function checkNested(obj /*, level1, level2, ... levelN*/)
{
var args = Array.prototype.slice.call(arguments),
obj = args.shift();
for (var i = 0; i < args.length; i++)
{
if (obj == null || !obj.hasOwnProperty(args[i]) )
{
return false;
}
obj = obj[args[i]];
}
return true;
}
Solution 21
Following options were elaborated starting from this answer. Same tree for both :
var o = { a: { b: { c: 1 } } };
Stop searching when undefined
var u = undefined;
o.a ? o.a.b ? o.a.b.c : u : u // 1
o.x ? o.x.y ? o.x.y.z : u : u // undefined
(o = o.a) ? (o = o.b) ? o.c : u : u // 1
Ensure each level one by one
var $ = function (empty) {
return function (node) {
return node || empty;
};
}({});
$($(o.a).b).c // 1
$($(o.x).y).z // undefined
Solution 22
I know this question is old, but I wanted to offer an extension by adding this to all objects. I know people tend to frown on using the Object prototype for extended object functionality, but I don't find anything easier than doing this. Plus, it's now allowed for with the Object.defineProperty method.
Object.defineProperty( Object.prototype, "has", { value: function( needle ) {
var obj = this;
var needles = needle.split( "." );
for( var i = 0; i<needles.length; i++ ) {
if( !obj.hasOwnProperty(needles[i])) {
return false;
}
obj = obj[needles[i]];
}
return true;
}});
Now, in order to test for any property in any object you can simply do:
if( obj.has("some.deep.nested.object.somewhere") )
Here's a jsfiddle to test it out, and in particular it includes some jQuery that breaks if you modify the Object.prototype directly because of the property becoming enumerable. This should work fine with 3rd party libraries.
Solution 23
I think this is a slight improvement (becomes a 1-liner):
alert( test.level1 && test.level1.level2 && test.level1.level2.level3 )
This works because the && operator returns the final operand it evaluated (and it short-circuits).
Solution 24
This works with all objects and arrays :)
ex:
if( obj._has( "something.['deep']['under'][1][0].item" ) ) {
//do something
}
this is my improved version of Brian's answer
I used _has as the property name because it can conflict with existing has property (ex: maps)
Object.defineProperty( Object.prototype, "_has", { value: function( needle ) {
var obj = this;
var needles = needle.split( "." );
var needles_full=[];
var needles_square;
for( var i = 0; i<needles.length; i++ ) {
needles_square = needles[i].split( "[" );
if(needles_square.length>1){
for( var j = 0; j<needles_square.length; j++ ) {
if(needles_square[j].length){
needles_full.push(needles_square[j]);
}
}
}else{
needles_full.push(needles[i]);
}
}
for( var i = 0; i<needles_full.length; i++ ) {
var res = needles_full[i].match(/^((\d+)|"(.+)"|'(.+)')\]$/);
if (res != null) {
for (var j = 0; j < res.length; j++) {
if (res[j] != undefined) {
needles_full[i] = res[j];
}
}
}
if( typeof obj[needles_full[i]]=='undefined') {
return false;
}
obj = obj[needles_full[i]];
}
return true;
}});
Here's the fiddle
Solution 25
Here's my take on it - most of these solutions ignore the case of a nested array as in:
obj = {
"l1":"something",
"l2":[{k:0},{k:1}],
"l3":{
"subL":"hello"
}
}
I may want to check for obj.l2[0].k
With the function below, you can do deeptest('l2[0].k',obj)
The function will return true if the object exists, false otherwise
function deeptest(keyPath, testObj) {
var obj;
keyPath = keyPath.split('.')
var cKey = keyPath.shift();
function get(pObj, pKey) {
var bracketStart, bracketEnd, o;
bracketStart = pKey.indexOf("[");
if (bracketStart > -1) { //check for nested arrays
bracketEnd = pKey.indexOf("]");
var arrIndex = pKey.substr(bracketStart + 1, bracketEnd - bracketStart - 1);
pKey = pKey.substr(0, bracketStart);
var n = pObj[pKey];
o = n? n[arrIndex] : undefined;
} else {
o = pObj[pKey];
}
return o;
}
obj = get(testObj, cKey);
while (obj && keyPath.length) {
obj = get(obj, keyPath.shift());
}
return typeof(obj) !== 'undefined';
}
var obj = {
"l1":"level1",
"arr1":[
{"k":0},
{"k":1},
{"k":2}
],
"sub": {
"a":"letter A",
"b":"letter B"
}
};
console.log("l1: " + deeptest("l1",obj));
console.log("arr1[0]: " + deeptest("arr1[0]",obj));
console.log("arr1[1].k: " + deeptest("arr1[1].k",obj));
console.log("arr1[1].j: " + deeptest("arr1[1].j",obj));
console.log("arr1[3]: " + deeptest("arr1[3]",obj));
console.log("arr2: " + deeptest("arr2",obj));
Solution 26
Now we can also use reduce to loop through nested keys:
// @params o<object>
// @params path<string> expects 'obj.prop1.prop2.prop3'
// returns: obj[path] value or 'false' if prop doesn't exist
const objPropIfExists = o => path => {
const levels = path.split('.');
const res = (levels.length > 0)
? levels.reduce((a, c) => a[c] || 0, o)
: o[path];
return (!!res) ? res : false
}
const obj = {
name: 'Name',
sys: { country: 'AU' },
main: { temp: '34', temp_min: '13' },
visibility: '35%'
}
const exists = objPropIfExists(obj)('main.temp')
const doesntExist = objPropIfExists(obj)('main.temp.foo.bar.baz')
console.log(exists, doesntExist)
Solution 27
You can do this by using the recursive function. This will work even if you don't know all nested Object keys name.
function FetchKeys(obj) {
let objKeys = [];
let keyValues = Object.entries(obj);
for (let i in keyValues) {
objKeys.push(keyValues[i][0]);
if (typeof keyValues[i][1] == "object") {
var keys = FetchKeys(keyValues[i][1])
objKeys = objKeys.concat(keys);
}
}
return objKeys;
}
let test = { level1: { level2: { level3: "level3" } } };
let keyToCheck = "level2";
let keys = FetchKeys(test); //Will return an array of Keys
if (keys.indexOf(keyToCheck) != -1) {
//Key Exists logic;
}
else {
//Key Not Found logic;
}
Solution 28
And yet another one which is very compact:
function ifSet(object, path) {
return path.split('.').reduce((obj, part) => obj && obj[part], object)
}
called:
let a = {b:{c:{d:{e:'found!'}}}}
ifSet(a, 'b.c.d.e') == 'found!'
ifSet(a, 'a.a.a.a.a.a') == undefined
It won't perform great since it's splitting a string (but increases readability of the call) and iterates over everything even if it's already obvious that nothing will be found (but increases readability of the function itself).
at least is faster than _.get http://jsben.ch/aAtmc
Solution 29
I have used this function for access properties of the deeply nested object and it working for me...
this is the function
/**
* get property of object
* @param obj object
* @param path e.g user.name
*/
getProperty(obj, path, defaultValue = '-') {
const value = path.split('.').reduce((o, p) => o && o[p], obj);
return value ? value : defaultValue;
}
this is how I access the deeply nested object property
{{ getProperty(object, 'passengerDetails.data.driverInfo.currentVehicle.vehicleType') }}
Solution 30
theres a function here on thecodeabode (safeRead) which will do this in a safe manner... i.e.
safeRead(test, 'level1', 'level2', 'level3');
if any property is null or undefined, an empty string is returned
