你将在本文中学到什么
准备工作
- 安装Node Package Manager： 通常安装Node时，它会顺带安装好所需版本的NPM。
- 安装TypeScript：如果你安装好了Node Package Manager，你可以用以下命令在本机的全局环境安装TypeScript。
-
npm install -g typescript
集成开发环境：本文将使用微软团队开发的Visual Studio Code。可以在这里下载。进入其下载的目录，并按照提示进行安装。记得选择“添加打开代码”（Add open with code）选项，这样你就可以在本机从任何位置轻松打开VS Code了。
TypeScript里的泛型是个啥
在VS Code中配置TypeScript
console.log("hello TypeScript");
{
// Use IntelliSense to learn about possible attributes.
// Hover to view descriptions of existing attributes.
// For more information,visit: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0","configurations": [
{
"type": "node","request": "launch","name": "TypeScript","program": "${workspaceFolder}\\app.ts","outFiles": [
"${workspaceFolder}/**/*.js"
]
}
]
}
{
// See https://go.microsoft.com/fwlink/?LinkId=733558
// for the documentation about the tasks.json format
"version": "2.0.0","tasks": [
{
"label": "echo","type": "shell","command": "tsc","args": ["-w","-p","."],"problemMatcher": [
"$tsc-watch"
],"isBackground": true
}
]
}
{
"compilerOptions": {
"sourceMap": true
}
}
[21:41:31] Starting compilation in watch mode…
找到问题
class Collection {
private _things: string[];
constructor() {
this._things = [];
}
add(something: string) {
this._things.push(something);
}
get(index: number): string {
return this._things[index];
}
}
class Collection {
private _things: any[];
constructor() {
this._things = [];
}
add(something: any) {
this._things.push(something);
}
get(index: number): any {
return this._things[index];
}
}
let Stringss = new Collection();
Stringss.add("hello");
Stringss.add("world");
console.log(Stringss.get(0).length);
let Strings = new Collection();
Strings.add(001);
Strings.add("world");
console.log(Strings.get(0).length);
console.log(Stringss.get(0).substr(0,1));
理解中心思想
function identity<T>(arg: T): T {
return arg;
}
class Collection<T> {
private _things: T[];
constructor() {
this._things = [];
}
add(something: T): void {
this._things.push(something);
}
get(index: number): T {
return this._things[index];
}
}
let Stringss = new Collection<String>();
Stringss.add(001);
Stringss.add("world");
console.log(Stringss.get(0).substr(0,1));
使用泛型
class Collection<T,K> {
private _things: K[];
constructor() {
this._things = [];
}
add(something: K): void {
this._things.push(something);
}
get(index: number): T {
console.log(index);
}
}
class Collection {
private _things: any[];
constructor() {
this._things = [];
}
add<A>(something: A): void {
this._things.push(something);
}
get<B>(index: number): B {
return this._things[index];
}
}
let Stringss = new Collection();
Stringss.add<string>("hello");
Stringss.add("world");
static add<A>(something: A): void {
_things.push(something);
}
泛型约束
function printName<T>(arg: T) {
console.log(arg.length);
return arg;
}
printName(3);
interface NameArgs {
length: number;
}
function printName<T extends NameArgs>(arg: T) {
console.log(arg.length);
return arg;
}
printName({length: 1,value: 3});
为什么是泛型
function test<T>(input: T[]): T {
//…
}
- 可使用编译时更强大的类型检查。在上诉示例中，编译器让你知道数组方法可用于输入，任何其他方法则不行。
- 你可以去掉不需要的强制类型转换。比如，如果你有一个常量列表：
其他资源
结论
服务热线 19970861797
