Learn typescript (day 3)

I talked about several data types, and the differences between the five tigers general and the two hem and haw generals void, any, undefined and void
Now let's say, if we don't specify a type, what will ts do? Let's have a look.

Enter the topic, that is, type inference.

Type inference

When we declare variables in ts without specifying the type, the code is as follows:

let str = 'I'm a string'   // So now the type is string type.
str = 123 // The string has been changed into a string type, and then the value type cannot be assigned

This is type inference.

However, if it is declared as follows, ts will declare it as any type, just like js, as follows

let all // In this way, it is equivalent to assigning any type. It is optional when assigning again below
all = 100
all = 'I became a string' // No error indicates no problem

ok, the two inference methods of type inference end here. Let's learn another concept. That's the union type.

Union type

You can think of it by listening to the name. Union is not a type. Yes, literally. But there's something to pay attention to.
Basic usage

let unite: number | string | boolean

unite = 'Assignment string'
unite = 11111
unite = true

See, I have three types of variables. That's all right.
Next, the first little knowledge point. Look at the code

let unite: string | number
unite.length //Attribute 'length' does not exist on type 'string | number'. Property 'length' does not exist on type 'number'.

Look at the comments above, which means that when we define a type, if we call the above method, we must ensure that there is this method above, otherwise an error will be reported.

Let's look at the use of union types in functions

function unionType(tar: string | number): number {
	return tar.length //Error: attribute "length" does not exist on type "string | number". Property 'length' does not exist on type 'number'===== Look here=====

The same principle as above.


We have finished talking about the basic data, including joint types, type inference, undefined and null subclasses of all types, void return value is null, any, etc,
Let's talk about object types and interfaces. Let's start with the previous wave of complex definitions:
The interface in TypeScript is a very flexible concept. In addition to abstracting part of the behavior of a class, it is also commonly used to describe the "Shape of an object".
There are two points altogether Abstract part of the behavior of the class 2 Describe the Shape of the object (that is, specify the type of attribute in the object)
//The first belongs to the high-level knowledge in TypeScript. Let's knock the English interface of the second point with code

The basic usage code of the interface is as follows:;

interface Person {
	// It's also a joint type
	name: string | number // Name type
	age: number // Age type
	isjob: boolean // Work or not

// The Person here can be understood as the shape of the object, and also defines the type of the attribute inside Lenovo: I thought of the constructor, this The attribute is similar to the specified type. When using new, we will continue to look at the interface usage

// We have defined the interface above. Let's use it
let per: Person = {
	name: 'Sasuke',
	age: 30,
	isjob: true,

From the above, we can see that the parameters and number of attributes in the object must be consistent with that of the interface

Optional parameters

But what should we do in case of inconsistency (there may or may not be an attribute). ts has prepared optional parameters for us
Let's use the optional parameters!

interface canSel {
	name: string
	age: number
	isjob?: boolean // A question mark after the attribute name represents an optional parameter. Let's try it

let canse: canSel = {
	name: 'Steamed mulberry',
	age: 123,
	isjob: true, // If this attribute is not written or written, no error will be reported
// These are optional parameters

Any attribute

Although the optional parameters are very good, we still can't add attributes to them. Therefore, in order to solve this disadvantage, ts kindly puts forward the thing of arbitrary attributes
Look at the code:

An interface can only define one arbitrary attribute, but the type can be a union type.

//Define interface
interface anyCan {
	name: string
	age: number | string
	isjob?: boolean
	// You are going to add an arbitrary attribute. Attributes of any type should include all attributes of other interface definition types. Include but not limited to relationships
	[propName: string]: string | number | boolean

let anyCanObj: anyCan = {
	name: 'Any type',
	age: '18',
	isjob: true,
	// You can add multiple arbitrary attributes here. You only need to define one arbitrary attribute in the interface
	any: 'I am an arbitrary attribute',
	any1: 'I am an arbitrary attribute 2',
There is also a read-only attribute below
 Direct example: 

// Read only attribute: features: when the important things of the object are said three times and assigned for the first time, it is not when the attributes in the object are assigned
interface readOnly {
	readonly name: string

let read: readOnly = {
	name: 'read-only',
read.name = 'assignment' //Assigned to 'name' because it is read-only

Another harvest day!!!

Keywords: Javascript Front-end TypeScript

Added by idris on Sat, 18 Dec 2021 22:19:18 +0200