总目录

从C#到TypeScript - 类

在ES6之前Javascript的类都是用function定义的,ES6把类关键字正式加进来,虽说其实也还是function,不过代码可读性上好了不少。

TypeScript同样支持class,并且和C#也非常相似,下面来看看:

类

同C#一样,由构造函数,属性,方法组成,属性和方法有三个级别的访问权限:private, protected, public,比C#少个internal。

不过不同的是C#类的成员默认是private,而TypeScript默认是public。

在类里面所有成员都必须用this来访问。

class User{
constructor(name: string, pwd: string){
this.name = name;
this.pwd = pwd;
} name: string;
private pwd: string; checkLogin(): boolean{
return this.name === 'brook' && this.pwd === '123';
}
} let u: User = new User('brook', '123');
console.info(u.checkLogin()); // true u.name = 'test';
console.info(u.checkLogin()); // false

参数属性

上面的User类有两个成员,而且都是从构造函数赋值的,也就是其实构造函数的参数就是类的成员,这就是参数属性。

类里面的那两个属性其实可以不用写,只要在构造函数的参数上加上操作限定符,TypeScript就会自动为参数生成属性,来重构下上面的User。

class User{
constructor(public name: string, private pwd: string){ } checkLogin(): boolean{
return this.name === 'brook' && this.pwd === '123';
}
}

getter/setter

同样,也有存取器,不过语法和C#不太一样,写起来稍麻烦些。

只有get的时候也就变成只读属性了。

class User{
private _name: string; get name(): string{
return this._name;
} set name(name: string){
this._name = name;
}
}

静态属性和方法

上面说的都是实例成员,TypeScript也支持静态成员,不用实例化,而是通过类名来访问。

class User{
static permission = 'user'; static setPermission(p: string){
User.permission = p;
}
} console.info(User.permission); // user User.setPermission('admin');
console.info(User.permission); // admin

也同时支持static和readonly,不过static要放在前面,这样可以实现单例模式。

class User{

    static readonly instance = new User();

    private constructor(){}

    checkLogin(name: string, pwd: string): boolean{
return name === 'brook' && pwd === '123';
}
} console.info(User.instance.checkLogin('brook', '123'));

抽象类

这点和C#一样,都可以用抽象类来把有共同行为抽象出来,关键字都是abstract。

不能实例化,可以包含实现,abstract标识的方法,继承类必须实现。

但没有virtual关键字,不过和Java一样,可以认为是天生虚函数,也不需要override,直接覆盖也能支持多态。

继承类里要调用父类的函数需要用super关键字。

abstract class User{
name: string;
pwd: string; abstract checkLogin(): boolean; checkName(): boolean {
return this.name.indexOf('.') < 0;
}
} class Admin extends User {
checkLogin(): boolean { // 必须实现的抽象方法
return this.checkName();
} checkName(): boolean { // 这里会把User里的checkName覆盖掉
return true && super.checkName();
}
} let user: User;
user = new Admin();
user.name = 'brook.shi';
console.info(user.checkLogin()); // 同样有多态,checkLogin里调用的是Admin的checkName

另外,继承时还需要注意,如果派生类里有构造函数,则构造函数必须要调用父类的构造函数:super()。

兼容性

TypeScript里的类是有兼容性的,这点和C#很不一样,TypeScript认为:只有成员的类型是兼容的,那它们的类型也是兼容的。

不过成员的兼容对于public很宽容,完全不相干的类如果全是public的成员,并且一致就认为是兼容的。

但对于private和protected则只有是继承的才会被认可为兼容。

class Test1{
name: string;
pwd: string; checkName(): boolean{
return true;
}
} class Test2{
name: string;
pwd: string; checkName(): boolean{
return false;
}
} let t: Test1 = new Test2();
console.info(t.checkName()); // false

如果给上面的Test和Test2各加一个private email: string;,结果是编译不了,因为它们并不是继承关系,也就兼容不了。

泛型

同接口一样支持泛型,用法也一样,可以参考接口泛型。

interface Testable<T> {
field: T;
method(arg: T): T;
} class Test<T> implements Testable<T>{
field: T;
method(arg: T): T{
console.info(`arg is ${typeof arg}`);
return null;
}
} let test11 = new Test<string>();
test11.method('method'); // arg is string
test11.method(123); // error, 123 is not string

总的来说,TypeScript的类和C#或Java可以说十分相似,除了兼容性基本上没有什么新的东西,不过对于JavaScript来说却是一大进步了。

从C#到TypeScript - 类的更多相关文章

  1. .NET手撸绘制TypeScript类图——上篇

    .NET手撸绘制TypeScript类图--上篇 近年来随着交互界面的精细化,TypeScript越来越流行,前端的设计也越来复杂,而类图正是用简单的箭头和方块,反映对象与对象之间关系/依赖的好方式. ...

  2. .NET手撸绘制TypeScript类图——下篇

    .NET手撸绘制TypeScript类图--下篇 在上篇的文章中,我们介绍了如何使用.NET解析TypeScript,这篇将介绍如何使用代码将类图渲染出来. 注:以防有人错过了,上篇链接如下:http ...

  3. TypeScript:类(Classes)

    返回TypeScript手册总目录 传统的Javascript关注的是函数(function)和基于原型(prototype-based)的继承作为构建可重复使用组件的基本方式,但是与更舒服地使用面向 ...

  4. typescript类的修饰符

    学习过java的小姐姐,小哥哥应该很好理解,但还是啰嗦的写出来! typescript里面定义属性的时候给我们提供了 三种修饰符 public :公有 在当前类里面. 子类 .类外面都可以访问 pro ...

  5. typescript类(学习笔记非干货)

    我们声明一个 Greeter类.这个类有3个成员:一个叫做greeting的属性,一个构造函数和一个greet方法. We declare a Greeter class. This class ha ...

  6. typescript类与继承

    /* 1.vscode配置自动编译 1.第一步 tsc --inti 生成tsconfig.json 改 "outDir": "./js", 2.第二步 任务 ...

  7. typescript类 继承 修饰符

    //1.ts中类的定义 /* es5: function Person(name){ this.name=name; this.run=function(){ console.log(this.nam ...

  8. typescript 类(类的定义、继承、修饰符、抽象类)

    代码: // 本节内容 // 1.类的定义 // 2.类的继承 // 3.访问修饰符 // 4.静态属性和静态方法 // 5.抽象类和多态 // js // function Person(name) ...

  9. TypeScript入门四:TypeScript的类(class)

    TypeScript类的基本使用(修饰符) TypeScript类的抽象类(abstract) TypeScript类的高级技巧 一.TypeScript类的基本使用(修饰符) TypeScript的 ...

随机推荐

  1. Spring MVC 关于分页的简单实现

    据本人了解,目前较常用的分页实现办法有两种: 1.每次翻页都修改SQL,向SQL传入相关参数去数据库实时查出该页的数据并显示. 2.查出数据库某张表的全部数据,再通过在业务逻辑里面进行处理去取得某些数 ...

  2. ireport 取消自动分页,detail不分页,当没有数据的时候显示title

    报表文件属性页面 lgnore pagination 勾选上,就可以取消分页功能.

  3. Memcached源码分析之thread.c

    /* * 文件开头先啰嗦几句: * * thread.c文件代表的是线程模块.但是你会看到这个模块里面有很多其它方法, 例如关于item的各种操作函数,item_alloc,item_remove,i ...

  4. 【转载】Eclipse 断点调试

      作为开发人员,掌握开发环境下的调试技巧十分有必要.去年就想把关于Eclipse断点调试总结下了,由于对时间的掌控程度仍需极大提高,结果拖到今年才写了此篇博文.关于Java调试技术还有很多,如Jav ...

  5. Java的进制转换操作(十进制、十六进制、二进制)

    2014-05-06 17:34 吴文付 最近由于工作上的需要,遇到进制转换的问题.涉及到的进制主要是 十进制,十六进制,二进制中间的转换. 这里整理一下.具体的计划为:封装一个转换类,一个测试类. ...

  6. UVa 10034 - Freckles

    题目大意:给出n个点的坐标(x,y),要求用线段将n个点连接起来,求最小的线段和. 最小生成树问题,用Kruskal算法进行求解,其中用到了并查集.将所有的点连接,构成一张图,对每一条边进行编号,两点 ...

  7. Python3基础 闭包 简单示例

    镇场诗: 诚听如来语,顿舍世间名与利.愿做地藏徒,广演是经阎浮提. 愿尽吾所学,成就一良心博客.愿诸后来人,重现智慧清净体.-------------------------------------- ...

  8. HNU 13073 Ternarian Weights 解题报告

    本题大意: 用天平对一物品进行称重,现有重量不同的砝码,砝码的重量分别为:1,3,9,27,..,3^n.(n<20) 天平的右侧放砝码,左侧放物品或物品和砝码,使得左右两边的重量相等. 现有一 ...

  9. GWAS

    GWAS的数据形式:SNP数据,即各个SNP位点的aa,Aa,AA基因型与疾病状态(0正常,1患病)的样例-对照数据. 在遗传流行病学上,全基因组关联研究(Genome Wide Associatio ...

  10. 小结IE6的坑

    1.z-index在position:relative/absolute等定位属性设置后还是无效,会导致top栏的导航栏目的子菜单被下面的层遮住,无法显示:解决办法:?http://www.wufan ...