JavaScript In Operator
Tags: javascript, operator, webdev, beginners
Published: 2020-08-24 12:58:32

---
title: JavaScript In Operator
published: true
description: At it's core, the JavaScript IN operator looks pretty simple. But, as I learned, it's not super intuitive.
tags: JavaScript, Operator, WebDev, Beginner
series: JavaScript Details
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/nimug2p2gk9wekhascmq.png
---

## The Question

I recently saw [a quiz question](https://twitter.com/katepapineni/status/1295928044784361474?s=20) asking "what is the output of ..."

```javascript
3 in [1, 2, 3]
```

I got it right, but wanted to dig further into what the `in` operator does and can do.

## Research

On the [MDN web docs](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/in), there is some good information.

At it's core, this operator looks pretty simple. But, as the quiz above shows, it's not super intuitive.

### The Syntax

The `in` operator is an built-in operator in JavaScript which is used to check whether a particular property exists in an object or not. It returns boolean value `true` if the specified property is in an object, otherwise it returns `false`.

***prop*** in ***object***

### The Parameters

***prop***

> A string or symbol representing a property name or array index (non-symbols will be coerced to strings).

***object***

> Object to check if it (or its prototype chain) contains the property with specified name (prop).

### Basic Use-Cases

```javascript
// Arrays
let people = ['bob', 'jen', 'patrick', 'anne', 'tim'];
const person1 = 0 in people;        // true
const person2 = 3 in people;        // true
const person3 = 6 in people;        // false
const person4 = 'tom' in people;    // false
// (the index number must be specified, not the value at that index)
const person5 = 'length' in people; // true
// (length is a property of an Array)
const person6 = Symbol.iterator in people;
// true (arrays are iterable, works only in ES2015+)

// Predefined Objects
const hasPI = 'PI' in Math;         // true

// Custom objects
let car = { make: 'Ram', model: '1500', year: 2015 };
const hasMake = 'make' in car;      // true
const hasModel = 'model' in car;    // true
```

An Object must specified on the right side of the `in` operator. A string created with the `String` constructor can be used, but a string literal cannot.

```javascript
let color1 = new String('green');
const hasLength1 = 'length' in color1;
// true

let color2 = 'red';
const hasLength2 = 'length' in color2;
// generates an error (color2 is not a String object)
```

### `Deleted` and `Undefined`

If a property is deleted with the `delete` operator, the `in` operator returns `false` for that property.

If a property is set to `undefined` but not deleted, the `in` operator returns `true` for that property.

The `in` operator will return `false` for empty array slots. Even if accessing it directly returns `undefined`.

To avoid this, make sure a new array is always filled with non-empty values or not write to indexes past the end of array.

```javascript
let empty = new Array(3).fill(undefined)
const isEmpty = 2 in empty
// true
```

### Inherited properties

The `in` operator returns `true` for properties in the prototype chain. (To check for only non-inherited properties, use `Object.prototype.hasOwnProperty()` instead.)

```javascript
const hasToString = 'toString' in {}
// true
```