JavaScript Objects: Part 3 in operator and for...in statement

In the previous part we discuss about the dot and bracket notations, lets now discuss about the in operator and for..in statements that are used in objects.

First in operator, it is used to find whether a key we are looking for is in the object or in its prototype chain. Lets look into details with an example.

The syntax for in operator is key in object. key is a string or symbol that represents property key name, object represents object name in which we are executing the in operator.

let admin = {
    fname: "kiran",
    lname: "raj",
    email: "kiranr@gmail.com",
    admin: true,
    greet: function(){
       console.log(`Hello ${this. name}`);
    }
}

console.log("lname" in admin); // Output: true
console.log("fn" in admin);    // Output: false  

The above code contain a object admin with some properties and a method, last two lines show the in operator in action. In the "lname" in admin code we are checking whether lname is a key in admin object, since we have a property with lname in object, the code returns true. When we check "fn" in admin it returns false as there is no key with name fn in admin object. Remember to enclose keys in quotes except for integer values. The code console.log("greet" in admin) will print true in the console.

Lets look at one more example

let name = {
    fullname :{
    fname: "kiran",
    lname: "raj",
    },
    email: "kiranr@gmail.com",
}

console.log("fname" in name);          // Output : false
console.log("fname" in name.fullname); // Output : true

Now we will look at the for..in statement using a code snippet, before that, for..in statement iterates over properties with keys that are strings or can be converted into strings, symbols keys are ignored.

let admin = {
    fname: "kiran",
    lname: "raj",
    email: "kiranr@gmail.com",
    admin: true,
    greet: function(){
       console.log(`Hello ${this. name}`);
    }
}

for (key in admin){
    console.log(`key is ${key} and value is ${admin[key]}`);
}

Output

key is fname and value is kiran
key is lname and value is raj
key is email and value is kiranr@gmail.com
key is admin and value is true
key is greet and value is function(){
    console.log(`Hello ${this. name}`); }

Here we use the for..in statement to object admin the syntax of for..in statement is

for (variable in object)
  statement

variable get different property key name in each iteration, in our case it will be fname, lname, email, admin and greet. object represent object name in which we need to iterate. statement will be executed in each iteration.

Remember: for...in statement iterates over enumerable, non Symbol properties of an objects only. It also iterates through the inherited enumerable properties.

Part 1: Object Basics
Part 2: Dot vs Bracket
Part 4: Constructors and this
Part 5: Object duplication