TypeScript Quick Learning Basic Syntax

TypeScript is an open source programming language developed by Microsoft. It has expanded some syntax based on JavaScript and is a superset of JavaScript. The basic syntax of TypeScript includes variable declarations, compound types (arrays and objects), conditional controls (if-else and switch), loops (for and while), functions (basic and arrow functions, and optional parameters), object-oriented features (enumeration, interfaces, inheritance), and exports and imports in module development.

Basic syntax

Variable declaration

TypeScript adds static type checking function based on JavaScript, so each variable has a fixed data type.

For example: let msg: string = 'hello world

let: Declare the keyword of the variable, similar const represents a constant

string: variable type (extend the JavaScript part), other common types are as follows:

number: integer, numeric, floating point number, binary, etc.

boolean: boolean type

any: Not sure, but any type (equivalent to skipping type checking)

union type: for example let u: string|number|boolean = 'hello' can be one of multiple specified types

object: object

let p = {name:'jack', age: 21}
()
(p['name'])

Compound type

Array

let names: Array<string> = ['a','b']
let age: number[] = [1,2]
(names[1])

Conditional control if-else

let num:number = 21
if(num%2===0){ // Three equal numbers are recommended to judge    ("ou")
} else{
    ("ji")
}

In TypeScript, empty strings, 0, null, undefined, etc. are parsed into false, and their value is true

for&while loop

conventional

for(let i=0;i<10;i++){
    (i)
}
let num=0
while(num<10){
        (num)
}

Iterate through the array

let names: Array&lt;string&gt; = ['a','b']
for(let i in names){
    (i+':' names[i]) // This is the subscript}
for(let n of names){
    (n) // What is taken out of this square are elements}

function

Basic style

function sum(x: number, y: number): number {
    return x+y
}
let result = sum(1,2)
('1+2=' + result)

Arrow function

let sayHi = (name: string) =>{
    ('hi' + name)
}
sayHi('Jack')

Optional parameters

// Add a question mark after the parameters?  , means optionalfunction sayHi (name？: string) {
    name = name ? name: 'Anonymous' //Judge, if there is no incoming parameter, then assign value    ('hi' + name)
}
sayHi('Jack')
sayHi()

// The above can be assigned default values similar to python syntaxfunction sayHi (name: string = 'Jack')  //If not passed Default isJack

Object-oriented

TypeScript has basic syntax of object-oriented programming, such as interface, class, enum, etc. It also has basic object-oriented features such as encapsulation, inheritance, and polymorphism.

Enumeration, interface

// Define enumeration without writing lets and parameter types, etc.enum Msg{
    HI = 'hi',
    HELLO = 'hello'
}
// Define the interfaceinterface A{
    say(msg: Msg):void
}
// Implement the interfaceclass B implements A{
    say(msg:Msg):void{
        (msg + "ni hao")
    }
}
// Initialize the object and call the methodlet a:A = new B()
()

inherit

// Define rectangle classclass Rectangle{
    // Define member variables No need to let    private width: number
    private length: number
    //Constructor No function required    constructor(width:number,length:number){
        =length
        =width
    }
    public area():number{
        return *
    }
}
// Define a square class, inherit from a rectangle classclass square extends Rectangle{
    constructor(side: number){
        super(side,side) //Calling the parent class constructor    }
}

let s = new square(10)
('Square Area:'+ ())

Module development

When the application is complex, we can extract the general functions into a separate ts file. Each file is a module (module) module that can be loaded with each other to improve code reusability.

Export

// Define the class and export it through exportexport class Rectangle{
    xxx
}
// Define tool methodexport function area(rec:Rectangle) number{
    xxx
}

Import

// Write the address after importing fromimport {Rectangle, area} from '../rectangle'
// Create an object using imported classlet r = new Rectangle(10,20)
// Call the imported method(area(r))

This is the article about TypeScript Quickly Learning the Basic Syntax of Basic Syntax of Basic Syntax of Introduction. For more related content on TypeScript, please search for my previous articles or continue browsing the related articles below. I hope everyone will support me in the future!