而且,下面是我的初始化,参考Angular教程：
@H_301_11@let PROJECTS: Project[] = [ { projectId: 1,description: "Sample",startDate: new Date("2016-12-12"),endDate: new Date("2017-1-13") },{ projectId: 2,description: "Sample 2",endDate: new Date("2017-1-13") } ];该模型应该在模板中使用如下：
@H_301_11@{{ project.getDaysRemaining() }}但是,我收到错误：
Property ‘getDaysRemaining’ is missing in type ‘{ projectId: number;
description: string; startDate: Date; endDate: Date; }’.
为什么我必须在TypeScript中初始化函数？或者,我错过了什么？
解决方法
代替：
@H_301_11@let PROJECTS: Project[] = [ { projectId: 1,endDate: new Date("2017-1-13") } ];你应该做：
@H_301_11@let PROJECTS: Project[] = [ new Project(1,"Sample",new Date("2016-12-12"),new Date("2017-1-13") ),new Project(2,"Sample 2",new Date("2017-1-13") ];说明
项目是一个类. getDaysRemaining()是该类的成员.要创建类的实例,可以使用新的Project(…).
{projectId：1,…}是一个不是类Project实例的对象.因此,所有成员都在括号之间定义为属性.
您可以通过{{{{{{{{{{{{{
project1：1,…} instanceof Project – 结果为false.
ES6？ TypeScript与JavaScript语言的最新进展有很多共同的语法.您可以在ES6中定义类,就像在TypeScript中一样.当然,除了类型和修饰符之外,JavaScript不是静态类型语言,而是动态类型语言.
@H_301_11@class Project { constructor(projectId,description,startDate,endDate) { this.projectId = projectId; this.description = description; this.startDate = startDate; this.endDate = endDate; } getDaysRemaining() { var result = this.endDate.valueOf() - Date.now().valueOf(); result = Math.ceil(result / (1000 * 3600 * 24)); return result < 0 ? 0 : result; } }在ES6中,您可以执行新的Project(),为所有参数提供undefined,但是在TypeScript中不能,因为缺少构造函数参数,并且在编译时检查了这个事实,如果有一个好的IDE检查TypeScript语法,那么在设计时.
在TypeScript中允许此操作的一个选项是定义可选参数,如下所示(请参阅参数附近的问号)：
@H_301_11@constructor( public projectId?: number,public description?: string,public startDate?: Date,public endDate?: Date ) { }常见问题 – 从源(如Web服务)获取一些数据
从Web服务获取项目数据时可能会遇到这种情况.在这种情况下,数据将被反序列化为普通对象{projectId：1,…}.从该数据中获取项目实例无法隐式完成,还需要完成其他工作.
@H_301_11@class Project implements IProject { ... static create(data: IProject) { return new Project(data.projectId,data.description,data.startDate,data.endDate); } ... }并且您可以使用接口(而不是任何)为您的数据在键入时提供额外的帮助,并实现它(类Project实现IProject)：
@H_301_11@interface IProject { projectId: number; description: string; startDate: Date; endDate: Date; }另一种选择是使用可选参数,但这可能不适用于所有情况：
@H_301_11@class Project implements IProject { ... constructor( public projectId?: number,public endDate?: Date ) { } static create(data: IProject) { return Object.assign(new Project(),data); } ... }因此,如果要像上面那样实现,接口将具有可选参数(检查问号)：
@H_301_11@interface IProject { projectId?: number; description?: string; startDate?: Date; endDate?: Date; }将TypeScript转换为JavaScript时的编译和接口将从最终代码中删除所有接口. JavaScript中没有“接口”概念.这是TypeScript的构造,其目的是提供其他类型信息.
试着坚持 – S =单一责任原则
在上面的代码中,Project有两个职责(不是一个).第一是保存一些项目数据.第二是计算剩余天数 – getDaysRemaining.对于单个班级来说,这可能太多了.
一个干净的解决方案可能是将其分成两部分.
有一个界面来表示项目的数据：
@H_301_11@interface IProject { projectId: number; description: string; startDate: Date; endDate: Date; }并将getDaysRemaining()移动到另一个类,如：
@H_301_11@class ProjectSchedulingService { getDaysRemaining(project: IProject) { var result = project.endDate.valueOf() - Date.now().valueOf(); result = Math.ceil(result / (1000 * 3600 * 24)); return result < 0 ? 0 : result; } }这样做的好处是数据 – IProject – 是独立的,其他功能可以放在其他自己的工作中 – 比如ProjectSchedulingService.
另一个优点是IProject可以帮助处理普通对象,而不是实例化其他类.您可以从Web服务获取数据,将其转换为接口并以键入的方式工作.
另一个优点是业务可以分为多个类 – 比如ProjectSchedulingService–因此可以单独进行单元测试,而不是拥有数据及其中所有相关业务的繁重单片类.
另一个优点是拥有多个类有助于更容易地定义类之间的依赖关系,从而保持业务语义,并能够模拟类和单元的所有依赖关系来测试手头类的业务.
以Angular为例,您可以根据需要注入多个服务(类).拥有一个单一的服务意味着传递只需要其中一部分的东西.从而打破了界面隔离.
这可能听起来很愚蠢,因为代码很小,但随着时间的推移,这将继续增长,而下一代开发人员可能仍然以相同的单片方式继续开发而不是重构.经过一段时间后,由于维护代码的难度,许多估计值会增加或被破坏. cyclomatic complexity也变得最差,也是单元测试的代码覆盖率.
