Created
August 17, 2019 17:49
-
-
Save yogain123/482d936e879607349cdff71a629bcb30 to your computer and use it in GitHub Desktop.
TypeScript
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| hola |
Type Definition File
Some popular libraries already provide type definitation file like axios at the time when we install npm install axios --save
But few unpopular libs don't provide so Some random person has already generated it we just need to install it.
npm install @types/{lib name}
eg:=> npm install faker --save
==> npm install @types/faker
It is defined as index.d.ts file
It is nothing but just like a source of documentation for types for all variable , function and all
Using Type De File
Abstract Class
https://drive.google.com/drive/folders/1q-3EZq7PMavtPCCKY3IERyjh4Y_xfNPr
Lesson 90
We Cannot Create Instance of Abstract Class (Obviously)
Info
generating tsconfig.json
tsc --init
it will automaticaly generate that one file
Decorator
calling @testDecorator is same as calling
More on Decorators
Property Descriptor
its an object that has property defined configuration around it => its a part of js
We cannot directly modify prototype , Instead if we want to do this we go through that property descriptor thing
wrapping method with descriptor
Passing Parameter in Decorator ==> Decorator Factories
decorator around parameter
Code
class check{
flag: boolean = false;
static countryStatic: string = "INDIA STATIC";
static countryStaticMethod(){
console.log("COUNTRY STATIC METHOD CALLED")
}
constructor(public name:string){
this.hola();
}
printLogCheck(){
return "saxena parent";
}
hola(){
console.log("hola parent");
}
}
class main extends check{
constructor(public age: number,name: string){
super(name)
}
printLogMain(){
let lastName = this.printLogCheck();
let firstName = this.printLogCheck();
console.log("yogendra "+lastName);
console.log(firstName);
super.hola();
console.log(this.flag);
let obj = {name:"yogendra",age:25,address:{
pincode:208022,
country:"india"
}}
let newObj = {...obj.address,city:"bangalore"};
console.log(obj);
console.log(newObj);
}
printLogCheck(){ // overriding
return "saxena child";
}
hola(){
console.log("hola child");
}
}
let mainData = new main(25,"yogendra");
console.log(mainData)
console.log(mainData.printLogMain());
console.log(check.countryStatic);
console.log(check.countryStaticMethod());
Code
https://repl.it/@yogain19/TypeScript
class check{
flag: boolean = false;
static countryStatic: string = "INDIA STATIC";
static countryStaticMethod(){
console.log("COUNTRY STATIC METHOD CALLED")
}
constructor(public name:string){
this.hola();
}
printLogCheck(){
return "saxena parent";
}
hola(){
console.log("hola parent");
}
}
function printLog(message: string){
console.log(message);
return function (target: any, propertyKey: string, desc: PropertyDescriptor) {
console.log(desc.value);
desc.value = function(){
console.log("printLogMain function changed by Decorator");
}
}
}
function logMe(target: any, propertyKey: string, desc: PropertyDescriptor){
console.log("Log me Log me");
}
function logMeWithParams(msg: string){
return function(target: any, propertyKey: string, desc: PropertyDescriptor){
console.log(msg);
}
}
class main extends check{
constructor(public age: number,name: string){
super(name)
}
@printLog("This is a log message")
@logMe
@logMeWithParams("Log me Log me With Params")
printLogMain(){
let lastName = this.printLogCheck();
let firstName = this.printLogCheck();
console.log("yogendra "+lastName);
console.log(firstName);
super.hola();
console.log(this.flag);
let obj = {name:"yogendra",age:25,address:{
pincode:208022,
country:"india"
}}
let newObj = {...obj.address,city:"bangalore"};
console.log(obj);
console.log(newObj);
}
printLogCheck(){ // overriding
return "saxena child";
}
hola(){
console.log("hola child");
}
}
abstract class hola{
constructor(public holaName: string){
}
abstract find(holaAge: number): void;
}
interface Address<T, V, P>{
city: P | V,
state: V,
pincode: T | V,
country?: string | number
}
class holaCheck extends hola{
constructor(public city: string, holaName: string){
super(holaName)
}
find(holaAge: number){
console.log("I am Printing hola Age ",holaAge);
}
findAddress(address: Address<number, string, boolean>){
console.log(address.city);
console.log(address.pincode);
}
}
let holaCheckInstance = new holaCheck("bangalore", "yogendra");
const address = {
city: "bangalore",
pincode: 208022,
state: "Karnataka",
hola:"useless Data"
}
console.log(holaCheckInstance.findAddress(address));
type Drink = [string, number];
class Gen<T, P>{
drink1: Drink = ["yogendra", 25];
drink2 = ["yogendra", 25] as Drink; // Type assestion
constructor(public name: P, public age: T){
let address = {city:"bangalore", state:"Karnataka", pincode:"222222"};
let add1: Address<string, string, string> = address;
let add2 = address as Address<string, string, string>; // Type Assertion
console.log(add1.city);
}
}
let gen = new Gen<number, string>("yoyoyo",26);
console.log(gen)
let mainData = new main(25,"yogendra");
console.log(mainData)
console.log(mainData.printLogMain());
console.log(check.countryStatic);
console.log(check.countryStaticMethod());
generic around functions
Incorrect
class Person{
constructor(public age?: number, public name: string){
}
}
Error : [typescript] A required parameter cannot follow an optional parameter.
enums
you can access enum as you access object, It automatically gets converted to object in js
type assertion
we tell TS that we are a developer and we know better what's going on, ==> it override the default type assertion behaviour of TS
enum yoyo {
name = "yogendra"
}
let uu: string = yoyo.name;
let pp = yoyo.name as string;
interface Person{
name:string,
[id: string]:{
pincode: number,
country: string
}
}
let p: Person = {
name:"yogendra",
"12A":{
pincode:208022,
country:"india"
},
"13A":{
pincode:208022,
country:"india"
},
"14A":{
pincode:208022,
country:"india"
}
}
class Person<T,S>{
constructor(public name:T, public age:S){
}
sum<T>(firstName: T){
console.log(firstName);
}
}
let p = new Person<string, number>("yogendra",25);
p.sum("yogendra");
p.sum<string>("saxena")
function type
both are correct ways:
implements
- interface/type extends interface/type (can extends multiple interface/ types)
- class extends class (can extends only one class)
- class implements interface/types (can implements multiple interface/types)
extra
type Choise = "A" | "B" | "C";
let p : Choise = "A"
type testType = keyof {id: "test", age: 2} ; // ==> testType : id | age
let t: testType = "age"
interface MyInterface {
name: string;
}
interface MyInterface {
age: number;
}
let box: MyInterface = { // box will be of type ==> {name:string, age: number}
name:"yogendra",
age:34
}
multiple inheritance
multiple inheritance is not supported in TS, but it is done using interface
interface Person {
pow: (a: number)=>number
}
interface Vehicle {
pow: (a: number)=>number
}
class Body1 implements Person, Vehicle{
personName="done";
pow(a:number): number{
return a*a;
}
}
class Body2 implements Person, Vehicle{
personName="done";
pow(a:number): number{
return a*a*a;
}
}
console.log(new Body1().pow(2)); //4
console.log(new Body2().pow(2)); //8
interface, types, enum syntax
interface Person{
name:string;
age:number
}
type Address = {
pincode:number
country:string
}
type Drink = string | number;
type Boy = [string, boolean];
interface Status{
position:string;
experience: number
}
enum Colors{
b="blue",
g="green"
}
console.log(Colors.b); // blue
function getName(name:string) {
return {
name,
age:25
} as const
}
class Test implements Person, Status, Address{
constructor(public name:string,public age:number, public position:string,public experience:number,
public pincode:number, public country:string){
}
}
decorator
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
How webpack or parcel work for compiling to js