Related
How do I check if a particular key exists in a JavaScript object or array?
If a key doesn't exist, and I try to access it, will it return false? Or throw an error?
Checking for undefined-ness is not an accurate way of testing whether a key exists. What if the key exists but the value is actually undefined?
var obj = { key: undefined };
console.log(obj["key"] !== undefined); // false, but the key exists!
You should instead use the in operator:
var obj = { key: undefined };
console.log("key" in obj); // true, regardless of the actual value
If you want to check if a key doesn't exist, remember to use parenthesis:
var obj = { not_key: undefined };
console.log(!("key" in obj)); // true if "key" doesn't exist in object
console.log(!"key" in obj); // Do not do this! It is equivalent to "false in obj"
Or, if you want to particularly test for properties of the object instance (and not inherited properties), use hasOwnProperty:
var obj = { key: undefined };
console.log(obj.hasOwnProperty("key")); // true
For performance comparison between the methods that are in, hasOwnProperty and key is undefined, see this benchmark:
Quick Answer
How do I check if a particular key exists in a JavaScript object or array?
If a key doesn't exist and I try to access it, will it return false? Or throw an error?
Accessing directly a missing property using (associative) array style or object style will return an undefined constant.
The slow and reliable in operator and hasOwnProperty method
As people have already mentioned here, you could have an object with a property associated with an "undefined" constant.
var bizzareObj = {valid_key: undefined};
In that case, you will have to use hasOwnProperty or in operator to know if the key is really there. But, but at what price?
so, I tell you...
in operator and hasOwnProperty are "methods" that use the Property Descriptor mechanism in Javascript (similar to Java reflection in the Java language).
http://www.ecma-international.org/ecma-262/5.1/#sec-8.10
The Property Descriptor type is used to explain the manipulation and reification of named property attributes. Values of the Property Descriptor type are records composed of named fields where each field’s name is an attribute name and its value is a corresponding attribute value as specified in 8.6.1. In addition, any field may be present or absent.
On the other hand, calling an object method or key will use Javascript [[Get]] mechanism. That is a far way faster!
Benchmark
https://jsben.ch/HaHQt
.
Using in operator
var result = "Impression" in array;
The result was
12,931,832 ±0.21% ops/sec 92% slower
Using hasOwnProperty
var result = array.hasOwnProperty("Impression")
The result was
16,021,758 ±0.45% ops/sec 91% slower
Accessing elements directly (brackets style)
var result = array["Impression"] === undefined
The result was
168,270,439 ±0.13 ops/sec 0.02% slower
Accessing elements directly (object style)
var result = array.Impression === undefined;
The result was
168,303,172 ±0.20% fastest
EDIT: What is the reason to assign to a property the undefined value?
That question puzzles me. In Javascript, there are at least two references for absent objects to avoid problems like this: null and undefined.
null is the primitive value that represents the intentional absence of any object value, or in short terms, the confirmed lack of value. On the other hand, undefined is an unknown value (not defined). If there is a property that will be used later with a proper value consider use null reference instead of undefined because in the initial moment the property is confirmed to lack value.
Compare:
var a = {1: null};
console.log(a[1] === undefined); // output: false. I know the value at position 1 of a[] is absent and this was by design, i.e.: the value is defined.
console.log(a[0] === undefined); // output: true. I cannot say anything about a[0] value. In this case, the key 0 was not in a[].
Advice
Avoid objects with undefined values. Check directly whenever possible and use null to initialize property values. Otherwise, use the slow in operator or hasOwnProperty() method.
EDIT: 12/04/2018 - NOT RELEVANT ANYMORE
As people have commented, modern versions of the Javascript engines (with firefox exception) have changed the approach for access properties. The current implementation is slower than the previous one for this particular case but the difference between access key and object is neglectable.
It will return undefined.
var aa = {hello: "world"};
alert( aa["hello"] ); // popup box with "world"
alert( aa["goodbye"] ); // popup box with "undefined"
undefined is a special constant value. So you can say, e.g.
// note the three equal signs so that null won't be equal to undefined
if( aa["goodbye"] === undefined ) {
// do something
}
This is probably the best way to check for missing keys. However, as is pointed out in a comment below, it's theoretically possible that you'd want to have the actual value be undefined. I've never needed to do this and can't think of a reason offhand why I'd ever want to, but just for the sake of completeness, you can use the in operator
// this works even if you have {"goodbye": undefined}
if( "goodbye" in aa ) {
// do something
}
"key" in obj
Is likely testing only object attribute values that are very different from array keys
Checking for properties of the object including inherited properties
Could be determined using the in operator which returns true if the specified property is in the specified object or its prototype chain, false otherwise
const person = { name: 'dan' };
console.log('name' in person); // true
console.log('age' in person); // false
Checking for properties of the object instance (not including inherited properties)
*2021 - Using the new method ***Object.hasOwn() as a replacement for Object.hasOwnProperty()
Object.hasOwn() is intended as a replacement for Object.hasOwnProperty() and is a new method available to use (yet still not fully supported by all browsers like safari yet but soon will be)
Object.hasOwn() is a static method which returns true if the specified object has the specified property as its own property. If the property is inherited, or does not exist, the method returns false.
const person = { name: 'dan' };
console.log(Object.hasOwn(person, 'name'));// true
console.log(Object.hasOwn(person, 'age'));// false
const person2 = Object.create({gender: 'male'});
console.log(Object.hasOwn(person2, 'gender'));// false
What is the motivation to use it over Object.prototype.hasOwnProperty? - It is recommended to this method use over the Object.hasOwnProperty() because it also works for objects created by using Object.create(null) and for objects that have overridden the inherited hasOwnProperty() method. Although it's possible to solve these kind of problems by calling Object.prototype.hasOwnProperty() on an external object, Object.hasOwn() overcome these problems, hence is preferred (see examples below)
let person = {
hasOwnProperty: function() {
return false;
},
age: 35
};
if (Object.hasOwn(person, 'age')) {
console.log(person.age); // true - the remplementation of hasOwnProperty() did not affect the Object
}
let person = Object.create(null);
person.age = 35;
if (Object.hasOwn(person, 'age')) {
console.log(person.age); // true - works regardless of how the object was created
}
More about Object.hasOwn can be found here : https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwn
Browser compatibility for Object.hasOwn - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwn#browser_compatibility
The accepted answer refers to Object. Beware using the in operator on Array to find data instead of keys:
("true" in ["true", "false"])
// -> false (Because the keys of the above Array are actually 0 and 1)
To test existing elements in an Array: Best way to find if an item is in a JavaScript array?
Three ways to check if a property is present in a javascript object:
!!obj.theProperty
Will convert value to bool. returns true for all but the false value
'theProperty' in obj
Will return true if the property exists, no matter its value (even empty)
obj.hasOwnProperty('theProperty')
Does not check the prototype chain. (since all objects have the toString method, 1 and 2 will return true on it, while 3 can return false on it.)
Reference:
http://book.mixu.net/node/ch5.html
If you are using underscore.js library then object/array operations become simple.
In your case _.has method can be used. Example:
yourArray = {age: "10"}
_.has(yourArray, "age")
returns true
But,
_.has(yourArray, "invalidKey")
returns false
Answer:
if ("key" in myObj)
{
console.log("key exists!");
}
else
{
console.log("key doesn't exist!");
}
Explanation:
The in operator will check if the key exists in the object. If you checked if the value was undefined: if (myObj["key"] === 'undefined'), you could run into problems because a key could possibly exist in your object with the undefined value.
For that reason, it is much better practice to first use the in operator and then compare the value that is inside the key once you already know it exists.
Here's a helper function I find quite useful
This keyExists(key, search) can be used to easily lookup a key within objects or arrays!
Just pass it the key you want to find, and search obj (the object or array) you want to find it in.
function keyExists(key, search) {
if (!search || (search.constructor !== Array && search.constructor !== Object)) {
return false;
}
for (var i = 0; i < search.length; i++) {
if (search[i] === key) {
return true;
}
}
return key in search;
}
// How to use it:
// Searching for keys in Arrays
console.log(keyExists('apple', ['apple', 'banana', 'orange'])); // true
console.log(keyExists('fruit', ['apple', 'banana', 'orange'])); // false
// Searching for keys in Objects
console.log(keyExists('age', {'name': 'Bill', 'age': 29 })); // true
console.log(keyExists('title', {'name': 'Jason', 'age': 29 })); // false
It's been pretty reliable and works well cross-browser.
vanila js
yourObjName.hasOwnProperty(key) : true ? false;
If you want to check if the object has at least one property in es2015
Object.keys(yourObjName).length : true ? false
ES6 solution
using Array#some and Object.keys. It will return true if given key exists in the object or false if it doesn't.
var obj = {foo: 'one', bar: 'two'};
function isKeyInObject(obj, key) {
var res = Object.keys(obj).some(v => v == key);
console.log(res);
}
isKeyInObject(obj, 'foo');
isKeyInObject(obj, 'something');
One-line example.
console.log(Object.keys({foo: 'one', bar: 'two'}).some(v => v == 'foo'));
Optional chaining operator:
const invoice = {customer: {address: {city: "foo"}}}
console.log( invoice?.customer?.address?.city )
console.log( invoice?.customer?.address?.street )
console.log( invoice?.xyz?.address?.city )
See supported browsers list
For those which have lodash included in their project:There is a lodash _.get method which tries to get "deep" keys:
Gets the value at path of object. If the resolved value is undefined,
the defaultValue is returned in its place.
var object = { 'a': [{ 'b': { 'c': 3 } }] };
console.log(
_.get(object, 'a[0].b.c'), // => 3
_.get(object, ['a', '0', 'b', 'c']), // => 3
_.get(object, 'a.b.c'), // => undefined
_.get(object, 'a.b.c', 'default') // => 'default'
)
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.min.js"></script>
This will effectively check if that key, however deep, is defined and will not throw an error which might harm the flow of your program if that key is not defined.
To find if a key exists in an object, use
Object.keys(obj).includes(key)
The ES7 includes method checks if an Array includes an item or not, & is a simpler alternative to indexOf.
The easiest way to check is
"key" in object
for example:
var obj = {
a: 1,
b: 2,
}
"a" in obj // true
"c" in obj // false
Return value as true implies that key exists in the object.
Optional Chaining (?.) operator can also be used for this
Source: MDN/Operators/Optional_chaining
const adventurer = {
name: 'Alice',
cat: {
name: 'Dinah'
}
}
console.log(adventurer.dog?.name) // undefined
console.log(adventurer.cat?.name) // Dinah
An alternate approach using "Reflect"
As per MDN
Reflect is a built-in object that provides methods for interceptable
JavaScript operations.
The static Reflect.has() method works like the in operator as a
function.
var obj = {
a: undefined,
b: 1,
c: "hello world"
}
console.log(Reflect.has(obj, 'a'))
console.log(Reflect.has(obj, 'b'))
console.log(Reflect.has(obj, 'c'))
console.log(Reflect.has(obj, 'd'))
Should I use it ?
It depends.
Reflect.has() is slower than the other methods mentioned on the accepted answer (as per my benchmark test). But, if you are using it only a few times in your code, I don't see much issues with this approach.
We can use - hasOwnProperty.call(obj, key);
The underscore.js way -
if(_.has(this.options, 'login')){
//key 'login' exists in this.options
}
_.has = function(obj, key) {
return hasOwnProperty.call(obj, key);
};
If you want to check for any key at any depth on an object and account for falsey values consider this line for a utility function:
var keyExistsOn = (o, k) => k.split(".").reduce((a, c) => a.hasOwnProperty(c) ? a[c] || 1 : false, Object.assign({}, o)) === false ? false : true;
Results
var obj = {
test: "",
locals: {
test: "",
test2: false,
test3: NaN,
test4: 0,
test5: undefined,
auth: {
user: "hw"
}
}
}
keyExistsOn(obj, "")
> false
keyExistsOn(obj, "locals.test")
> true
keyExistsOn(obj, "locals.test2")
> true
keyExistsOn(obj, "locals.test3")
> true
keyExistsOn(obj, "locals.test4")
> true
keyExistsOn(obj, "locals.test5")
> true
keyExistsOn(obj, "sdsdf")
false
keyExistsOn(obj, "sdsdf.rtsd")
false
keyExistsOn(obj, "sdsdf.234d")
false
keyExistsOn(obj, "2134.sdsdf.234d")
false
keyExistsOn(obj, "locals")
true
keyExistsOn(obj, "locals.")
false
keyExistsOn(obj, "locals.auth")
true
keyExistsOn(obj, "locals.autht")
false
keyExistsOn(obj, "locals.auth.")
false
keyExistsOn(obj, "locals.auth.user")
true
keyExistsOn(obj, "locals.auth.userr")
false
keyExistsOn(obj, "locals.auth.user.")
false
keyExistsOn(obj, "locals.auth.user")
true
Also see this NPM package: https://www.npmjs.com/package/has-deep-value
While this doesn't necessarily check if a key exists, it does check for the truthiness of a value. Which undefined and null fall under.
Boolean(obj.foo)
This solution works best for me because I use typescript, and using strings like so 'foo' in obj or obj.hasOwnProperty('foo')
to check whether a key exists or not does not provide me with intellisense.
const object1 = {
a: 'something',
b: 'something',
c: 'something'
};
const key = 's';
// Object.keys(object1) will return array of the object keys ['a', 'b', 'c']
Object.keys(object1).indexOf(key) === -1 ? 'the key is not there' : 'yep the key is exist';
In 'array' world we can look on indexes as some kind of keys. What is surprising the in operator (which is good choice for object) also works with arrays. The returned value for non-existed key is undefined
let arr = ["a","b","c"]; // we have indexes: 0,1,2
delete arr[1]; // set 'empty' at index 1
arr.pop(); // remove last item
console.log(0 in arr, arr[0]);
console.log(1 in arr, arr[1]);
console.log(2 in arr, arr[2]);
Worth noting that since the introduction of ES11 you can use the nullish coalescing operator, which simplifies things a lot:
const obj = {foo: 'one', bar: 'two'};
const result = obj.foo ?? "Not found";
The code above will return "Not found" for any "falsy" values in foo. Otherwise it will return obj.foo.
See Combining with the nullish coalescing operator
JS Double Exclamation !! sign may help in this case.
const cars = {
petrol:{
price: 5000
},
gas:{
price:8000
}
}
Suppose we have the object above and If you try to log car with petrol price.
=> console.log(cars.petrol.price);
=> 5000
You'll definitely get 5000 out of it. But what if you try to get an
electric car which does not exist then you'll get undefine
=> console.log(cars.electric);
=> undefine
But using !! which is its short way to cast a variable to be a
Boolean (true or false) value.
=> console.log(!!cars.electric);
=> false
In my case, I wanted to check an NLP metadata returned by LUIS which is an object. I wanted to check if a key which is a string "FinancialRiskIntent" exists as a key inside that metadata object.
I tried to target the nested object I needed to check -> data.meta.prediction.intents (for my own purposes only, yours could be any object)
I used below code to check if the key exists:
const hasKey = 'FinancialRiskIntent' in data.meta.prediction.intents;
if(hasKey) {
console.log('The key exists.');
}
else {
console.log('The key does not exist.');
}
This is checking for a specific key which I was initially looking for.
Hope this bit helps someone.
yourArray.indexOf(yourArrayKeyName) > -1
fruit = ['apple', 'grapes', 'banana']
fruit.indexOf('apple') > -1
true
fruit = ['apple', 'grapes', 'banana']
fruit.indexOf('apple1') > -1
false
for strict object keys checking:
const object1 = {};
object1.stackoverflow = 51;
console.log(object1.hasOwnProperty('stackoverflow'));
output: true
These example can demonstrate the differences between defferent ways. Hope it will help you to pick the right one for your needs:
// Lets create object `a` using create function `A`
function A(){};
A.prototype.onProtDef=2;
A.prototype.onProtUndef=undefined;
var a=new A();
a.ownProp = 3;
a.ownPropUndef = undefined;
// Let's try different methods:
a.onProtDef; // 2
a.onProtUndef; // undefined
a.ownProp; // 3
a.ownPropUndef; // undefined
a.whatEver; // undefined
a.valueOf; // ƒ valueOf() { [native code] }
a.hasOwnProperty('onProtDef'); // false
a.hasOwnProperty('onProtUndef'); // false
a.hasOwnProperty('ownProp'); // true
a.hasOwnProperty('ownPropUndef'); // true
a.hasOwnProperty('whatEver'); // false
a.hasOwnProperty('valueOf'); // false
'onProtDef' in a; // true
'onProtUndef' in a; // true
'ownProp' in a; // true
'ownPropUndef' in a; // true
'whatEver' in a; // false
'valueOf' in a; // true (on the prototype chain - Object.valueOf)
Object.keys(a); // ["ownProp", "ownPropUndef"]
const rawObject = {};
rawObject.propertyKey = 'somethingValue';
console.log(rawObject.hasOwnProperty('somethingValue'));
// expected output: true
checking particular key present in given object, hasOwnProperty will works here.
If you have ESLint configured in your project follows ESLint rule no-prototype-builtins. The reason why has been described in the following link:
// bad
console.log(object.hasOwnProperty(key));
// good
console.log(Object.prototype.hasOwnProperty.call(object, key));
// best
const has = Object.prototype.hasOwnProperty; // cache the lookup once, in module scope.
console.log(has.call(object, key));
/* or */
import has from 'has'; // https://www.npmjs.com/package/has
console.log(has(object, key));
New awesome solution with JavaScript Destructuring:
let obj = {
"key1": "value1",
"key2": "value2",
"key3": "value3",
};
let {key1, key2, key3, key4} = obj;
// key1 = "value1"
// key2 = "value2"
// key3 = "value3"
// key4 = undefined
// Can easily use `if` here on key4
if(!key4) { console.log("key not present"); } // Key not present
Do check other use of JavaScript Destructuring
This question already has answers here:
Which equals operator (== vs ===) should be used in JavaScript comparisons?
(48 answers)
Understanding JavaScript Truthy and Falsy
(9 answers)
Closed 2 years ago.
Why Object not true if checking consumer == true?
let consumer = {
"checked": true,
"ID": "680e543457-999fc-11e6",
"fio": "John Doe",
"office": {
"ID": "fgh4d"
},
"phone": ""
};
console.log('consumer == true', consumer == true); // false
console.log('consumer === true', consumer === true); // false
console.log('Boolean(consumer)', Boolean(consumer)); // true
console.log('!consumer', !consumer); // false
if (consumer) console.log('1') // 1
Objects can't be equal to boolean.
but you can check the property checked
console.log('consumer.checked == true', consumer.checked == true); // true
console.log('consumer.checked === true', consumer.checked === true); // true
console.log('!consumer.checked', !consumer.checked); // false
if (consumer.checked) console.log('1') // 1
Additional to #VLAZ answer you can check the consumer object for undefined which results in a boolean expression.
let consumer = {
"checked": true,
"ID": "680e543457-999fc-11e6",
"fio": "John Doe",
"office": {
"ID": "fgh4d"
},
"phone": ""
};
console.log('consumer != undefined', consumer != undefined); // true
console.log('consumer !== undefined', consumer !== undefined); // true
*edit: format
consumer == true
here consumer is object, and true is boolean. Since == operator converts both variable values into same type, even though values are different. So it is False.
for example if you compare 1 == '1' it will be true. but comparing object with boolean gonna be false only.
consumer === true.
=== does not do any type conversion (coercion) and returns true only if both values and types are identical for the two variables being compared.
for example, if you compare 1 === '1' it will be false. it will be true if you compare 1 === 1. But in your case, object definitely false if you compare with boolean.
!consumer
Basically Not operator(!) reverses the boolean result of the operand. consumer holds an object, so boolean result of the operand will be true. Not operator reverses it. so it is false.
Consumer holds an object. so It will be True. so that If condition says True. Even consumer holds empty object({}) it will be True only. because it has own property.
var a = {};
a.hasOwnProperty
In JS the == and === do not mean the same. When you use == you check if the element is equal to, however the === checks if the element is equal to and the same type as the element you are comparing it with
exsample:
1 === 1 // true
"1" === 1 // false
"1" == 1 // true
1 == 1 // true
However what you are doning when typing !consumer is that you are checking if the element exists (and is not undefined, NaN or Null)
Thanks to everyone, i found what I needed, may be it would be helpful for enyone. As MDN web docs says
Do not confuse the primitive Boolean values true and false with the
true and false values of the Boolean object.
And also:
The value passed as the first parameter is converted to a boolean
value, if necessary. If the value is omitted or is 0, -0, null, false,
NaN, undefined, or the empty string (""), the object has an initial
value of false. All other values, including any object, an empty array
([]), or the string "false", create an object with an initial value of
true.
So
Boolean(consumer) // true
Your consumer isn't a boolean, so it's not equal to true.
Looks like you want to see if the value is truthy of falsy.
!consumer checks if the value is falsy.
You can do this process again:
!!consumer checks if the value is truthy.
More info about understanding truthy and falsy values in javascript
How do I check if a particular key exists in a JavaScript object or array?
If a key doesn't exist, and I try to access it, will it return false? Or throw an error?
Checking for undefined-ness is not an accurate way of testing whether a key exists. What if the key exists but the value is actually undefined?
var obj = { key: undefined };
console.log(obj["key"] !== undefined); // false, but the key exists!
You should instead use the in operator:
var obj = { key: undefined };
console.log("key" in obj); // true, regardless of the actual value
If you want to check if a key doesn't exist, remember to use parenthesis:
var obj = { not_key: undefined };
console.log(!("key" in obj)); // true if "key" doesn't exist in object
console.log(!"key" in obj); // Do not do this! It is equivalent to "false in obj"
Or, if you want to particularly test for properties of the object instance (and not inherited properties), use hasOwnProperty:
var obj = { key: undefined };
console.log(obj.hasOwnProperty("key")); // true
For performance comparison between the methods that are in, hasOwnProperty and key is undefined, see this benchmark:
Quick Answer
How do I check if a particular key exists in a JavaScript object or array?
If a key doesn't exist and I try to access it, will it return false? Or throw an error?
Accessing directly a missing property using (associative) array style or object style will return an undefined constant.
The slow and reliable in operator and hasOwnProperty method
As people have already mentioned here, you could have an object with a property associated with an "undefined" constant.
var bizzareObj = {valid_key: undefined};
In that case, you will have to use hasOwnProperty or in operator to know if the key is really there. But, but at what price?
so, I tell you...
in operator and hasOwnProperty are "methods" that use the Property Descriptor mechanism in Javascript (similar to Java reflection in the Java language).
http://www.ecma-international.org/ecma-262/5.1/#sec-8.10
The Property Descriptor type is used to explain the manipulation and reification of named property attributes. Values of the Property Descriptor type are records composed of named fields where each field’s name is an attribute name and its value is a corresponding attribute value as specified in 8.6.1. In addition, any field may be present or absent.
On the other hand, calling an object method or key will use Javascript [[Get]] mechanism. That is a far way faster!
Benchmark
https://jsben.ch/HaHQt
.
Using in operator
var result = "Impression" in array;
The result was
12,931,832 ±0.21% ops/sec 92% slower
Using hasOwnProperty
var result = array.hasOwnProperty("Impression")
The result was
16,021,758 ±0.45% ops/sec 91% slower
Accessing elements directly (brackets style)
var result = array["Impression"] === undefined
The result was
168,270,439 ±0.13 ops/sec 0.02% slower
Accessing elements directly (object style)
var result = array.Impression === undefined;
The result was
168,303,172 ±0.20% fastest
EDIT: What is the reason to assign to a property the undefined value?
That question puzzles me. In Javascript, there are at least two references for absent objects to avoid problems like this: null and undefined.
null is the primitive value that represents the intentional absence of any object value, or in short terms, the confirmed lack of value. On the other hand, undefined is an unknown value (not defined). If there is a property that will be used later with a proper value consider use null reference instead of undefined because in the initial moment the property is confirmed to lack value.
Compare:
var a = {1: null};
console.log(a[1] === undefined); // output: false. I know the value at position 1 of a[] is absent and this was by design, i.e.: the value is defined.
console.log(a[0] === undefined); // output: true. I cannot say anything about a[0] value. In this case, the key 0 was not in a[].
Advice
Avoid objects with undefined values. Check directly whenever possible and use null to initialize property values. Otherwise, use the slow in operator or hasOwnProperty() method.
EDIT: 12/04/2018 - NOT RELEVANT ANYMORE
As people have commented, modern versions of the Javascript engines (with firefox exception) have changed the approach for access properties. The current implementation is slower than the previous one for this particular case but the difference between access key and object is neglectable.
It will return undefined.
var aa = {hello: "world"};
alert( aa["hello"] ); // popup box with "world"
alert( aa["goodbye"] ); // popup box with "undefined"
undefined is a special constant value. So you can say, e.g.
// note the three equal signs so that null won't be equal to undefined
if( aa["goodbye"] === undefined ) {
// do something
}
This is probably the best way to check for missing keys. However, as is pointed out in a comment below, it's theoretically possible that you'd want to have the actual value be undefined. I've never needed to do this and can't think of a reason offhand why I'd ever want to, but just for the sake of completeness, you can use the in operator
// this works even if you have {"goodbye": undefined}
if( "goodbye" in aa ) {
// do something
}
"key" in obj
Is likely testing only object attribute values that are very different from array keys
Checking for properties of the object including inherited properties
Could be determined using the in operator which returns true if the specified property is in the specified object or its prototype chain, false otherwise
const person = { name: 'dan' };
console.log('name' in person); // true
console.log('age' in person); // false
Checking for properties of the object instance (not including inherited properties)
*2021 - Using the new method ***Object.hasOwn() as a replacement for Object.hasOwnProperty()
Object.hasOwn() is intended as a replacement for Object.hasOwnProperty() and is a new method available to use (yet still not fully supported by all browsers like safari yet but soon will be)
Object.hasOwn() is a static method which returns true if the specified object has the specified property as its own property. If the property is inherited, or does not exist, the method returns false.
const person = { name: 'dan' };
console.log(Object.hasOwn(person, 'name'));// true
console.log(Object.hasOwn(person, 'age'));// false
const person2 = Object.create({gender: 'male'});
console.log(Object.hasOwn(person2, 'gender'));// false
What is the motivation to use it over Object.prototype.hasOwnProperty? - It is recommended to this method use over the Object.hasOwnProperty() because it also works for objects created by using Object.create(null) and for objects that have overridden the inherited hasOwnProperty() method. Although it's possible to solve these kind of problems by calling Object.prototype.hasOwnProperty() on an external object, Object.hasOwn() overcome these problems, hence is preferred (see examples below)
let person = {
hasOwnProperty: function() {
return false;
},
age: 35
};
if (Object.hasOwn(person, 'age')) {
console.log(person.age); // true - the remplementation of hasOwnProperty() did not affect the Object
}
let person = Object.create(null);
person.age = 35;
if (Object.hasOwn(person, 'age')) {
console.log(person.age); // true - works regardless of how the object was created
}
More about Object.hasOwn can be found here : https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwn
Browser compatibility for Object.hasOwn - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwn#browser_compatibility
The accepted answer refers to Object. Beware using the in operator on Array to find data instead of keys:
("true" in ["true", "false"])
// -> false (Because the keys of the above Array are actually 0 and 1)
To test existing elements in an Array: Best way to find if an item is in a JavaScript array?
Three ways to check if a property is present in a javascript object:
!!obj.theProperty
Will convert value to bool. returns true for all but the false value
'theProperty' in obj
Will return true if the property exists, no matter its value (even empty)
obj.hasOwnProperty('theProperty')
Does not check the prototype chain. (since all objects have the toString method, 1 and 2 will return true on it, while 3 can return false on it.)
Reference:
http://book.mixu.net/node/ch5.html
If you are using underscore.js library then object/array operations become simple.
In your case _.has method can be used. Example:
yourArray = {age: "10"}
_.has(yourArray, "age")
returns true
But,
_.has(yourArray, "invalidKey")
returns false
Answer:
if ("key" in myObj)
{
console.log("key exists!");
}
else
{
console.log("key doesn't exist!");
}
Explanation:
The in operator will check if the key exists in the object. If you checked if the value was undefined: if (myObj["key"] === 'undefined'), you could run into problems because a key could possibly exist in your object with the undefined value.
For that reason, it is much better practice to first use the in operator and then compare the value that is inside the key once you already know it exists.
Here's a helper function I find quite useful
This keyExists(key, search) can be used to easily lookup a key within objects or arrays!
Just pass it the key you want to find, and search obj (the object or array) you want to find it in.
function keyExists(key, search) {
if (!search || (search.constructor !== Array && search.constructor !== Object)) {
return false;
}
for (var i = 0; i < search.length; i++) {
if (search[i] === key) {
return true;
}
}
return key in search;
}
// How to use it:
// Searching for keys in Arrays
console.log(keyExists('apple', ['apple', 'banana', 'orange'])); // true
console.log(keyExists('fruit', ['apple', 'banana', 'orange'])); // false
// Searching for keys in Objects
console.log(keyExists('age', {'name': 'Bill', 'age': 29 })); // true
console.log(keyExists('title', {'name': 'Jason', 'age': 29 })); // false
It's been pretty reliable and works well cross-browser.
vanila js
yourObjName.hasOwnProperty(key) : true ? false;
If you want to check if the object has at least one property in es2015
Object.keys(yourObjName).length : true ? false
ES6 solution
using Array#some and Object.keys. It will return true if given key exists in the object or false if it doesn't.
var obj = {foo: 'one', bar: 'two'};
function isKeyInObject(obj, key) {
var res = Object.keys(obj).some(v => v == key);
console.log(res);
}
isKeyInObject(obj, 'foo');
isKeyInObject(obj, 'something');
One-line example.
console.log(Object.keys({foo: 'one', bar: 'two'}).some(v => v == 'foo'));
Optional chaining operator:
const invoice = {customer: {address: {city: "foo"}}}
console.log( invoice?.customer?.address?.city )
console.log( invoice?.customer?.address?.street )
console.log( invoice?.xyz?.address?.city )
See supported browsers list
For those which have lodash included in their project:There is a lodash _.get method which tries to get "deep" keys:
Gets the value at path of object. If the resolved value is undefined,
the defaultValue is returned in its place.
var object = { 'a': [{ 'b': { 'c': 3 } }] };
console.log(
_.get(object, 'a[0].b.c'), // => 3
_.get(object, ['a', '0', 'b', 'c']), // => 3
_.get(object, 'a.b.c'), // => undefined
_.get(object, 'a.b.c', 'default') // => 'default'
)
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.min.js"></script>
This will effectively check if that key, however deep, is defined and will not throw an error which might harm the flow of your program if that key is not defined.
To find if a key exists in an object, use
Object.keys(obj).includes(key)
The ES7 includes method checks if an Array includes an item or not, & is a simpler alternative to indexOf.
The easiest way to check is
"key" in object
for example:
var obj = {
a: 1,
b: 2,
}
"a" in obj // true
"c" in obj // false
Return value as true implies that key exists in the object.
Optional Chaining (?.) operator can also be used for this
Source: MDN/Operators/Optional_chaining
const adventurer = {
name: 'Alice',
cat: {
name: 'Dinah'
}
}
console.log(adventurer.dog?.name) // undefined
console.log(adventurer.cat?.name) // Dinah
An alternate approach using "Reflect"
As per MDN
Reflect is a built-in object that provides methods for interceptable
JavaScript operations.
The static Reflect.has() method works like the in operator as a
function.
var obj = {
a: undefined,
b: 1,
c: "hello world"
}
console.log(Reflect.has(obj, 'a'))
console.log(Reflect.has(obj, 'b'))
console.log(Reflect.has(obj, 'c'))
console.log(Reflect.has(obj, 'd'))
Should I use it ?
It depends.
Reflect.has() is slower than the other methods mentioned on the accepted answer (as per my benchmark test). But, if you are using it only a few times in your code, I don't see much issues with this approach.
We can use - hasOwnProperty.call(obj, key);
The underscore.js way -
if(_.has(this.options, 'login')){
//key 'login' exists in this.options
}
_.has = function(obj, key) {
return hasOwnProperty.call(obj, key);
};
If you want to check for any key at any depth on an object and account for falsey values consider this line for a utility function:
var keyExistsOn = (o, k) => k.split(".").reduce((a, c) => a.hasOwnProperty(c) ? a[c] || 1 : false, Object.assign({}, o)) === false ? false : true;
Results
var obj = {
test: "",
locals: {
test: "",
test2: false,
test3: NaN,
test4: 0,
test5: undefined,
auth: {
user: "hw"
}
}
}
keyExistsOn(obj, "")
> false
keyExistsOn(obj, "locals.test")
> true
keyExistsOn(obj, "locals.test2")
> true
keyExistsOn(obj, "locals.test3")
> true
keyExistsOn(obj, "locals.test4")
> true
keyExistsOn(obj, "locals.test5")
> true
keyExistsOn(obj, "sdsdf")
false
keyExistsOn(obj, "sdsdf.rtsd")
false
keyExistsOn(obj, "sdsdf.234d")
false
keyExistsOn(obj, "2134.sdsdf.234d")
false
keyExistsOn(obj, "locals")
true
keyExistsOn(obj, "locals.")
false
keyExistsOn(obj, "locals.auth")
true
keyExistsOn(obj, "locals.autht")
false
keyExistsOn(obj, "locals.auth.")
false
keyExistsOn(obj, "locals.auth.user")
true
keyExistsOn(obj, "locals.auth.userr")
false
keyExistsOn(obj, "locals.auth.user.")
false
keyExistsOn(obj, "locals.auth.user")
true
Also see this NPM package: https://www.npmjs.com/package/has-deep-value
While this doesn't necessarily check if a key exists, it does check for the truthiness of a value. Which undefined and null fall under.
Boolean(obj.foo)
This solution works best for me because I use typescript, and using strings like so 'foo' in obj or obj.hasOwnProperty('foo')
to check whether a key exists or not does not provide me with intellisense.
const object1 = {
a: 'something',
b: 'something',
c: 'something'
};
const key = 's';
// Object.keys(object1) will return array of the object keys ['a', 'b', 'c']
Object.keys(object1).indexOf(key) === -1 ? 'the key is not there' : 'yep the key is exist';
In 'array' world we can look on indexes as some kind of keys. What is surprising the in operator (which is good choice for object) also works with arrays. The returned value for non-existed key is undefined
let arr = ["a","b","c"]; // we have indexes: 0,1,2
delete arr[1]; // set 'empty' at index 1
arr.pop(); // remove last item
console.log(0 in arr, arr[0]);
console.log(1 in arr, arr[1]);
console.log(2 in arr, arr[2]);
Worth noting that since the introduction of ES11 you can use the nullish coalescing operator, which simplifies things a lot:
const obj = {foo: 'one', bar: 'two'};
const result = obj.foo ?? "Not found";
The code above will return "Not found" for any "falsy" values in foo. Otherwise it will return obj.foo.
See Combining with the nullish coalescing operator
JS Double Exclamation !! sign may help in this case.
const cars = {
petrol:{
price: 5000
},
gas:{
price:8000
}
}
Suppose we have the object above and If you try to log car with petrol price.
=> console.log(cars.petrol.price);
=> 5000
You'll definitely get 5000 out of it. But what if you try to get an
electric car which does not exist then you'll get undefine
=> console.log(cars.electric);
=> undefine
But using !! which is its short way to cast a variable to be a
Boolean (true or false) value.
=> console.log(!!cars.electric);
=> false
In my case, I wanted to check an NLP metadata returned by LUIS which is an object. I wanted to check if a key which is a string "FinancialRiskIntent" exists as a key inside that metadata object.
I tried to target the nested object I needed to check -> data.meta.prediction.intents (for my own purposes only, yours could be any object)
I used below code to check if the key exists:
const hasKey = 'FinancialRiskIntent' in data.meta.prediction.intents;
if(hasKey) {
console.log('The key exists.');
}
else {
console.log('The key does not exist.');
}
This is checking for a specific key which I was initially looking for.
Hope this bit helps someone.
yourArray.indexOf(yourArrayKeyName) > -1
fruit = ['apple', 'grapes', 'banana']
fruit.indexOf('apple') > -1
true
fruit = ['apple', 'grapes', 'banana']
fruit.indexOf('apple1') > -1
false
for strict object keys checking:
const object1 = {};
object1.stackoverflow = 51;
console.log(object1.hasOwnProperty('stackoverflow'));
output: true
These example can demonstrate the differences between defferent ways. Hope it will help you to pick the right one for your needs:
// Lets create object `a` using create function `A`
function A(){};
A.prototype.onProtDef=2;
A.prototype.onProtUndef=undefined;
var a=new A();
a.ownProp = 3;
a.ownPropUndef = undefined;
// Let's try different methods:
a.onProtDef; // 2
a.onProtUndef; // undefined
a.ownProp; // 3
a.ownPropUndef; // undefined
a.whatEver; // undefined
a.valueOf; // ƒ valueOf() { [native code] }
a.hasOwnProperty('onProtDef'); // false
a.hasOwnProperty('onProtUndef'); // false
a.hasOwnProperty('ownProp'); // true
a.hasOwnProperty('ownPropUndef'); // true
a.hasOwnProperty('whatEver'); // false
a.hasOwnProperty('valueOf'); // false
'onProtDef' in a; // true
'onProtUndef' in a; // true
'ownProp' in a; // true
'ownPropUndef' in a; // true
'whatEver' in a; // false
'valueOf' in a; // true (on the prototype chain - Object.valueOf)
Object.keys(a); // ["ownProp", "ownPropUndef"]
const rawObject = {};
rawObject.propertyKey = 'somethingValue';
console.log(rawObject.hasOwnProperty('somethingValue'));
// expected output: true
checking particular key present in given object, hasOwnProperty will works here.
If you have ESLint configured in your project follows ESLint rule no-prototype-builtins. The reason why has been described in the following link:
// bad
console.log(object.hasOwnProperty(key));
// good
console.log(Object.prototype.hasOwnProperty.call(object, key));
// best
const has = Object.prototype.hasOwnProperty; // cache the lookup once, in module scope.
console.log(has.call(object, key));
/* or */
import has from 'has'; // https://www.npmjs.com/package/has
console.log(has(object, key));
New awesome solution with JavaScript Destructuring:
let obj = {
"key1": "value1",
"key2": "value2",
"key3": "value3",
};
let {key1, key2, key3, key4} = obj;
// key1 = "value1"
// key2 = "value2"
// key3 = "value3"
// key4 = undefined
// Can easily use `if` here on key4
if(!key4) { console.log("key not present"); } // Key not present
Do check other use of JavaScript Destructuring
What is the difference between expect(something).toBe(true), expect(something).toBeTruthy() and expect(something).toBeTrue()?
Note that toBeTrue() is a custom matcher introduced in jasmine-matchers among other useful and handy matchers like toHaveMethod() or toBeArrayOfStrings().
The question is meant to be generic, but, as a real-world example, I'm testing that an element is displayed in protractor. Which matcher should I use in this case?
expect(elm.isDisplayed()).toBe(true);
expect(elm.isDisplayed()).toBeTruthy();
expect(elm.isDisplayed()).toBeTrue();
What I do when I wonder something like the question asked here is go to the source.
toBe()
expect().toBe() is defined as:
function toBe() {
return {
compare: function(actual, expected) {
return {
pass: actual === expected
};
}
};
}
It performs its test with === which means that when used as expect(foo).toBe(true), it will pass only if foo actually has the value true. Truthy values won't make the test pass.
toBeTruthy()
expect().toBeTruthy() is defined as:
function toBeTruthy() {
return {
compare: function(actual) {
return {
pass: !!actual
};
}
};
}
Type coercion
A value is truthy if the coercion of this value to a boolean yields the value true. The operation !! tests for truthiness by coercing the value passed to expect to a boolean. Note that contrarily to what the currently accepted answer implies, == true is not a correct test for truthiness. You'll get funny things like
> "hello" == true
false
> "" == true
false
> [] == true
false
> [1, 2, 3] == true
false
Whereas using !! yields:
> !!"hello"
true
> !!""
false
> !![1, 2, 3]
true
> !![]
true
(Yes, empty or not, an array is truthy.)
toBeTrue()
expect().toBeTrue() is part of Jasmine-Matchers (which is registered on npm as jasmine-expect after a later project registered jasmine-matchers first).
expect().toBeTrue() is defined as:
function toBeTrue(actual) {
return actual === true ||
is(actual, 'Boolean') &&
actual.valueOf();
}
The difference with expect().toBeTrue() and expect().toBe(true) is that expect().toBeTrue() tests whether it is dealing with a Boolean object. expect(new Boolean(true)).toBe(true) would fail whereas expect(new Boolean(true)).toBeTrue() would pass. This is because of this funny thing:
> new Boolean(true) === true
false
> new Boolean(true) === false
false
At least it is truthy:
> !!new Boolean(true)
true
Which is best suited for use with elem.isDisplayed()?
Ultimately Protractor hands off this request to Selenium. The documentation states that the value produced by .isDisplayed() is a promise that resolves to a boolean. I would take it at face value and use .toBeTrue() or .toBe(true). If I found a case where the implementation returns truthy/falsy values, I would file a bug report.
Disclamer: This is just a wild guess
I know everybody loves an easy-to-read list:
toBe(<value>) - The returned value is the same as <value>
toBeTrue() - Checks if the returned value is true
toBeTruthy() - Check if the value, when cast to a boolean, will be a truthy value
Truthy values are all values that aren't 0, '' (empty string), false, null, NaN, undefined or [] (empty array)*.
* Notice that when you run !![], it returns true, but when you run [] == false it also returns true. It depends on how it is implemented. In other words: (!![]) === ([] == false)
On your example, toBe(true) and toBeTrue() will yield the same results.
In javascript there are trues and truthys. When something is true it is obviously true or false. When something is truthy it may or may not be a boolean, but the "cast" value of is a boolean.
Examples.
true == true; // (true) true
1 == true; // (true) truthy
"hello" == true; // (true) truthy
[1, 2, 3] == true; // (true) truthy
[] == false; // (true) truthy
false == false; // (true) true
0 == false; // (true) truthy
"" == false; // (true) truthy
undefined == false; // (true) truthy
null == false; // (true) truthy
This can make things simpler if you want to check if a string is set or an array has any values.
var users = [];
if(users) {
// this array is populated. do something with the array
}
var name = "";
if(!name) {
// you forgot to enter your name!
}
And as stated. expect(something).toBe(true) and expect(something).toBeTrue() is the same. But expect(something).toBeTruthy() is not the same as either of those.
As you read through the examples below, just keep in mind this difference
true === true // true
"string" === true // false
1 === true // false
{} === true // false
But
Boolean("string") === true // true
Boolean(1) === true // true
Boolean({}) === true // true
1. expect(statement).toBe(true)
Assertion passes when the statement passed to expect() evaluates to true
expect(true).toBe(true) // pass
expect("123" === "123").toBe(true) // pass
In all other cases cases it would fail
expect("string").toBe(true) // fail
expect(1).toBe(true); // fail
expect({}).toBe(true) // fail
Even though all of these statements would evaluate to true when doing Boolean():
So you can think of it as 'strict' comparison
2. expect(statement).toBeTrue()
This one does exactly the same type of comparison as .toBe(true), but was introduced in Jasmine recently in version 3.5.0 on Sep 20, 2019
3. expect(statement).toBeTruthy()
toBeTruthy on the other hand, evaluates the output of the statement into boolean first and then does comparison
expect(false).toBeTruthy() // fail
expect(null).toBeTruthy() // fail
expect(undefined).toBeTruthy() // fail
expect(NaN).toBeTruthy() // fail
expect("").toBeTruthy() // fail
expect(0).toBeTruthy() // fail
And IN ALL OTHER CASES it would pass, for example
expect("string").toBeTruthy() // pass
expect(1).toBeTruthy() // pass
expect({}).toBeTruthy() // pass
There are a lot many good answers out there, i just wanted to add a scenario where the usage of these expectations might be helpful. Using element.all(xxx), if i need to check if all elements are displayed at a single run, i can perform -
expect(element.all(xxx).isDisplayed()).toBeTruthy(); //Expectation passes
expect(element.all(xxx).isDisplayed()).toBe(true); //Expectation fails
expect(element.all(xxx).isDisplayed()).toBeTrue(); //Expectation fails
Reason being .all() returns an array of values and so all kinds of expectations(getText, isPresent, etc...) can be performed with toBeTruthy() when .all() comes into picture. Hope this helps.
We have some questions here that discuss delete in a more abstracted way, but I'm looking for practical examples of when use of delete could be used, versus doing something such as setting the property to null or undefined.
The delete operator deletes a property of an object.
What's a case of a challenge faced somewhere, that delete was the best solution, versus something else?
When using an object as a hashmap, you can iterate over the object's properties using:
for (var key in obj) {
// ...
}
If some properties of that objects were set to null, their keys would be included there. By using delete you can remove their keys completely.
Object.defineProperty(Object.prototype, "Incognito", {
get: function() { return 42; },
set: function() { },
configurable: true
});
console.log(({}).Incognito); // 42
({}).Incognito = null;
console.log(({}).Incognito); // 42
// I DO NOT WANT INCOGNITO
delete Object.prototype.Incognito
console.log(({}).Incognito); // undefined
Any property which has an empty setter (Because someone thought that was a good idea) needs to be deleted if you want to get rid of it.
var hash = {
"FALSE": undefined,
"TRUE": null
}
console.log("TRUE" in hash); // true
console.log("FALSE" in hash); // true
delete hash.FALSE;
console.log("FALSE" in hash); // false
The in operator returns true for any property that exist no matter it's value. If you want it to return false you need to delete the property.
In both these cases setting it to null or undefined does nothing (Because it either has a setter that does nothing, or that's how the in operator works)
Setting an object's property to null or undefined will still leave the property as enumerable - if you're going to do a for..in over the object at any stage and the presence of a property is significant, this is when you'd want to delete instead.
For example, if you have one constructor which takes arguments as an object, which inherits from another constructor which does the same and the presence of a property is significant when calling the parent constructor (say, in the example below, that ParentWidgets used its arguments with a for..in to generate HTML attributes) you would want to use delete to remove properties which aren't relevant to the parent:
function ChildWidget(kwargs) {
kwargs = extend({
childSpecific1: null, childSpecific2: 42
}, kwargs || {})
this.childSpecific1 = kwargs.childSpecific1
this.childSpecific2 = kwargs.childSpecific2
delete kwargs.childSpecific1
delete kwargs.childSpecific2
ParentWidget.call(this, kwargs)
}
inherits(ChildWidget, ParentWidget)
The delete operator is useful in a reset or clear method for removing object literal data tied to forms:
delete formmap["forms"]
It is also useful for deleting objects tied to state:
/* lights... */
if (node["alpha"+i].active)
{
// camera, action
node["beta"+i] = chi;
}
else
{
/* cut! */
delete node["beta"+i];
node["omega"].state = false;
}
In addition, it's useful as a shorthand for inlining optional object properties:
var foo = {"bar": [], "drink": [], "tab": [] }
// happy hour
this.bar && (foo["bar"]).push(this.bar) || delete foo.bar;
// open a tab
this.drink && (foo["drink"]).push(this.drink) || delete foo.drink;
// cheers
this.tab && (foo["tab"]).push(this.tab) || delete foo.tab;
Finally, it's useful as a way to distinguish between types by using the writable permissions of type specific instance properties as a litmus test:
// Function
!!foo.prototype === true && delete foo.length === false && delete foo[-1] === true
// Object, Number, Infinity, or Boolean (probably Object)
!!foo.prototype === false && delete foo.length === true && delete foo[-1] === true
// Array
!!foo.prototype === false && delete foo.length === false && delete foo[-1] === true
// String
!!foo.prototype === false && delete foo.length === false && delete foo[-1] === false
// RegExp
delete foo.source === false
References
Adobe Flash Platform: delete statement
JScript Reference: Delete Operator