In this blog post, We are going to cover the following things.
- a static keyword in typescript.
- const in angular.
- How to define public static constants in typescript and angular
- the difference between static and const keywords in typescript and javascript
Static in typescript
Like any other object-oriented programming, Typescript has object and classes
Objects contain instance member variables and functions which can be accessed using the object. A class contains static member variables and functions which can be accessed using the class.
Here is an example of class static and instance variables
class User {
static defaultRole: string = "employee";
name: string;
constructor(name: string) {
this.name = name;
}
getName() {
return name;
}
}
User.defaultRole; // returns employee
let myuser = new User("John");
myuser.name; // returns John
In the above class defaultRole is a static that belongs to a class name is an instance of a class that belongs to the object of a class
const in Angular and typescript
Declared public const member variable in Angular component
export class AppComponent {
public static text: string;
constructor() {}
}
is this code works?
No, It will not work and gives a compilation error A class member cannot have the ‘const’ keyword
class members are mutable and modified and accessed by different calls and objects.
Then how do you replace const with another?
typescript provides a readonly modifier
field instead of const,
These readonly can be reassigned unlike the const keyword
export class AppComponent {
public text: string;
constructor() {}
}
How do declare static const in Angular and typescript
As the const field does not declare in a class instance variable
In a class, you can declare public static readonly for static constants.
class Employee {
static readonly staticVariable = "staticdata";
readonly instanceVariable = "instanceData";
}
Once the class is declared, You can import using the import
import { Employee } from "./Employee";
console.log(Employee.staticVariable);
console.log(new Employee().instanceVariable);
Difference Between Static and Const in JavaScript and typescript
Both static and const are used in a variable declaration
static variable and functions
Static variable is a class variable that is shared by all objects of a class
Static functions also declared can access static variables only
It can be accessed using class only
Static classes can also be used
The value of a static variable can be changed
const variable
const keyword is used to define the variables for constants
It is assigned a fixed value and can not be changed
Variables for constant can be normal types, objects, and arrays
const variables can be declared/reassigned in different local or block scope
export const constants = {
WEEK_NAMES: [
"SUNDAY",
"MONDAY",
"TUESDAY",
"WEDNESDAY",
"THURSDAY",
"FRIDAY",
"SATURDAY",
],
MONTH_NAMES: ["JAN", "FEB", "MAR"],
};