-
kind
1.1 Class declaration, the content of the Person.ts file is as followsclass Person{ /**The default access controller is public * The variable or method modified by the private controller can only be used inside this class and cannot be called from outside * The variable or method modified by the protected controller is called within this class and inherited subclasses */ name; eat() { console.log("I'm eating"); } } var p1 = new Person (); p1.name = "batman"; p1.eat(); var p2 = new Person(); p2.name = "superman"; p2.eat();
The contents of the compiled Person.js file are as followsvar Person = /** @class */ (function () { function Person() { } Person.prototype.eat = function () { console.log("I'm eating"); }; return Person; }()); var p1 = new Person (); p1.name = "batman"; p1.eat(); var p2 = new Person(); p2.name = "superman"; p2.eat();
1.2 The constructor of the class, the content of the Person2.ts file is as followsclass Person{ /**The following constructor is equivalent to * name; * constructor(name: string) { * this.name = name; * } */ constructor(public name: string) { } sayHello () { console.log(`Hello,my name is ${this.name}`); } } var p1 = new Person("batman"); p1.sayHello(); var p2 = new Person("superman"); p2.sayHello();
The contents of the compiled Person2.js file are as followsvar Person = /** @class */ (function () { /**The following constructor is equivalent to * name; * constructor(name: string) { * this.name = name; * } */ function Person(name) { this.name = name; } Person.prototype.sayHello = function () { console.log("Hello,my name is " + this.name); }; return Person; }()); var p1 = new Person("batman"); p1.sayHello(); var p2 = new Person("superman"); p2.sayHello();
1.3 Class inheritance, the content of the Person3.ts file is as followsclass Person{ constructor(public name: string) { } eat() { console.log(`eating!!!`); } } class Employee extends Person{ code; work() { console.log('working!!!'); } } var e1 = new Employee ('lisi');
The subclass calls the constructor and method of the parent class. The content of the Person4.ts file is as followsclass Person{ constructor(public name: string) { console.log('new Person'); } eat() { console.log(`eating!!!`); } } class Employee extends Person{ code; constructor(name: string, code: string) { /**必须先调用父类的构造函数 */ super(name); console.log('new Employee'); this.code = code; } work() { super.eat(); this.dowork(); } private dowork() { console.log('working!!!'); } } var e1 = new Employee('lisi', '123'); e1.work();
-
泛型
Person5.ts文件内容如下class Person{ constructor(public name: string) { console.log('new Person'); } eat() { console.log(`eating!!!`); } } class Employee extends Person{ code; constructor(name: string, code: string) { super(name); console.log('new Employee'); this.code = code; } work() { super.eat(); this.dowork(); } private dowork() { console.log('working!!!'); } } /**泛型为Person */ var worker: Array<Person> = []; worker[0] = new Person('liling'); worker[1] = new Employee('heliang', '133');
-
接口
方法参数的接口Person6.ts文件内容如下interface IPerson{ name: string; age: number; } class Person{ constructor(public config: IPerson) { } } var p1 = new Person({ age:18, name:'lining' });
编译后Person6.js的代码如下var Person = /** @class */ (function () { function Person(config) { this.config = config; } return Person; }()); var p1 = new Person({ age: 18, name: 'lining' });
类的接口Person7.ts文件的代码如下interface Animal{ eat(); } class Sheep implements Animal{ eat() { console.log('I eat grass'); } } class Tiger implements Animal{ eat() { console.log('I eat meat'); } }
编译后Person7.js的代码如下var Sheep = /** @class */ (function () { function Sheep() { } Sheep.prototype.eat = function () { console.log('I eat grass'); }; return Sheep; }()); var Tiger = /** @class */ (function () { function Tiger() { } Tiger.prototype.eat = function () { console.log('I eat meat'); }; return Tiger; }());
-
模块
文件即模块,a模块a.ts代码如下/**export向外暴露的资源*/ export var prop1; var prop2; export function func1() { } function func2(){ } export class Clazz1{ } class Clazz2{ }
b模块b.ts代码如下/**引用的资源*/ import { prop1, func1, Clazz1 } from './a' console.log(prop1); func1(); new Clazz1(); /**向外暴露的资源 */ export function func3(){ }
-
注解
为类、方法和变量加上直观明了的说明,这些说明信息与程序的业务逻辑无关,供指定的工具或框架使用 -
类型定义文件
*.d.ts文件,帮助开发者在TypeScript中使用已用的JavaScript包
搜索JavaScript包的类型定义文件工具https://github.com/typings/typings
类型定义文件下载地址https://github.com/DefinitelyTyped/DefinitelyTyped/tree/master/types/jquery
06. TypeScript object-oriented features
Guess you like
Origin http://43.154.161.224:23101/article/api/json?id=326168863&siteId=291194637
Recommended
Ranking