JavaScript Day 22 — Mastering JavaScript Basics: A Comprehensive Guide for Interview Preparation

100 Days of JavaScript Interview Prep: A Beginner’s Journey

Welcome to Day 22–100 Days of JavaScript Interview Prep: A Beginner’s Journey

Embarking on a 100-day adventure focused on learning, practice, and growth sounds like an incredibly rewarding journey.

DAY 22 (April 13th, 2024) — ES6 Classes Part-4 Interview Questions ?

Note — Most important interview question

Question 1 — How to define ES6 Class Declaration and Expression with example?

Answer :

As per our Part 1, Part 2 and Part 3 article’s we can now relate Classes in nothing but special function’s

We can also define classes as function declaration and function expression.

If you need to under what is declaration and function expression, please consider our Day 11 (Please find below link for brush-up)

Let’s now understand ES6 Class w.r.t to declaration and expression

Declaration

// Declaration 
class Mycard {
  constructor(name, address) {
    this.name = name;
    this.address = address;
  }
}

Expression

1) Class is anonymous but assigned to a variable.

const MyCard = class {
  constructor(name, addres) {
    this.name = name;
    this.address = address;
  }
};

2) Class with name and assigned to MyCard variable

// Expression; the class has its own name
const MyCard = class Card {
 constructor(name, addres) {
    this.name = name;
    this.address = address;
  }
};

Question 2 — What do you understand by class body ?

Answer —

Class body is the part which is covered by {} and it refers to the block of code which defines the behavior and structure of a class.

It defines the entire definition and implementation.

We define methods, constructors and other fields inside class body.

class MyCard {
// start of body 
  static #address = 'test address'; // static field. 
   getDetail(){ // normal method
     return "this is my normal function whichtance"
   }
// end of body
}

Question 3 — What do you understand by Class Element ?

Answer : Class elements means fields or properties and methods.

Class Elements can be explained as below (K L and V)

K refers to Kind, L refer to location and V refers to Visibility

Kind: Getter, setter, method, or field

Location: Static or instance

Visibility: Public or private

Let’s understand with some examples below

class MyCard {
  constructor(firstName, address) {
    this.firstName = firstName;
    this.address = address;
  }
  // Getter 
  get details() {
    return this.myDetails();
  }
  // Method
  myDetails() {
    return `My Name is ${this.firstName} and my address is ${this.address}`;
  }
 
}

const personalDetail= new MyCard('kirti', 'test address');

console.log(personalDetail.details); 

Question 4— How we can define static method and how we can access it ?

Answer -

To define static method or properties, we need to use static a keyboard.

Static properties (fields and methods) are defined on the class itself instead of each instance.

Usage -

To create utility functions or consider it as helper classes

It also helps us to create caches, fixed configuration or data which doesn’t need to replication.

Please find below example with output.

class MyCard {
    // Static variable
    static bedroom= 0;

    // Static method
    static addBedroom() {
        MyCard.bedroom++;
    }

    // Static method accessing static variable
    static getBedroomDetails() {
        return MyCard.bedroom;
    }
}

// Accessing static variable directly
console.log("Intial Value of bedroom:", MyCard.bedroom);  

// Incrementing static variable using static method
MyCard.addBedroom();
console.log("Modified BedRoom:", MyCard.bedroom);  


// Accessing static variable using static method
console.log("Our Method :", MyCard.getBedroomDetails());  

We will still continue with our classes in our tomorrow blog.

Go slow always with Classes Concept :)

Happy Coding and Stay Tuned :)

Kind is cool !!!

Share knowledge to gain knowledge !!!!

Be kind and treat people with respect !!!

If you find my blog helpful, then please subscribe, claps and follow to support :)