TS (typescript) basics 6: (literal) text type

This is my participation 8 The fourth of the yuegengwen challenge 11 God , Check out the activity details ：8 Yuegengwen challenge

Literal type

This chapter introduces a TS Special types in Literal（ In addition to general types of strings and numbers , We can also refer to specific strings and numbers at type locations ） In order to achieve some wonderful effects .

Constant

Let's look at an example ： Use literal types to implement constant like functions . Take this example to understand its basic operation mechanism .

let s: 'hw' = 'hw'

let n: 1 = 1;
 Copy code 

In the above example ： Statement s The value of is string ‘hw';n The value of is 1; You can't change it later .

But having a variable with only one value is not very useful , Use const Can be easily implemented

Joint type

We can combine words into joint types , Can express a more useful concept

for example , Functions that accept only a specific set of known values

type a = -1 | 0 | 1
function compare(a: string, b: string): a {
  return a === b ? 0 : a > b ? 1 : -1;
}
 Copy code 

In the above example, suppose we need a version comparison method compare, The return value only accepts 0,1,-1 Three values .

Combined interface

We can also use it with interfaces ：

interface f {
  age: number;
}
type s = f | 'son'
function fn(x: s) { }
fn({ age: 100 });
fn("son");
 Copy code 

In the above example , Alias s Both interfaces f The rules of .

There is also a special type of text ： Boolean type . Boolean types have only two Boolean text types , The difference is true and false type . This shows that the type boolean Itself is actually just a union type in a text type

application

Here's an example , Show the application in the actual project

We declare one http Request method , And call it , See the following example ：

type obj = {
  url: string;
  method: "GET" | "POST"
}
function http(arg: obj) {  }
let params = { url: 'www.lsdj.sdf', method: "GET" }
http(params)
 Copy code 

//Type 'string' is not assignable to type '"GET" | "POST"'.

analysis ：
The variables we declare params in method The value of is a string type , therefore TS Help me method Inferred as string type . But our encapsulated request method http Only text types are accepted in "GET" | "POST"！ If you want this code to work properly, you need to change params in method The type of

let params = { url: 'www.lsdj.sdf', method: "GET" as "GET" } 
let params = { url: 'www.lsdj.sdf', method: "GET" } as const
 Copy code 

The above two ways , Can meet our needs

Object constant

except readonly Outside the modifier , Other ways to make the value in the object immutable

let obj = { a: 1} as const;
 Copy code 

as const The function of suffix is similar to const, But for type systems , Make sure that all attributes are assigned to the text type , Not a more general version , Such as string or number .