Adding content to 107-interfaces

pull/3423/head
syedmouaazfarrukh 2 years ago committed by Kamran Ahmed
parent 62905bda7a
commit 7bac3c3444
  1. 37
      src/roadmaps/typescript/content/107-interfaces/100-types-vs-interfaces.md
  2. 30
      src/roadmaps/typescript/content/107-interfaces/101-extending-interfaces.md
  3. 22
      src/roadmaps/typescript/content/107-interfaces/102-interface-declaration.md
  4. 24
      src/roadmaps/typescript/content/107-interfaces/103-hybrid-types.md
  5. 23
      src/roadmaps/typescript/content/107-interfaces/index.md

@ -1 +1,36 @@
# Types vs interfaces
# Types vs Interfaces
In TypeScript, both types and interfaces can be used to define the structure of objects and enforce type checks. However, there are some differences between the two.
Types are used to create a new named type based on an existing type or to combine existing types into a new type. They can be created using the type keyword. For example:
```
type Person = {
name: string;
age: number;
};
const person: Person = {
name: "John Doe",
age: 30
};
```
Interfaces, on the other hand, are used to describe the structure of objects and classes. They can be created using the interface keyword. For example:
```
interface Person {
name: string;
age: number;
}
const person: Person = {
name: "John Doe",
age: 30
};
```
Learn more from the following links:
- [Interfaces vs. Type Aliases](https://www.typescriptlang.org/docs/handbook/advanced-types.html#interfaces-vs-type-aliases)
- [Interfaces vs Types in TypeScript](https://stackoverflow.com/questions/37233735/interfaces-vs-types-in-typescript)

@ -1 +1,29 @@
# Extending interfaces
# Extending Interfaces
In TypeScript, you can extend an interface by creating a new interface that inherits from the original interface using the "extends" keyword. The new interface can include additional properties, methods, or redefine the members of the original interface.
Here is an example:
```
interface Shape {
width: number;
height: number;
}
interface Square extends Shape {
sideLength: number;
}
let square: Square = {
width: 10,
height: 10,
sideLength: 10
};
```
In this example, the Square interface extends the Shape interface and adds an additional property sideLength. A variable of type Square must have all the properties defined in both Shape and Square interfaces.
Learn more from the following links:
- [Interfaces](https://www.typescriptlang.org/docs/handbook/interfaces.html)
- [TypeScript - Extending Interfaces](https://www.typescriptlang.org/docs/handbook/interfaces.html#extending-interfaces)

@ -1 +1,21 @@
# Interface declaration
# Interface Declaration
An interface in TypeScript is a blueprint for creating objects with specific structure. An interface defines a set of properties, methods, and events that a class or object must implement. The interface is a contract between objects and classes and can be used to enforce a specific structure for objects in your code.
Here is an example of an interface declaration in TypeScript:
```
interface Person {
firstName: string;
lastName: string;
age?: number;
getFullName(): string;
}
```
In this example, the Person interface defines four properties: `firstName`, `lastName`, `age`, and a method `getFullName()`. The age property is optional, indicated by the `?` symbol. Any class or object that implements the `Person` interface must have these properties and method.
Learn more from the following links:
- [Introduction - Declaration Files](https://www.typescriptlang.org/docs/handbook/declaration-files/introduction.html)
- [Find and Install Declaration Files](https://www.typescriptlang.org/docs/handbook/declaration-files/introduction.html#find-and-install-declaration-files)

@ -1 +1,23 @@
# Hybrid types
# Hybrid Types
In TypeScript, a hybrid type is a type that combines multiple types into a single type. The resulting type is considered a union of those types. This allows you to specify that a value can have multiple types, rather than just one.
For example, you can create a hybrid type that can accept either a string or a number:
```
type StringOrNumber = string | number;
```
Now, a value of type StringOrNumber can be either a string or a number:
```
let value: StringOrNumber = 'Hello, world!';
value = 42;
```
You can also use hybrid types to create more complex types that can represent a combination of several different types of values.
Learn more from the following links:
- [TypeScript - Interface Hybrid Types](https://www.logicbig.com/tutorials/misc/typescript/interface-hybrid-types.html)
- [What is Hybrid types in typescript?](https://www.youtube.com/watch?v=eYAq1A4BsuI)

@ -1 +1,24 @@
# Interfaces
Interfaces in TypeScript provide a way to define a contract for a type, which includes a set of properties, methods, and events. It's used to enforce a structure for an object, class, or function argument. Interfaces are not transpiled to JavaScript and are only used by TypeScript at compile-time for type-checking purposes.
Here's an example of defining and using an interface in TypeScript:
```
interface User {
name: string;
age: number;
}
const user: User = {
name: 'John Doe',
age: 30
};
```
In this example, the User interface defines the structure of the user object with two properties, name and age. The object is then typed as User using a type-assertion : User.
Learn more from the following links:
- [TypeScript - Interfaces](https://www.typescriptlang.org/docs/handbook/interfaces.html)
- [TypeScript Tutorial - Interfaces](https://www.youtube.com/watch?v=VbW6vWTaHOY)
Loading…
Cancel
Save