TypeScript Learning Notes

Posted by watsmyname on Fri, 19 Jul 2019 15:41:44 +0200

TypeScript:

1. It is a superset of JavaScript that supports the ES6 standard.

2. Free and Open Source Programming Language Developed by Microsoft

3. The design goal is to develop large-scale applications, which can be compiled into pure JavaScript, and the compiled JavaScript can run on any browser.

4. Extended JavaScript syntax, so existing JavaScript code can work with TypeScript without any modification

5. Providing static type checking at compile time through type annotations

6. Processing existing JavaScript code and compiling only the TypeScript code

 

TypeScript data types:

1. Boolean value: boolean, indicating yes or no

// Declare a Boolean-type variable flag,Its value is true
let flag: boolean = true;

 

2. number: number. Numbers in JavaScript and TypeScript are floating-point numbers. TypeScript supports binary, octal, decimal and hexadecimal systems.

// The prefix is 0 b Represents binary, 0 o Represents octal, 0 x Represents hexadecimal, defaulting to decimal
let num: number = 6;

 

3. String: string, which can be represented by double or single quotation marks

Template string: surrounded by back quotation marks (`) and embedded expression == in the form of ${exp} defines multi-line text or embedded expression

// Define a common string
let name: string = "lemon";

// Template string
let name: string = `Lemon`;
let age: number = 8;
let greet: string = `Hello, my name is ${name}. I am ${age} years old`;

 

4. Arrays: Declare arrays by adding [] after the element type or using the array generic Array < element type >

let arr: number[] = [1, 2, 3];

// Equivalent declaration
let arr: Array<number> = [1, 2, 3];

 

5. Tuples: Allows an array of known elements and types, each of which does not have to be the same

// Declare that one has two elements of type string and number A tuple of
let tup: [string, number] = ["Hello", 10];

 

6. Enumeration: enum, giving a friendly name to a set of values

// Declare enumerated variables color,red The corresponding value is 0. yellow 1, blue 2
enum color {red, yellow, blue};
let c: color = color.blue;
console.log(c);    // The console outputs the corresponding value, where 2

// Manual assignment method can be used
enum color {red = 1, yellow = 3, blue = 6};
console.log(color.yellow);    // Output 3
console.log(color[3]);  // Output yellow

Note: Names and values are mutually bound. They can be found by values, and vice versa.

  

7. Any: Specify a type for variables of unknown type at compilation stage

let notSure: any = 4;
console.log(notSure);    // Output 4

notSure = "Hello Lemon."; 
console.log(notSure);    // output Hello Lemon.

 

8. Void: Represents that there are no types

let voidValue: void = null;
console.log(voidValue);    // output null
voidValue = 2;    // Report errors

Note: When a function does not return a value, its type is usually void, and a variable declaring a void type can only be passed in undefined or null for it.

 

9. Null and Undefined: By default null and undefined are subtypes of all types

let value: null = null;
let num: number = value;
console.log(num + 1);    //Output 1

Note: Subtypes can be assigned to parent types, null and undefined can only be assigned to void and themselves when the -- strictNullChecks tag is specified

 

10. Never: Represents the types of values that never exist (e.g. functional expressions that always throw exceptions or do not return values at all or arrow function expressions);

Variables can also be never types when constrained by type protection that is never true.

 

Object: Represents a non-primitive type, that is, a type other than number, string, boolean, symbol, null, or undefined

 

Type assertions:

Like other languages, type conversion does not require special data checking and decomposition; it has no runtime impact and only works at the compilation stage.

TypeScript assumes that you have made the necessary checks

Grammar:

1. The "sharp bracket" grammar:

let someValue: any = "Hello World";
let strLength: number = (<string> someValue).length;
console.log(strLength);    // Output 11

    

2. as grammar:

let someValue: any = "Hello World";
let strLength: number = (someValue as string).length;
console.log(strLength);    // Output 11

Note: When using JSX (JavaScript XML) in TypeScript, only as grammar assertions are allowed

Topics: MySQL TypeScript Javascript Programming xml