TypeScript progressive approach to learning

01.Typescript introduction, installation and development tools

A, Typescript Introduction

  1. Typescript was developed by Microsoft open-source programming language.
  2. typeScript is super, follow the latest ES6, ES5 specification of javascript. Typescript extends the syntax of javascript.
  3. Typescript more like a back-end Java, C # object-oriented language such js allows development of large enterprise projects.
  4. Google Typescript in support of the promotion, Google's angular2.x is based Typescript syntax.
  5. The latest Vue, React can also be integrated TypeScript.

Two, Typescript install the compiler

npm install -g typescript
tsc helloworld.ts

Three, Typescript development tools Vscode automatically compile .ts file

  1. Creating tsconfig.json file (tsc --init command to generate a configuration file)
  2. outDir path modification tsconfig.json file

Click the terminal to run the task Click tsc: -tsconfig.json then monitor can automatically produce code.

Four, Typescript development tools HBuilder automatically compile .ts file

  1. In the top menu bar, click Tools - plug-in installation;
  2. Click below to browse Eclipse plug-in market, search typescript plug-in installation
  3. After the installation is completed reboot the compiler, click on the menu bar Tools - Options select the file compiled ts
  4. On your right-click on the project - the current directory will be automatically re-configure -Enable TypeScript Builder, and then after you save .ts file when compiling the corresponding .js file

Check performed on build in Compile all TypeScript files, and then determined;

02.Typescript data types

typescript in order to make the code written in more standardized, more conducive to the maintenance and a greater parity, mainly in typescript provides us with the following data types:

  • Boolean (boolean)
  • Digital type (number)
  • String type (string)
  • Array type (array)
  • Tuple type (tuple)
  • Enumerated types (enum)
  • Of any type (any)
  • null 和 undefined
  • void type
  • never type

Here are some examples:

First, boolean (boolean)

Second, the digital type (number

Third, the string type (string)

Fourth, the array type (array)

V. tuple type (tuple)

Sixth, enumerated types (enum)

With the proliferation of computers, not only for the numerical calculation program, and still more broadly non-numerical data for processing. For example: sex, month, week, color, unit name, education, occupation, etc., are not numeric data. In other programming languages, is generally used to represent a value in a state, this processing method is not intuitive, poor readability. If you can have the respective meanings of words in the program using natural language to represent a state, the program is very easy to read and understand. That is to say, in advance taking into account the value of a variable can take, try to use natural language word meaning clearly expressed its every value, this method is called enumeration method, this method defined type called gold For type.
        enum 枚举名{
            标识符[=整型常数],
            标识符[=整型常数],
            ...
            标识符[=整型常数],
        } ;
复制代码

Seven, of any type (any)

Eight, null and undefined

Nine, void type

typescript is no void type indicates, when the method for defining the general method returns no value.

Ten, never type

Other types (including null and undefined) subtypes, does not appear from the representative value. This means never declared variables can only be assigned never type.

The 03 Typescript function

  • Defined functions
  • Optional parameters
  • The default parameters
  • The remaining parameters
  • Function overloading
  • Arrow function es6
Examples are as follows:

First, the definition of the function

Second, the optional parameter

Parameter passing mode look both functions:

The method has no return value:

Which method es5 arguments and parameters can be different, but the ts must be the same, if not the same need to configure optional parameters:

Note: The last optional parameter parameter must be configured to face!

Third, the default parameters

Fourth, the remaining parameters

Three operators, to accept the new value passed over:

Fifth, function overloading

Overloading in java approach: overloading refers to two or more functions of the same name, but their parameters are not the same, then the situation in typescript function overloading overloading occur: by providing the same function as a plurality of types of functions to define a plurality of functions under the test object.

Sixth, the arrow function es6

this refers problems arrow pointing function in this context inside

The class 04 Typescript

First, look at the popularity of ES5 class:

  1. The simplest class

Constructor and a method of increasing the inside chain prototype // constructor method for increasing:

// prototype method :( chain which increases the function prototype chain is shared by multiple functions, not constructors)

Static methods:

Es5 inside of inheritance (object masquerading inheritance)

Es5 inside inheritance (the prototype chain of inheritance)

Prototype chain of succession issue? ?

Reproduced in: https: //juejin.im/post/5cfdff335188253cec306700

Guess you like

Origin blog.csdn.net/weixin_33728268/article/details/93182304