TypeScript中的class声明了什么

在初看TypeScript的时候在这里卡住的时间难以估计,并不能很好的理解”换个角度说,我们可以认为类具有 实例部分与 静态部分这两个部分。“这句话。今天再回头看这部分文档,在同事的帮助下突然有了比较通透的理解。

class Greeter {static standardGreeting = "Hello, there";greeting: string;greet() {if (this.greeting) {return "Hello, " + this.greeting;} else {return Greeter.standardGreeting;}}
}

想要描述上面类声明所表达的信息,需要从两方面去描述:

这个类本身是什么类型?(JavaScript中类作为函数/对象所需要的描述)

这个类被实例化之后的结果是什么类型?(Java中的类所表达的类型信息)

类类型interface描述

类在JS中是函数的语法糖,那么描述类类型和描述函数类型应该没啥区别,上面Greeter 类的类型可以描述如下:

interface GreeterInstanceType {greeting: string;greet(): string
}interface GreeterType {standardGreeting: string;new (): GreeterInstanceType
}

使用上面的类型来声明变量,确实没有报错,所以说明上面的类型可以描述class Greeter:

let test1: GreeterType = Greeter
let intance1: GreeterInstanceType = new Greeter()

上面的类型可以看出来有两个interface配合起来才能描述类,而这两部分分别对应的就是:

GreeterInstanceType描述的是类的实例部分

GreeterType描述的是类的自身

这两部分就是TypeScript文档中描述的实例部分静态部分

类类型默认描述

上面是通过interface来描述class是可以做到的,对于描述类,TypeScript还提供了更友好的方法。

let test2: Greetertest2 = new Greeter()

上面代码中将类Greeter作为类型使用,这里表示的是test2是Greeter类型,这毋庸置疑。
但是Greeter本身表示的是什么呢? 这里表示的是Greeter这个类实例化的对象的类型。

可以换个角度来考虑,相同的代码带入到Java中,如下:

Greeter test2 = new Greeter();

但是如果是这样的一定是有问题的:

Greeter test2 = Greeter;

这是说不通的,因为这里的意思是Greeter这个类型是Greeter这个类的类型。

所以Greeter类作为类型表示的是Greeter类实例对象的类型。

那么怎么通过Greeter类来表示这个类自身(也就是类作为JS函数的描述),而不是这个类的实例呢?

let intance1: typeof Greeter = Gretter

上面的代码可以理解为设置变量instance1的类型为Greeter类型的类型。

Greeter表示的是Greeter实例的类型,那么Greeter实例的类型自然就是Greeter这个类本身的类型。

继续理解typeof:

typeof可以简单理解为提取变量的类型,所以还可以如下使用:

let a: number = 1let b: typeof a = 2

因为a的类型是number所以typeof a的值是number,所以b的类型就是number。

以上就是我理解的类声明所表达的全部内容。

参考

typescript文档 - 类

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/361974.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

CentOS 6下搭建Apache+MySQL+PHP+SSL

网上的一些文章都已经比较老了,现在版本高了之后,其实配置是很省力的(不考虑什么负载的话) 分享全过程,出了文中提到的安装epel rpmfushion 源指令不同外,其他的过程也适用与Centos 5 1.安装CentOS 6 ,可以…

通过设计国际象棋游戏来了解策略模式

今天,我们将借助一个示例来尝试了解策略模式。 我们将考虑的示例是国际象棋游戏。 这里的目的是解释策略模式,而不是构建全面的国际象棋游戏解决方案。 策略模式:策略模式被称为行为模式-用于管理对象之间的算法,关系和职责。 策…

vs2010 问题 LINK : fatal error LNK1123: 转换到 COFF 期间失败: 文件无效或损坏

vs2010 问题 LINK : fatal error LNK1123: 转换到 COFF 期间失败: 文件无效或损坏 在安装 VS2010 后,再安装 VS2012 VS2015 等,原来的 .NET 4.0 会被替换为 .NET 4.5。不会恢复 .NET 4.0 。这时,VS2010的 cvtres.exe 就无法使用了。如果 PATH…

Nginx 使用try_files遇到的问题

背景: root /some/path; location / {try_files $uri $uri/ /dist/index.html; }使用React之类的的库来开发前端页面的时候,因为是单页应用所以需要上面的Nginx配置,用来在找不到html文件的时候内部重定向到/dist/index.html文件。 服务器上…

群发邮件

最近,通过两周的学习,对.net 的基础知识有了进一步的了解。觉得自己可以写个小程序了。于是花了两天时间写了一个 群发邮件的一个WinForm小程序。自己在这里小秀一下,表扬及鼓励一下自己。哈哈! 此小程序在发送邮件的基础上还添加…

深入研究ES6 Generators

ES6 Generators系列: ES6 Generators基本概念深入研究ES6 GeneratorsES6 Generators的异步应用ES6 Generators并发 如果你还不知道什么是ES6 generators,请看我的前一篇文章“ES6 Generators基本概念” 。如果你已经对它有所了解,本文将带你…

在JavaEE中使用CDI的简单面向方面的编程(AOP)

我们编写满足特定业务逻辑的服务API。 涵盖所有服务API(如安全性,日志记录,审核,度量延迟等)的跨领域问题很少。 这是一个重复的非业务代码,可以在其他方法之间重用。 重用的一种方法是将这些重复的代码移入…

sessionStorage什么时候失效

最近在调试程序的时候无意间看到 cookie 的过期时间是 session,这个 session 表示的是什么时候过期?牵扯出来另一个存储方案 sessionStorage 存储的数据又是什么时候过期呢? 在查找相关资料的时候总会看到会话结束的时候 cookie 会被清除&am…

ES6 解构赋值详解

解构赋值是对赋值运算符的扩展,可以将属性/值从对象/数组中取出,赋值给其他变量。 一、数组的解构赋值 1、基本用法 只要等号两边的模式相同,左边的变量就会被赋予对应的值。 let [a, [[b], c]] [1, [[2], 3]]; a // 1 b // 2 c // 3 let [a…

软件著作权申请流程

一、填写计算机软件著作权登记申请表(表格1份)包括软件全称、简称、版本号、开发完成日期、软件开发情况(独立开发、合作开发、委托开发、下达任务开发)、原始取得权利情况、继受取得权利情况、权利范围、软件用途和技术特点&…

Npm install failed with “cannot run in wd”

Linux环境下,root账户,安装某些npm包的时候报下面的错误,例如安装grunt-contrib-imagemin时: Error: EACCES, mkdir /usr/local/lib/node_modules/coffee-scriptnpm ERR! { [Error: EACCES, mkdir /usr/local/lib/node_modules/c…

Java EE 7 Batch中传递属性/参数的2种方式

对于Java EE 7批处理工具,有两种将属性/参数传递给块和批处理的方法。 本快速指南向您展示了两种方式,在开发批处理Java EE 7方式时可能会经常使用它们。 1.运行前预定义的属性/参数 预定义属性是您在部署应用程序之前定义的属性(名称/值对&…

Csharp 打印Word文件默認打印機或選擇打印機設置代碼

//打印文檔object nullobj Missing.Value;//aDoc wordApp.Documents.Open(ref file,// ref nullobj, ref nullobj, ref nullobj,// ref nullobj, ref nullobj, ref nullobj,// ref nullob…

ESLint共享配置的两种方式eslint-plugin和eslint-config

使用ESLint很久了,也看了ESLint官方文档很多遍,但对于ESLint配置的规则还是不胜清楚,例如: {"extends": ["plugin:prettier/recommended"] }上面extends的值为什么要"plugin:"开头?这里…

使用aggregate在MongoDB中查找重复的数据记录

我们知道,MongoDB属于文档型数据库,其存储的文档类型都是JSON对象。正是由于这一特性,我们在Node.js中会经常使用MongoDB进行数据的存取。但由于Node.js是异步执行的,这就导致我们无法保证每一次的数据库save操作都是原子型的。也…

Gradle入门:创建二进制分发

创建有用的应用程序之后,很可能我们想与其他人共享它。 一种方法是创建一个可以从我们的网站下载的二进制发行版。 这篇博客文章描述了如何满足以下要求的二进制发行版: 我们的二进制分发绝对不能使用所谓的“胖子”方法。 换句话说,我们的…

我的Google Adsense帐户被关

一、 上周四,我收到Google的邮件,宣布关闭我的Adsense帐户。 "您好! 查看了相关记录后,我们确认您的 AdSense 帐户存在引起无效活动的风险。保护 AdWords 广告客户,使其免受无效活动的侵害是我们的责任&#xff0…

网格布局之网格元素放置算法

接下来的网格元素放置算法将网格元素的自动位置解析为确定位置,确保每个网格元素具有布局明确的网格区域。(Grid spans 不需要特别的解析;如果没有明确指定,默认是1) 注意:当显式网格中没有位置放置自动放置…

csharp: ODP.NET,System.Data.OracleClient(.net 4.0) and System.Data.OleDb读取Oracle g 11.2.0的区别...

ODP.NET: 引用: using Oracle.DataAccess; //Oracle g 11.2.0 using Oracle.DataAccess.Client; using Oracle.DataAccess.Types; //下载 http://www.oracle.com/technetwork/topics/dotnet/downloads/net-downloads-160392.html //引用:D:\app\geovindu…

AngularJS快速入门指南15:API

API即Application Programming Interface(应用程序接口)。 AngularJS全局API AngularJS全局API是一组全局JavaScript函数,用来进行一些常用的操作,例如: 比较两个对象迭代对象进行数据格式转换 全局API函数可以通过an…