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 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 object of a class
const in Angular and typescript
Declared public const member variable in Angular component
export class AppComponent {
public static const 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 readonly modifier
field instead of const,
These readonly can be reassigned unlike const keyword
export class AppComponent {
public const text:string;
constructor() {
}
}
How do declare static const in Angular and typescript
As const field does not declared 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
- Value of a static variable can be changed
const variable
- const keyword is used to define the variables for constants
- It is assigned with 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"]
};