TypeError: Cannot use 'in' operator to search for 'X' in 'Y'

avatar
Borislav Hadzhiev

Last updated: Apr 20, 2023
5 min

banner

# Table of Contents

  1. TypeError: Cannot use 'in' operator to search for 'X' in 'Y'
  2. Use the includes() method to check if a substring exists in a string
  3. Use the JSON.parse() method to parse JSON strings to native JS Objects
  4. The value to the right of the in operator cannot be null or undefined
  5. Checking if the variable is an object before using the in operator
  6. Using the in operator with an array

# TypeError: Cannot use 'in' operator to search for 'X' in 'Y'

The JavaScript "TypeError: Cannot use 'in' operator to search for 'X' in 'Y'" occurs for multiple reasons:

  1. Trying to use the in operator with primitive values (e.g. to check if a substring exists in a string).
  2. Using the in operator with a null or undefined right-hand side value.
  3. Forgetting to parse a JSON string to a JavaScript object before using the in operator.
  4. Using the in operator with a right-hand side value that is not an object or an array.

cannot use in operator to search for

# Use the includes() method to check if a substring exists in a string

Here is an example of how the error occurs.

index.js
// ⛔️ TypeError: Cannot use 'in' operator to search for 'bobby' in bobbyhadz.com console.log('bobby' in 'bobbyhadz.com');

The error is caused because the in operator cannot be used to check if a substring is in a string.

The operator is used to check if a key exists in an object or whether an index exists in an array.

index.js
// ✅ correct usage of `in` operator const obj = { id: 1, site: 'bobbyhadz.com', }; console.log('site' in obj); // 👉️ true console.log('abc' in obj); // 👉️ false

If you need to check if a substring is contained in a string, use the String.includes() method.

index.js
// 👇️ true console.log('bobbyhadz.com'.includes('bobby')); // 👇️ false console.log('bobbyhadz.com'.includes('abc')); if ('bobbyhadz.com'.includes('bobby')) { // 👇️ this runs console.log('The substring is contained in the string'); } else { console.log('The substring is NOT contained in the string'); }

check if substring in string

Note that the String.includes() method is case-sensitive.

If you need to check if a substring is in a string ignoring the case, convert both strings to lowercase.

index.js
// 👇️ true console.log( 'bobbyhadz.com'.toLowerCase().includes('bobby'.toLowerCase()), ); // 👇️ false console.log( 'bobbyhadz.com'.toLowerCase().includes('abc'.toLowerCase()), ); if ( 'bobbyhadz.com'.toLowerCase().includes('bobby'.toLowerCase()) ) { // 👇️ This runs console.log('The substring is contained in the string'); } else { console.log('The substring is NOT contained in the string'); }

The code sample uses the String.toLowerCase() method to convert both strings to lowercase before calling includes().

# Use the JSON.parse() method to parse JSON strings to native JS Objects

Here is another example of how the error occurs.

index.js
const myJSON = '{"id": 1, "site": "bobbyhadz.com"}'; console.log(typeof myJSON); // 👉️ string // ⛔️ TypeError: Cannot use 'in' operator to search for 'site' in {"id": 1, "site": "bobbyhadz.com"} console.log('site' in myJSON);

The myJSON variable stores a JSON string, not a native JavaScript object.

To solve the error, use the JSON.parse method to parse the JSON string into a native JavaScript object before using the in operator.

index.js
const myJSON = '{"id": 1, "site": "bobbyhadz.com"}'; const obj = JSON.parse(myJSON); console.log(typeof obj); // 👉️ object console.log('site' in obj); // 👉️ true console.log('abc' in obj); // 👉️ false

parse json string before using in operator

The JSON.parse() method converts the JSON string to a native JavaScript object which enables us to use the in operator to check if the property exists in the object.

# The value to the right of the in operator cannot be null or undefined

Another common cause of the error is if the value to the right-hand side of the in operator is equal to null or undefined.

index.js
const obj = null; // ⛔️ TypeError: Cannot use 'in' operator to search for 'bobby' in null console.log('bobby' in obj);

You can console.log() the variable to check if it is null.

Here is an example that provides a default value if the variable is null or undefined.

index.js
const obj = null; console.log('bobby' in (obj || {})); // 👉️ false const obj2 = undefined; console.log('bobby' in (obj2 || {})); // 👉️ false

We used the logical OR (||) operator to provide a fallback value if the variable stores a falsy value (e.g. null or undefined).

If the variable stores a falsy value, then an empty object is returned and the in operator returns false.

# Checking if the variable is an object before using the in operator

An alternative approach to solving the error is to check if the variable is an object before using the in operator.

index.js
function isObject(value) { return ( typeof value === 'object' && value !== null && !Array.isArray(value) ); } const obj = {id: 1, site: 'bobbyhadz.com'}; if (isObject(obj)) { // 👇️ this runs console.log('site' in obj); // 👉️ true } else { console.log('The value is NOT an object'); }

The isObject function returns true if the value is an object and false otherwise.

If the value is an object, we can safely use the in operator to check if the key exists in the object.

Otherwise, the else block runs.

If you'd like to read more on how to check if a variable stores an object, check out the following article.

# Using the in operator with an array

When using the in operator with an array, note that it checks if an array index exists, it doesn't check whether a value is contained in an array.

index.js
const arr = ['bobby', 'hadz', 'com']; console.log(1 in arr); // 👉️ true console.log('bobby' in arr); // 👉️ false

If you are trying to check if an array index exists, check out the following article.

If you need to check if a value is contained in an array, you have to use the Array.includes() method.

index.js
const arr = ['bobby', 'hadz', 'com']; console.log(arr.includes('bobby')); // 👉️ true console.log(arr.includes('abc')); // 👉️ false if (arr.includes('bobby')) { // 👇️ this runs console.log('The value is contained in the array'); } else { console.log('The value is NOT contained in the array'); }

I've also written articles on:

# Conclusion

To solve the "TypeError: Cannot use 'in' operator to search for 'X' in 'Y'", make sure:

  1. To only use the in operator with an object or array right-hand side value.
  2. To use the String.includes() when checking if a string is contained in a substring.
  3. To use the Array.includes() method to check if a value is contained in an array.
  4. The value on the right-hand side of the in operator is not null or undefined.
  5. To parse your JSON strings into native JavaScript objects before using the in operator.

# Additional Resources

You can learn more about the related topics by checking out the following tutorials:

I wrote a book in which I share everything I know about how to become a better, more efficient programmer.
book cover
You can use the search field on my Home Page to filter through all of my articles.