TypeScript 素描 - 类

Posted liangshiwei

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了TypeScript 素描 - 类相关的知识,希望对你有一定的参考价值。

本文虽然是学自官方教程而来,但是也融入了自己的理解,而且对官方的例子做了一些修改

/*
 类 面向对象编程的一大核心
使用C#、Java进行编程的朋友肯定已经是不能够再熟悉了
TypeScript的类与C#的类有着很高的相似度,但也有着些许不同
*/


//构造函数不同,与类同名不再是构造函数而是方法
//构造函数则是constructor
class Animal {
    //构造函数
    constructor(public name: string) {
        this.name = name

    }
    //方法
    Animal() {
        console.log(`say hi ${this.name}`);
    }
}
let a1 = new Animal("小明");
a1.Animal();

//继承与C#中没有什么区别  使用extends关键字
//有则必须Super父类的构造函数
class Log extends Animal {
    constructor(public name: string, public age: number) {
        super(name);
        this.age = age;
    }
}
let l1 = new Log("旺财", 10);
//因为 log父类是Animal ,所以天生log就有Name字段与Animal方法
l1.Animal()

//修饰符 与C#类似一共有 private public protected readonly
//无需多言相信大家都懂得这是什么意思 
//有趣的是  TypeScript使用的是兼容性类型系统 ,当我们比较两种
//不同类型的时候,并不在乎它们从何而来,如果所有的成员类型都是
//兼容的,那它们就是相同的

/*
还有一个有趣的是,在上面的代码中我并没有写Name字段和Age字段,
构造函数中的参数加了修饰符 public 。这就是TypeScrpt中的参数属
性。name参数同样也是属性
*/


/* 
存取器  也就是Get;Set;  C#也叫做属性,用来控制字段的访问与设置
下面这个代码相信大家都可以看的懂是做什么
*/

class Employee {
    private _fullName: string;

    get fullName(): string {
        return this._fullName;
    }
    set fullName(name: string) {
        if (name == "xxxxx") {
            console.log("你这样做是不对的");
        } else {
            this._fullName = name;
        }
    }
}
let em = new Employee();
em.fullName;

/*
静态成员,嗯这也很容易理解的,它存在于类上而不是类的实例
*/
class Grid {
    static origin: string = "staticvalue";
}
Grid.origin;

/*
抽象类与抽象方法 abstract关键字 用过C#的朋友也一样知道这是什么,如果不
知道……就去面壁吧
*/
abstract class Animal2 {
    abstract makeSound(): void;
}

class Log2 extends Animal2 {
    makeSound(): void {
        console.log("我必须实现");
    }
}

以上是关于TypeScript 素描 - 类的主要内容,如果未能解决你的问题,请参考以下文章

TypeScript 素描 - 装饰器

C# 利用AForge.NET开源类库实现 图像素描效果

typescript Angular 2测试片段。代码库https://developers.livechatinc.com/blog/category/programming/angular-2/

typescript Angular最终版本的Angular 2测试片段。代码库https://developers.livechatinc.com/blog/category/programming

typescript Angular最终版本的Angular 2测试片段。代码库https://developers.livechatinc.com/blog/category/programming

typescript Angular最终版本的Angular 2测试片段。代码库https://developers.livechatinc.com/blog/category/programming