Could it be a glitch or the intended functionality when a Typescript derived class static property returns undefined?

Question

Could it be a glitch or the intended functionality when a Typescript derived class static property returns undefined?

Currently, I am delving into typescript and have stumbled upon a peculiar behavior. It seems there are multiple instances of a static property in this scenario; one for the person class and another for the student class. To my surprise, while exploring similar situations in other languages like C#, I discovered that there is only one instance shared by the declaring class and all classes derived from it.

class person
{
    name : string 
    static maxAge : number
    constructor(name:string)
    {
        this.name = name
    }
}
class student extends person
{
    standard : string
    constructor(name:string,standard : string)
    {
        super(name);
        this.standard = standard;
    }
}
person.maxAge = 120;
console.log(person.maxAge);
console.log(student.maxAge);

Here are some burning questions on my mind:

I'm curious as to why the static property is not shared with the derived class.
Could it be possible that the compiler is overlooking something crucial here, thereby failing to flag any compilation errors?

inheritance typescript static

Answer 1

Answer №1

I want to know why static properties are not shared with derived classes?

They are shared at the moment of inheritance. Instead of setting person.maxAge = 120;, you should do it this way:

class person
{
    name : string 
    static maxAge : number = 120
    constructor(name:string)
    {
        this.name = name
    }
}
class student extends person
{
    standard : string
    constructor(name:string,standard : string)
    {
        super(name);
        this.standard = standard;
    }
}
console.log(person.maxAge);
console.log(student.maxAge);

Is the compiler missing something here that prevents giving a compilation error?

No, the compiler trusts you just like in this example:

let foo: number;
console.log(foo); // No error
foo = 123;

The compiler isn't psychic (although TypeScript can feel like that sometimes 🌹) but it does its best to prevent errors.

Answer 2

I want to know why static properties are not shared with derived classes?

They are shared at the moment of inheritance. Instead of setting person.maxAge = 120;, you should do it this way:

class person
{
    name : string 
    static maxAge : number = 120
    constructor(name:string)
    {
        this.name = name
    }
}
class student extends person
{
    standard : string
    constructor(name:string,standard : string)
    {
        super(name);
        this.standard = standard;
    }
}
console.log(person.maxAge);
console.log(student.maxAge);

Is the compiler missing something here that prevents giving a compilation error?

No, the compiler trusts you just like in this example:

let foo: number;
console.log(foo); // No error
foo = 123;

The compiler isn't psychic (although TypeScript can feel like that sometimes 🌹) but it does its best to prevent errors.

Answer 3

Answer №2

JavaScript follows a prototype-based structure, so the property is shared through the prototype chain. This means when searching for student.maxAge, the runtime will look in the current object, then its prototype, and continue up the chain of inheritance until it finds maxAge in the prototype of person.

https://i.sstatic.net/SSqfQ.png

Your code snippet contains no TypeScript or JavaScript errors.

Answer 4

JavaScript follows a prototype-based structure, so the property is shared through the prototype chain. This means when searching for student.maxAge, the runtime will look in the current object, then its prototype, and continue up the chain of inheritance until it finds maxAge in the prototype of person.

https://i.sstatic.net/SSqfQ.png

Your code snippet contains no TypeScript or JavaScript errors.

Could it be a glitch or the intended functionality when a Typescript derived class static property returns undefined?

Answer №1

Answer №2

https://i.sstatic.net/SSqfQ.png

Similar questions

Encountering the "Vue is not a function" issue while using my to-do list application

Angular 6 allows for the use of radio buttons to dynamically enable or disable corresponding fields

Having trouble configuring custom SCSS Vuetify variables with Vue 3, Vite, Typescript, and Vuetify 3

Jest unit tests in Angular using Typescript are not detecting failures when it comes to console errors or unrecognized elements

Tips for waiting for an Http response in TypeScript with Angular 5

Cannot assign type void to 'Intrinsic Attributes & Dispatch<SetStateAction<>>'

Creating nested Angular form groups is essential for organizing form fields in a hierarchical structure that reflects

What is the most effective method for integrating templates using AngularJS and Webpack2?

Using RxJS to merge various HTTP requests into a unified and flattened observable array

Troubles with Declaration Merging in Angular 2 Implementation

Every variable declaration that follows must match the data type of the initial declaration

You were supposed to provide 2 arguments, but you only gave 1.ts(2554)

Is there an Angular @input attribute that concludes with an exclamation mark?

Typescript having issues compiling to commonjs/es2015 accurately

Unable to initiate ng-click event in AngularJS

Tips on incorporating jstree into an Angular 2 application with TypeScript and @types/jstree

The SDK directory for TypeScript 1.3 in Visual Studio 2013 does not include the necessary tsc.exe file

Standardized identification code

The function navigator.canShare() encountered a permissions denial while running in Typescript

This TypeScript error occurs when the type of a CSS file lacks an index signature, resulting in an implicit 'any' type for the element