Typescript in generic roles and usage scenarios

What is TypeScript

TypeScript is developed and maintained by Microsoft Corporation of object-oriented programming language. It is a superset of JavaScript, contain all the elements.

TypeScript full compliance OOPS concept, with the help of TSC (TypeScript compiler), we can Typescript Code (.ts file) is converted to JavaScript (.js file).

Why use TypeScript

TypeScript is designed to solve the JavaScript should be "pain point": weakly typed and no namespace, modularity makes it difficult, is not suitable for large-scale development program. It also provides some syntactic sugar to help people more easily practice of object-oriented programming.

  • TypeScript simplifies JavaScript code to make it easier to read and debug.

  • TypeScript is open source.

  • TypeScript provides an efficient development tools for JavaScript IDE and practices, such as static checking.

  • Use TypeScript, we can make a significant improvement over ordinary JavaScript.

  • TypeScript offers all the advantages ES6 (ECMAScript 6), as well as higher operating efficiency for us.

  • TypeScript can help us to avoid painful mistakes often encountered by developers to write JavaScript type-checking code.

  • Powerful type system, including generics.

  • TypeScript code can be compiled in accordance with the ES5 and ES6 standards to support the latest browser.

  • It supports static type.

  • TypeScript will save developers time.

What is a generic

Generic nature of the parameter type, data type is popular operated is designated as a parameter, which can be used to create the type of classes, interfaces and methods, respectively, become generic class, generic interface, generic method.

TypeScript Generics basically similar with java generics.

Why generics

TypeScript does not recommend the use of any type, can not guarantee the type of security, lack of complete information when debugging.

TypeScript can be used to create generic 可重用components. It supports current data types, but also to support future data types. Expansion flexibility. You can find the type of errors at compile time, thus ensuring the security type.

The use of generics

You can create a generic function using generics, generic interfaces, generic class

1. Use the type variable

// 泛型变量的使用
function identity<T>(arg:T):T{
    console.log(typeof arg);
    return arg;
}
let output1=identity<string>('myString');
let output2=identity('myString');
let output3:number=identity<number>(100);
let output4:number=identity(200);
// 使用集合的泛型
function loggingIdentity<T>(arg:Array<T>):Array<T>{
    console.log(arg.length);
    return arg;
}
loggingIdentity([1,2,3]);

2. Define a generic function

// 泛型函数
function identity<T>(arg:T):T{
    return arg;
}
let myIdentity:{<T>(arg:T):T}=identity;

3. Define a generic interface

// 泛型接口
interface GenericIdentityFn<T> {
    (arg: T): T;
}
function identity<T>(arg: T): T {
    return arg;
}
let myIdentity: GenericIdentityFn<number> = identity;

4. Define generic class

// 泛型类
class GenericNumber<T>{
    zeroValue:T;
    add:(x:T,y:T)=>T;
}
let myGenericNumber=new GenericNumber<number>();
myGenericNumber.zeroValue=0;
myGenericNumber.add=function(x,y){return x+y;};
console.info(myGenericNumber.add(2,5));
let stringNumberic=new GenericNumber<string>();
stringNumberic.zeroValue='abc';
stringNumberic.add=function(x,y){return `${x}--${y}`};
console.info(stringNumberic.add('张三丰','诸葛亮'));

Classic front end face questions updated daily, welcome to participate in the discussion, address: https://github.com/daily-interview/fe-interview .


More angular1 / 2/4/5, ionic1 / 2/3, react, vue, small micro-channel program, nodejs and other technical articles, video tutorials and open source projects, please pay attention to micro-channel public number - full stack of beach-goers .

image

Guess you like

Origin www.cnblogs.com/LVBingo/p/11347329.html