Skip to content

Commit ed885e7

Browse files
priyavratamohanpriyavratamohan
committed
Added tsx title='typescript' and made changes for best coding practices
1 parent 6d773b7 commit ed885e7

File tree

7 files changed

+162
-162
lines changed

7 files changed

+162
-162
lines changed

‎docs/typescript/advanced-types-ts.md

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ Intersection types allow you to combine multiple types into one, creating a type
1515

1616
Example -
1717

18-
```<js title='typescript'>
18+
```tsx title='typescript'
1919
interface Dog {
2020
bark(): void;
2121
}
@@ -53,7 +53,7 @@ Type guards are runtime checks that allow TypeScript to infer more specific type
5353

5454
Example -
5555

56-
```<js title='typescript'>
56+
```tsx title='typescript'
5757
function isNumber(x: any): x is number {
5858
return typeof x === "number";
5959
}
@@ -77,7 +77,7 @@ Type casting allows you to assert the type of a value, informing TypeScript's ty
7777

7878
Example -
7979

80-
```<js title='typescript'>
80+
```tsx title='typescript'
8181
let someValue: any = "hello";
8282
let strLength: number = (someValue as string).length;
8383
console.log(strLength); // Output: 5
@@ -89,7 +89,7 @@ Type assertions provide a way to override TypeScript's type inference and explic
8989

9090
Example -
9191

92-
```<js title='typescript'>
92+
```tsx title='typescript'
9393
let someValue: any = "hello";
9494
let strLength: number = (someValue as string).length;
9595
console.log(strLength); // Output: 5

‎docs/typescript/classes-ts.md

Lines changed: 132 additions & 132 deletions
Original file line numberDiff line numberDiff line change
@@ -30,24 +30,24 @@ Classes are blueprints for creating objects with predefined properties and metho
3030

3131
Example:
3232

33-
```<js title='typescript'>
34-
class Person {
35-
name: string;
36-
age: number;
37-
38-
constructor(name: string, age: number) {
39-
this.name = name;
40-
this.age = age;
41-
}
33+
```tsx title='typescript'
34+
class Person {
35+
name: string;
36+
age: number;
37+
38+
constructor(name: string, age: number) {
39+
this.name = name;
40+
this.age = age;
41+
}
4242

43-
greet(): void {
44-
console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
43+
greet(): void {
44+
console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
45+
}
4546
}
46-
}
4747

48-
let person = new Person("Alice", 30);
49-
person.greet(); // Output: Hello, my name is Alice and I am 30 years old.
50-
```
48+
let person = new Person("Alice", 30);
49+
person.greet(); // Output: Hello, my name is Alice and I am 30 years old.
50+
```
5151

5252
## 2. Access Modifiers
5353

@@ -56,191 +56,191 @@ person.greet(); // Output: Hello, my name is Alice and I am 30 years old.
5656

5757
Example:
5858

59-
```<js title='typescript'>
60-
class Employee {
61-
public name: string; // accessible from anywhere
62-
private salary: number; // accessible only within the class
63-
protected department: string; // accessible within the class and subclasses
59+
```tsx title='typescript'
60+
class Employee {
61+
public name: string; // accessible from anywhere
62+
private salary: number; // accessible only within the class
63+
protected department: string; // accessible within the class and subclasses
6464

65-
constructor(name: string, salary: number, department: string) {
66-
this.name = name;
67-
this.salary = salary;
68-
this.department = department;
69-
}
65+
constructor(name: string, salary: number, department: string) {
66+
this.name = name;
67+
this.salary = salary;
68+
this.department = department;
69+
}
7070

71-
public getDetails(): void {
72-
console.log(`${this.name} works in the ${this.department} department.`);
73-
}
71+
public getDetails(): void {
72+
console.log(`${this.name} works in the ${this.department} department.`);
73+
}
7474

75-
private getSalary(): number {
76-
return this.salary;
75+
private getSalary(): number {
76+
return this.salary;
77+
}
7778
}
78-
}
7979

80-
class Manager extends Employee {
81-
constructor(name: string, salary: number, department: string) {
82-
super(name, salary, department);
83-
}
80+
class Manager extends Employee {
81+
constructor(name: string, salary: number, department: string) {
82+
super(name, salary, department);
83+
}
8484

85-
public getManagerDetails(): void {
86-
console.log(`${this.name} is a manager in the ${this.department} department.`);
85+
public getManagerDetails(): void {
86+
console.log(`${this.name} is a manager in the ${this.department} department.`);
87+
}
8788
}
88-
}
8989

90-
let manager = new Manager("Bob", 80000, "HR");
91-
manager.getDetails(); // Output: Bob works in the HR department.
92-
// manager.getSalary(); // Error: Property 'getSalary' is private and only accessible within class 'Employee'.
93-
manager.getManagerDetails(); // Output: Bob is a manager in the HR department.
94-
```
90+
let manager = new Manager("Bob", 80000, "HR");
91+
manager.getDetails(); // Output: Bob works in the HR department.
92+
// manager.getSalary(); // Error: Property 'getSalary' is private and only accessible within class 'Employee'.
93+
manager.getManagerDetails(); // Output: Bob is a manager in the HR department.
94+
```
9595

9696
## 3. The readonly Modifier
9797

9898
Use the readonly modifier to make class properties immutable. Once assigned, the value of readonly properties cannot be changed, ensuring that certain critical properties remain constant.
9999

100100
Example:
101101

102-
```<js title='typescript'>
103-
class Car {
104-
readonly make: string;
105-
readonly model: string;
106-
year: number;
102+
```tsx title='typescript'
103+
class Car {
104+
readonly make: string;
105+
readonly model: string;
106+
year: number;
107107

108-
constructor(make: string, model: string, year: number) {
109-
this.make = make;
110-
this.model = model;
111-
this.year = year;
112-
}
108+
constructor(make: string, model: string, year: number) {
109+
this.make = make;
110+
this.model = model;
111+
this.year = year;
112+
}
113113

114-
displayDetails(): void {
115-
console.log(`${this.year} ${this.make} ${this.model}`);
114+
displayDetails(): void {
115+
console.log(`${this.year} ${this.make} ${this.model}`);
116+
}
116117
}
117-
}
118118

119-
let car = new Car("Toyota", "Corolla", 2020);
120-
car.displayDetails(); // Output: 2020 Toyota Corolla
121-
car.year = 2021;
122-
car.displayDetails(); // Output: 2021 Toyota Corolla
123-
// car.make = "Honda"; // Error: Cannot assign to 'make' because it is a read-only property.
124-
```
119+
let car = new Car("Toyota", "Corolla", 2020);
120+
car.displayDetails(); // Output: 2020 Toyota Corolla
121+
car.year = 2021;
122+
car.displayDetails(); // Output: 2021 Toyota Corolla
123+
// car.make = "Honda"; // Error: Cannot assign to 'make' because it is a read-only property.
124+
```
125125

126126
## 4. Getters & Setters
127127

128128
Getters and Setters allow you to control the access of the class properties. They enable the encapsulation of data, providing controlled access and modification of properties.
129129

130130
Example:
131131

132-
```<js title='typescript'>
133-
class Circle {
134-
private _radius: number;
132+
```tsx title='typescript'
133+
class Circle {
134+
private _radius: number;
135135

136-
constructor(radius: number) {
137-
this._radius = radius;
138-
}
136+
constructor(radius: number) {
137+
this._radius = radius;
138+
}
139139

140-
get radius(): number {
141-
return this._radius;
142-
}
140+
get radius(): number {
141+
return this._radius;
142+
}
143143

144-
set radius(value: number) {
145-
if (value <= 0) {
146-
throw new Error("Radius must be positive.");
144+
set radius(value: number) {
145+
if (value <= 0) {
146+
throw new Error("Radius must be positive.");
147+
}
148+
this._radius = value;
147149
}
148-
this._radius = value;
149-
}
150150

151-
getArea(): number {
152-
return Math.PI * this._radius * this._radius;
151+
getArea(): number {
152+
return Math.PI * this._radius * this._radius;
153+
}
153154
}
154-
}
155155

156-
let circle = new Circle(5);
157-
console.log(circle.radius); // Output: 5
158-
circle.radius = 10;
159-
console.log(circle.getArea()); // Output: 314.159...
160-
// circle.radius = -5; // Error: Radius must be positive.
161-
```
156+
let circle = new Circle(5);
157+
console.log(circle.radius); // Output: 5
158+
circle.radius = 10;
159+
console.log(circle.getArea()); // Output: 314.159...
160+
// circle.radius = -5; // Error: Radius must be positive.
161+
```
162162

163163
## 5. Inheritance
164164

165165
Learn how to use inheritance to reuse the functionality of another class. Inheritance allows you to create a new class based on an existing class, extending its properties and methods.
166166

167167
Example:
168168

169-
```<js title='typescript'>
170-
class Animal {
171-
name: string;
169+
```tsx title='typescript'
170+
class Animal {
171+
name: string;
172172

173-
constructor(name: string) {
174-
this.name = name;
175-
}
173+
constructor(name: string) {
174+
this.name = name;
175+
}
176176

177-
move(distance: number = 0): void {
178-
console.log(`${this.name} moved ${distance} meters.`);
177+
move(distance: number = 0): void {
178+
console.log(`${this.name} moved ${distance} meters.`);
179+
}
179180
}
180-
}
181181

182-
class Dog extends Animal {
183-
bark(): void {
184-
console.log("Woof! Woof!");
182+
class Dog extends Animal {
183+
bark(): void {
184+
console.log("Woof! Woof!");
185+
}
185186
}
186-
}
187187

188-
let dog = new Dog("Rex");
189-
dog.bark(); // Output: Woof! Woof!
190-
dog.move(10); // Output: Rex moved 10 meters.
191-
```
188+
let dog = new Dog("Rex");
189+
dog.bark(); // Output: Woof! Woof!
190+
dog.move(10); // Output: Rex moved 10 meters.
191+
```
192192

193193
## 6. Static Methods & Properties
194194

195195
Define static methods and properties shared by all instances of a class. Static members belong to the class itself rather than to any specific instance, making them useful for utility functions or shared data.
196196

197197
Example:
198198

199-
```<js title='typescript'>
200-
class MathUtil {
201-
static PI: number = 3.14;
199+
```tsx title='typescript'
200+
class MathUtil {
201+
static PI: number = 3.14;
202202

203-
static calculateCircumference(radius: number): number {
204-
return 2 * MathUtil.PI * radius;
203+
static calculateCircumference(radius: number): number {
204+
return 2 * MathUtil.PI * radius;
205+
}
205206
}
206-
}
207207

208-
console.log(MathUtil.PI); // Output: 3.14
209-
console.log(MathUtil.calculateCircumference(10)); // Output: 62.8
210-
```
208+
console.log(MathUtil.PI); // Output: 3.14
209+
console.log(MathUtil.calculateCircumference(10)); // Output: 62.8
210+
```
211211

212212
## 7. Abstract Classes
213213

214214
Explain the abstract classes that define some common behaviors. Abstract classes cannot be instantiated directly and are meant to be extended by other classes, providing a base structure and forcing implementation of specific methods.
215215

216-
Example:
216+
Example -
217217

218-
```<js title='typescript'>
219-
abstract class Shape {
220-
abstract getArea(): number;
218+
```tsx title='typescript'
219+
abstract class Shape {
220+
abstract getArea(): number;
221221

222-
display(): void {
223-
console.log(`The area is ${this.getArea()}`);
222+
display(): void {
223+
console.log(`The area is ${this.getArea()}`);
224+
}
224225
}
225-
}
226226

227-
class Rectangle extends Shape {
228-
width: number;
229-
height: number;
227+
class Rectangle extends Shape {
228+
width: number;
229+
height: number;
230230

231-
constructor(width: number, height: number) {
232-
super();
233-
this.width = width;
234-
this.height = height;
235-
}
231+
constructor(width: number, height: number) {
232+
super();
233+
this.width = width;
234+
this.height = height;
235+
}
236236

237-
getArea(): number {
238-
return this.width * this.height;
237+
getArea(): number {
238+
return this.width * this.height;
239+
}
239240
}
240-
}
241241

242-
let rectangle = new Rectangle(5, 10);
243-
rectangle.display(); // Output: The area is 50
244-
```
242+
let rectangle = new Rectangle(5, 10);
243+
rectangle.display(); // Output: The area is 50
244+
```
245245

246246
These concepts and examples illustrate how to effectively use classes and their advanced features in TypeScript, enhancing your ability to write robust and maintainable object-oriented code.

0 commit comments

Comments
 (0)