0, Introduction, advantages
TypeScript is the supertype of javaScript. It compiles to pure JS. TypeScript runs on any browser, any computer, and any operating system1Void Void Void Void Void Void Void Void Void Void Void Void Void Void Void Void Void Void Void Void Void Never (type of nonexistent value)2, enhance code readability, data interaction more secure3To enhance code maintainability and productivity4Module management is better, type checking is more strict so that your development is rigorous and free5TypeScript starts with JavaScript and ends with JavaScript. It follows the syntax and semantics of JavaScript, so it's not too difficult for us front-end practitioners to learn6TypeScript provides classes, modules, and interfaces that make components easier to build and maintain.Copy the code
1. Install and view
npm install -g typescript
tsc --version
Copy the code
2. Grammar check
In VS CODE File/Preference Settings under search javascript. Validate. Enable and typescript. Validate. Enable and cancel the tick, Disable js and ts syntax checking for VSCODECopy the code
3. Basic data types
Number: value type String: string type Boolean: Boolean type Enum: enumeration type ANY: any type void: empty type Array: Array type Tuple: Tuple type Null: Empty Undefined type:Copy the code
4, function
1, declare (define) a function must add function keyword; 2. Function names are the same as variable names, and the naming rules follow identifier rules. 3. Function parameters are optional, and multiple parameters are separated by commas; 4. Each parameter consists of a name and a type, separated by a semicolon. 5, the return value of the function is optional. If not, the return type is void, and the body of the function is enclosed in braces.Copy the code

When declaring function parameters, there are three cases:

1. Optional parameters:

2. Default parameters

3. Multiple parameters

function  paramsDefined(name:string, age:number, sex? :boolean) :string {
    return name + age + sex;
}
function paramsDefault(name:string = 'zlm', age:number = 17) :string {
    return name + age;
}
function selectParams(. name:string[]) :string {
    let only:string = 'Parameter:';
    for(let i=0; i< name.length; i++) {
         only = only +name[i]
         if(i<name.length) {
             only = only + ', '
         }
    }
    only = only + ', etc.
    return only;
}
let defined:string = paramsDefined('zzz'.22)
let dafault:string = paramsDefault()
let select:string= selectParams(... ['zlm'.'Jamie'.'Jone'])
Copy the code

Function definition method

1. Function declaration method

2. Function expression method

3. Arrow function

// function declaration method
function str(name:string, age:number) :void {
    console.log(name + age)
}
// Function expression
var add = function(num: number, str: string) :any {
    return num + str;
}
// Arrow function
var sum = (n:number.m:number) :number= > {
    return n + m;
}
Copy the code

Problem a:

What is the difference between function declaration and function expression?

5, array

1. Array declaration methods

Literal assignment method

let arry1: Array<number> = [1.23.4]
let arry2: number[] = [12.3.4]
let arry3: Array<boolean> = [false.true]
Copy the code

Structural function assignment method

let arry4: Array<number> = new Array(1.2.3.4)
let arry5: Array<boolean> = new Array(false.true.false)
Copy the code

Tuple: An array with a known number and type of elements that need not all be of the same type

let arry6: [string.number.boolean] = ['zlm'.10.false]
Copy the code

There are two types of strings: basic and imported

let str1:string = 'str1'
let str2:String = new String('str2')
Copy the code

Description: There is no difference between a primitive type and a string with an imported type declaration. A primitive string can use the attributes and methods of the imported type directly

2. Common methods for strings

let something:string = 'abcdefghijkgagagagag'
let source:string = 'gh'
// Find the string from the header
console.log(something.indexOf(source))
// Start at the end of the string and return -1 if the string is not found
console.log(something.lastIndexOf(source))
// Start interception at the specified position and end interception at the specified position
let subStr:string = something.substring(6.8)
console.log(subStr)
// String substitution
let strRep:string = 'abcdeMMfghijk'
let newStr:string = 'MM'
console.log(strRep.replace(newStr, 'VV'))
Copy the code

Create date object Data

// No arguments are passed in the constructor. Date() creates a Date object based on the current Date and time
var D:Date = new Date(a)console.log(D)
// If an integer is passed, this integer represents the number of milliseconds away from 1970-01-01 00:00:00
var D1:Date = new Date(200)
console.log(D1)
// If you pass a string representing a date, the corresponding date will be generated
var D2:Date = new Date('the 2021-05-26 12:30:00')
console.log(D2)
Copy the code