"Front-end Library" Typescript introductory notes

installation to install the typescript compiler

If you edit in the editor, then how to compile into JavaScript, you have to install the compiler in node cnpm, through the command line, the TS suffix file compiled into JavaScript.

Install
cnpm install-g typescript

Install the typescript edit plugin in the editor, such as: Press Ctrl+shift+p in Sublime Text 3, and install the plugin in the input typescript Compiling command line

Compile the suffix of the typescript file. ts into JavaScript. Command:

Compile a single file. ts suffix, such as the following main file
TSC main.ts

//compile multiple files. ts suffix, such as the following main and workers files
TSC main.ts worker.ts

/ /compile all files. ts suffix,
TSC *.ts

//Can be used to--watch from typescript files, such as the following main file:
TSC main.ts--watch

multi-line string

Using multiple-line strings

Use ' can generate line wrapping within a string, such as normal when
var str = '
string stitching
'
//The above sample is not correct, will error, then for multi-line characters can be reduced.


var str = '
\ n correct
\ hahaha
'
//above only use multi-line string is correct

string Templates

Call a declared good string or a function. Then use the expression ${} to invoke the

Note: Within an expression, you must use single quotes to parse a variable or method, and if it is a double quote, parse the string. ==

var str = ' I am a string of Var ';
function str () {return
    ' I am the string of function return '
}
console.log (' Start call ${str} ');//Call String
console.log (' Start call ${ STR ()} '); Call method

automatically split strings

function fn (name,age,sex) {
    console.log (' Print name ', name);
    Console.log (' Print age ', age);
    Console.log (' Print sex ', sex);
}

var age =;
var sexfn = function  () {return
    ' male ';
}

FN ' Youer name is Gold ${age} ${SEXFN ()} ';

new attributes of parameters parameter Type

Parameters are followed by a colon to specify the parameter type, only reminders, and after compilation, JavaScript executes normally

var name:string = ' Jinshan ';
name = 123; Here will give you the error

//automatic detection type, when you assign the other type, will remind you
var name = ' Jinshan ';
name = 123; There will also be an error


//typescript definition of any type can be, such as a string variable value must be any defined type
var name:any = ' Jinshan ';
name = 1231; There is no error.

The following are commonly used types

= = By default, null and undefined are subtypes of all types. That means you can assign null and undefined to variables of type number. Somewhere you want to pass in a string or null or undefined, you can use the union type = =

var Sex:boolean = true;//defines a variable sex, the type is Boolean. var name:string = ' Jinshan ';//define a variable name, the type is string var num:number = 88888; Defines a variable of a numeric type.
can be floating-point decimal, positive integer, binary, decimal, hexadecimal let hexliteral:number = 0xf00d;
Let binaryliteral:number = 0b1010;
Let octalliteral:number = 0o744; var o:any = 1231;
Define a variable that can be changed. Let u:undefined = undefined; Defines a undefined type of variable let n:null = null; Define a NULL variable//The following is the definition array type let arr:number[] = [1,3,4,5]; The definition array is all of the type of numbers. You can also define other, such as var list:any[] = [1, True, "free"];. 

Or the following can also write let arr:array<number> = [3,4,5,6,7,8,0b1010,0o744]; The following is an empty type, indicating that there is no type, using Viod, which is the opposite of any.
It can only be given undefined and null let unusable:void = undefined;
The type that defines a return value that is not required by a function also uses the Viod function ts (): void {return ';//This will cause an error, and the declaring type is a value that is not returned.

You can also specify other types of return values, such as: Return a string of value function fn (): string {returns ';} Never type, the never type represents the types of values that never exist. For example: Always throw an exception, there will be no return value of the function expression or arrow function expression return value type function error (message:string): never {//return never function must have an unreachable endpoint throw new Er
ROR (message); } function fail() {//Inferred return value type is never returns error ("Something Failed")} function Infiniteloop (): Never {//return never function must have an unreachable endpoint  while (true) {}}//You can also invoke function fn (name:string) with a parameter-type invocation: number {return;} fn (' Jinshan ');//This must be a string.

All the others can try.
    The following is a custom type, such as customizing a type of PP, where the name is a string, and the age is the type of the number Class PP () {name:string;
Age:number}//using var p = new pp ();
P.name = ' Jinshan ';

P.age = 123;
Using the enum enum, preceded by an enumerated enum, iterate through the first few, but this is not json oh enum Jia {r,q,f}; 
Let Msg:jia = jia.r;//value msg variable console.log (JIA.R);
Conosle.log (msg);
 But it is possible to directly assign a value;

comprehensive use of above

Let Msg:any = 88888;
var str:string = ' I am ';
function Run (_ws:number) {return
    _ws+ ' name Code agriculture ';
}
Console.log (' ${str}${run (1)}${msg= ', really a '} ');

default arguments and optional parameters

var str:string = ' John ';
function fn (can:string,can2:number,can3:string = ' default parameter ') {
    console.log (can);
    Console.log (can2);
    Console.log (CAN3);
}
FN (' I am a participant ', ' I am a ginseng two '); If the argument does not pass, then the error. And the third parameter can use the default parameters, you can do without the error


//If the default parameters in the preceding, you can use the word, you can use a comma separated.


With optional arguments, you can use the question mark to become optional.
function fn (can:string,can2?:number,can3:string = ' default parameter ') {
    console.log (can);
    Console.log (can2);
    Console.log (CAN3);
}
FN (' one parameter ');//optional parameter, as long as one is OK.

variable

Declare multiple variables and values, and so on

//use [variable 1, variable 2] = [value 1, value 2]; variable 1 corresponds to value 1; let [a,b] = [1,6]; Console.log (a); Console.log (b); Declare a small number of variables so that the last variable saves the remaining variable values. Use...
To give him the value of the remaining variable.
let [name,... color] = [' Jinshan ', ' red ', ' green ', ' white ', ' yellow '];
Conosle.log (name);

Console.log (color); //