Typescript

This is the third day of my participation in the August More text Challenge. For details, see:August is more challenging

Basic knowledge of

Basic type: Number String Boolean Array object

1. The enum: enumeration

2. type, interface

3. The joint type | (only one type at a joint types; A cross type is a combined type of multiple types each time.

4. Crossover types & (Union types can only be one type at a time; A cross type is a combined type of multiple types each time.

5. typeof

The Typeof operator can be used to get the Typeof a variable declaration or object.

function toArray(x: number) :Array<number> { 
    return [x];
}
type Func = typeof toArray; // (x: number) => number[]
Copy the code

6. keyof

The Keyof operator can be used for all key values in an object:

interface Person { 
    name: string; 
    age: number;
}
type1 K1 = Keyof Person; "name" | "age"
Copy the code

7. in

In is used to iterate over enumeration types:

type Keys = "a" | "b" | "c"
type Obj = {
    [p in Keys]: any
} // { a: any, b: any, c: any }
Copy the code

8. extends

Sometimes when we define a generic that we don’t want to be too flexible or want to inherit from some class, we can add a generic constraint with the extends keyword.

interface ILengthwise {
    length: number;
}
function loggingIdentity<T extends ILengthwise> (arg: T) :T {
    console.log(arg.length);
    return arg;
}

loggingIdentity(3);
loggingIdentity({length: 10.value: 3});
Copy the code

9. Paritial

So Partial makes all the properties of a certain type optional, right? .

10. Reuqired

The function of Required is to make all attributes in a type mandatory.

11. Readonly

The function of Readonly is to make all attributes of a certain type read-only, which means that they cannot be reassigned.

12. Record 

Record<K extends keyof any, T> converts the value of all properties in K to type T.


interface PageInfo {
    title: string;
}
type Page = "home" | "about" | "contact";
const x: Record<Page, PageInfo> = {
    about: { title: "about" },
    contact: { title: "contact" },
    home: { title: "home"}};Copy the code
  1. 1. Exclude
type T0 = Exclude<"a" | "b" | "c"."a">; // "b" | "c"
type T1 = Exclude<"a" | "b" | "c"."a" | "b">; // "c"

Copy the code
  1. Extract

The function of Extract<T, U> is to Extract U from T.

type T0 = Extract<"a" | "b" | "c"."a" | "f">; // "a"
type T1 = Extract<string | number | (() = > void), Function>; // () => void

Copy the code

Frequent meeting questions

1. The short answer

  • What do you think are the benefits of using TS?

  • What do you think is the difference between typescript and javascript

  • What types do you use in typescript

  • The typescript difference between type and interface

  • What are generics and the specific uses of generics?


  • The benefits of the Typescript

    1.1 TypeScript is an enhanced version of JavaScript that extends the syntax of JavaScript by adding optional static typing and class-based object-oriented programming. So TS has a lot more functionality than JS.

    1.2 Typescript is a pure object-oriented programming language with concepts of classes and interfaces.

    1.3 TS gives compilation errors at development time, while JS errors need to be exposed at run time.

    1.4 Being a strongly typed language, you know exactly what type the data is. The code is so readable that almost everyone can understand it.

    There are many handy features in 1.5TS, such as optional chains.

  • How Typescript differs from JavaScript

    • Typescript is a superset of JavaScript, it’s a programming language based on JavaScript,
    • Typescript addresses the shortcomings of the JavaScript language’s own type system
    • Typescript also supports new ECMAScript features
    • Typescript automatically translates new ECMAScript features, and it supports minimal ES3 code, which makes it compatible
    • JavaScript is a weakly typed, dynamically typed language, which is more flexible and changeable
  • Disadvantages of Typescript:

    • The Typescript language itself has many more concepts than JavaScript, which increases the cost of learning
    • Typescript also requires type declarations in the early stages of a project, adding some development costs
  • Used Typescript types

    • The original type

    • An array type

    • Object type

    • Any type

    • Enumerated type

    • Function types

  • The Typescript difference between type and interface

  • Similarities:

    • They can both describe objects or functions

    • Allow extensions (extends)


type Animal = {
    name: string
    say: Function
}

interface Animal2 {
    name: string
    say: Function
}

// type extends type
type Cat = Animal & { jump: Function }
// type extends interface
type Cat2 = Animal2 & { jump: Function }
    
interface Dog extends Animal2 {
    run: Function
}
// interface extends type
interface Dog2 extends Animal {
    run: Function
}
Copy the code
  • Difference:

    • Type can declare basic type aliases, union types, tuples, and so on
  • What are generics and the specific uses of generics?

    A generic is a feature that defines a function, interface, or class without specifying a specific type in advance, and then specifies the type when it is used.

    You can think of generics as parameters that represent types