preface

TypeScript, as a front-end language, is more similar to the back-end Java language in form. Compared with JavaScript, TypeScript is more object-oriented in programming. Its parameter verification, interface, generics and so on make TS perform well in developing large front-end projects. Therefore, as a front-end developer, it is necessary to master TS. Here the blogger shares some of the basic notes he compiled while learning TypeScript.

This chapter covers common TypeScript data types and TypeScript functions

Common data types

There are several common TypeScript data types

1. Boolean Boolean

    // Note that the syntax of ts is similar to strongly typed languages. When declaring a variable, you need to specify the data type, but the specified type cannot be changed.
    let flag:boolean = true; flag =false; / / success
    flag = 123 ；/ / an error
Copy the code
  1. Numeric number
	const num:number = 1
Copy the code
  1. String
    const str:string = "hi";
Copy the code
  1. The array type array
    const arr:number[] = [1.2.3]; // Specify that the elements in the array are numeric
    const arr2:string[] = ["1"."2"."3"];// Specify that the elements in the array are strings
Copy the code
  1. The tuple tuple type
	const arr:[string.number.boolean] = ["hi".1.false]; // Specify the data type of each item in the array
Copy the code
  1. Enumeration type enum

Tip: Enumeration types can be used to indicate state

    enum Flag {success=1,error=0};
    const f:Flag = Flag.success;
Copy the code

Special points of attention

    enum Color {red,blue=5,yellow};
    constRed: Color = Color. Red;//0 If the enumeration type is not assigned at this point, the default is the current subscript position
    const blue:Color = Color.blue; //5 if there is a specified value, then it is the specified value
    const yellow:Color = Color.yellow; //6 If the next item with the specified value is not assigned, the default is the previous item plus one
Copy the code
  1. Any type

Any type

  1. Viod type

One means none when the function returns a value

    function fn() :void{}
Copy the code
  1. Never type

Types that indicate that they never occur are generally used less often

    let a:never; a =() = >{
    	throw new Error("Error")；
    }
Copy the code

function

  1. Function declaration
    // Specify the return value type
    function fn() :string{
    	return "hi"
    }
    
    // No return value
    function fn2() :void{}// Specify the parameter type
    function fn(name:string) :string{
    	return "hi"; } fn("jack");// This parameter is optional
    function fn2(name:string,age? :number) :void{
    }
    fn2("jack");/ / success
    fn2("jack".18);/ / success
    fn2();/ / an error
    
    // Default parameters
    function fn3(age:number = 20) :void{
    	console.log(age);
    }
    fn3(); / / 20
    fn3(40); / / 40
    
    // Remaining parameters
    function fn4(age:number. arr:number[]) :void{
    	
    }
    fn4(1.2.3.4); / / age arr = = 1/2 and 4
    
Copy the code
  1. Anonymous functions (function expressions)
    const fn = function() :number{
    	return 123;
    }
Copy the code
  1. overloading
function fn(name: string) :string
function fn(age: number) :number
function fn(str: any) :any {
  if (typeof str == "string") {
    return"My name is," +str
  } else {
    return "My age is," + str
  }
}
fn("jack") / / my name is jack
fn(12)// My age is 12
fn(true) / / an error
Copy the code