1

How to Narrow a Type of Derived Class Instances while Processing an Array ?

 3 weeks ago
source link: https://www.geeksforgeeks.org/how-to-narrow-a-type-of-derived-class-instances-while-processing-an-array/
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.

How to Narrow a Type of Derived Class Instances while Processing an Array ?

Last Updated : 21 Feb, 2024

When it comes to JavaScript arrays that contain derived class instances, narrowing down the types is a must to access the specific functions or properties that are unique to those derived classes. Narrowing encompasses an act of specifically type-checking and casting objects explicitly to their derived types.

Using instanceof Operator

The instanceof operator checks if an object is an instance of a particular class or its prototype chain. It’s commonly used to determine the type of an object in JavaScript. This approach is straightforward and widely used, especially when dealing with inheritance hierarchies.

Syntax:

if (object instanceof DerivedClass) {
    // Process object as DerivedClass
}

Example: The below example will explain the use of instanceof operator to narrow a type of derived class.

  • Javascript
interface Animal {
makeSound(): void;
}
class Dog implements Animal {
makeSound() {
console.log("Woof woof!");
}
}
class Cat implements Animal {
makeSound() {
console.log("Meow meow!");
}
}
const animals: Animal[] = [new Dog(), new Cat(), new Dog()];
for (const animal of animals) {
if (animal instanceof Dog) {
console.log("Dog instance found");
animal.makeSound();
} else if (animal instanceof Cat) {
console.log("Cat instance found");
animal.makeSound();
}
}

Output:

Dog instance found
Woof woof!
Cat instance found
Meow meow!
Dog instance found
Woof woof!

Using Constructor Property

Each JavaScript object has a constructor property which refers to the constructor function that created it. By comparing the constructor property of an object with a specific constructor function, you can identify the type of the object. This method provides a direct way to check the constructor function of an object and can be useful in certain scenarios.

Syntax:

if (object.constructor === DerivedClass) {
    // Process object as DerivedClass
}

Example: The below example will explain the use of constructor property tonarrow a type of derived class.

  • Javascript
interface Shape {
draw(): void;
}
class Circle implements Shape {
draw() {
console.log("Drawing a circle");
}
}
class Rectangle implements Shape {
draw() {
console.log("Drawing a rectangle");
}
}
const shapes: Shape[] =
[new Circle(), new Rectangle(), new Circle()];
for (const shape of shapes) {
if (shape.constructor === Circle) {
console.log("Circle instance found");
(shape as Circle).draw();
}
else if (shape.constructor === Rectangle) {
console.log("Rectangle instance found");
(shape as Rectangle).draw();
}
}

Output:

Circle instance found
Drawing a circle
Rectangle instance found
Drawing a rectangle
Circle instance found
Drawing a circle

“This course was packed with amazing and well-organized content! The project-based approach of this course made it even better to understand concepts faster. Also the instructor in the live classes is really good and knowledgeable.”- Tejas | Deutsche Bank

With our revamped Full Stack Development Program: master Node.js and React that enables you to create dynamic web applications.

So get ready for salary hike only with our Full Stack Development Course.

Like Article
Suggest improvement
Share your thoughts in the comments

report

Recommend

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK