元数据

TypeScript入门与实战

  •  TypeScript入门与实战|200
  • 书名: TypeScript入门与实战
  • 作者: 钟胜平编著
  • 简介: TypeScript是一个开源的、跨平台且带有类型系统的avaScript超集,可以编译为纯JavaScript,然后运行在任意浏览器和其他环境中,使开发者可以使用一些未来JavaScript标准(ECMAScript 6和7)中的特性。TypeScript为JavaScript添加了可选的静态类型、类和模块,可使大型JavaScript应用使用更好的工具,并保持更清晰的结构。本书系统化介绍TypeScript程序设计,包括四大部分。第一篇“初识TypeScript”介绍TypeScript与JavaScript的关系以及快速开始编写第一个TypeScript程序,第二篇“TypeScript语言概览”介绍TypeScript语言基础、迭代器与生成器、装饰器、命名空间、模块等。第三篇“TypeScript类型系统”介绍TypeScript类型,如面量、枚举、非Nullable、非Nullable等,还介绍了更多高级类型,如联合、交叉、索引、映射对象、泛型、类类型、接口、类型别名、多态的this、有条件类型、类型查询、类型断言等,最后介绍类型更深入内容,如类型声明合并、类型推论、类型兼容性、外部类型声明、编写声明文件等。第四篇“TypeScript应用”通过综合案例介绍TypeScript的配置管理、开发技巧等。
  • 出版时间 2020-11-01 00:00:00
  • ISBN: 9787111669722
  • 分类: 计算机-编程设计
  • 出版社: 机械工业出版社
  • PC地址:https://weread.qq.com/web/reader/a2c321c0721cac5ea2c585f

高亮划线

版权信息

📌 TypeScript入门与实战 ⏱ 2022-06-03 21:34:02

第1章 TypeScript简介

📌 TypeScript语言的特色是其能够取得成功的重要原因 ⏱ 2022-05-24 17:51:21

1.1 什么是TypeScript

📌 如今,JavaScript不仅能够用在网页端程序的开发,还被用在了服务器端应用的开发上。但有一个不争的事实—JavaScript语言不是为编写大型应用程序而设计的。例如,JavaScript语言在相当长的时间里都缺少对模块的支持。此外,在编写JavaScript代码的过程中也缺少开发者工具的支持。因此,编写并维护大型JavaScript程序是困难的。 ⏱ 2022-05-25 00:11:44

📌 开发者不但能够快速地将现有的JavaScript程序迁移到TypeScript,而且能够继续使用依赖的JavaScript代码库,比如jQuery等。因此,就算现有工程中依赖的第三方代码库没有迁移到TypeScript,它也不会阻碍程序开发。反之,TypeScript能够让我们更好地利用现有的JavaScript代码库。 ⏱ 2022-05-25 00:16:51

📌 TypeScript代码不能直接运行,它需要先被编译成JavaScript代码然后才能运行。Type-Script编译器(tsc)将负责把TypeScript代码编译为JavaScript代码。 ⏱ 2022-05-25 00:16:54

📌 我们能够看到编译器生成的JavaScript代码既清晰又简洁,并且两者之间在代码结构上几乎没有明显变化。在阅读由编译器生成的JavaScript代码时,并不会让开发者强烈地感觉到代码是由机器生成的。 ⏱ 2022-05-25 00:17:15

📌 TypeScript应该生成简洁、符合编写习惯并易于识别的JavaScript代码;TypeScript不应该对代码进行激进的性能优化。 ⏱ 2022-05-25 00:17:20

📌 正如TypeScript其名,类型系统是它的核心特性。 ⏱ 2022-05-25 00:18:38

📌 TypeScript语言是开放的。 ⏱ 2022-05-25 00:18:59

📌 TypeScript语言是跨平台的。 ⏱ 2022-05-25 00:18:57

1.2 为什么要使用TypeScript

📌 开发者选择使用TypeScript语言至少有以下几点原因:▪能够更早地发现代码中的错误。▪能够帮助提高生产力。▪支持JavaScript语言的最新特性并且使用了与JavaScript语言相同的语法和语义。 ⏱ 2022-05-25 00:19:09

📌 如果使用了TypeScript语言,那么在编译程序时就能够发现拼写错误。如果使用了支持TypeScript的代码编辑器,如Visual Studio Code,那么在编写代码的过程中就能够检查出拼写错误 ⏱ 2022-05-25 00:20:33

📌 支持JavaScript的最新特性 ⏱ 2022-05-25 00:21:29

📌 在TypeScript程序中,我们可以直接使用这些新特性而不必过多担心兼容性问题。例如,async和await是ECMAScript 2017中引入的新特性,我们可以在TypeScript程序中直接使用它们。TypeScript编译器将负责把代码编译成兼容指定ECMAScript版本的JavaScript代码。 ⏱ 2022-05-25 00:21:27

📌 它是使用TypeScript语言并基于Electron框架进行开发的。 ⏱ 2022-05-25 00:21:38

📌 根据Stack Overflow 2019年的开发者调查显示,Visual Studio Code是开发者最喜爱的开发环境工具, ⏱ 2022-05-25 00:21:43

📌 严格地讲,当使用“Angular”这个名字时,我们指的是Angular 2.0及以上版本;而当使用“AngularJS”这个名字时,则特指Angular 1.x版本。 ⏱ 2022-05-25 00:21:54

第2章 快速开始

📌 众所周知,学习一门编程语言最好的方式就是使用它来编写代码。推荐读者在学习TypeScript语言时亲自编写并运行程序,因为它能够帮助你加深理解。 ⏱ 2022-05-25 00:22:40

📌 值得一提的是,在版本列表的末尾有一个特殊的版本“Nightly”,即“每日构建”版本,这是一种方法实践,采用了该方法的软件每天都会基于最新的程序源代码构建出一个版本,它能够让用户尽早地试用新版本的软件并提供反馈信息。在太平洋标准时间每日午夜(与北京时间相差16小时,夏令时相差15小时),TypeScript会自动从其代码仓库的主分支上拉取最新的代码并构建出一个“Nightly”版本,然后分别发布到npm和NuGet。 ⏱ 2022-05-25 00:24:27

📌 ▪JSX:用于指定JSX代码的生成方式,又名JavaScript XML,是JavaScript语法的扩展,常用在React应用中。 ⏱ 2022-05-25 00:25:10

📌 本书将以Visual Studio Code代码编辑器为例来演示如何搭建和使用TypeScript开发环境。 ⏱ 2022-05-25 00:25:46

📌 安装TypeScript语言最简单的方式是使用npm工具。 ⏱ 2022-05-25 00:26:13

📌 在安装Node.js的同时,也会自动安装npm工具。 ⏱ 2022-05-25 00:26:17

📌 “npm install”是npm命令行工具提供的命令之一,该命令用来安装npm代码包及其依赖项;“-g”选项表示使用全局模式[插图]安装TypeScript语言;最后的“typescript”代表的是TypeScript语言在npm注册表中的名字。 ⏱ 2022-05-25 00:26:22

📌 LTS(长期支持)是软件生命周期管理策略的一种,它的维护周期比一般版本的维护周期要长一些。

  • 💭 Long Term Support - ⏱ 2022-05-25 00:26:33

📌 可选步骤:设置默认构建任务

  • 💭 之前没有接触过这种用法 - ⏱ 2022-05-25 00:30:57

第3章 TypeScript语言基础

📌 TypeScript是JavaScript的超集。更确切地说,TypeScript是ECMAScript 2015(ES6)的超集。TypeScript语言支持ECMAScript 2015规范中定义的所有特性,例如类和模块等。 ⏱ 2022-05-25 00:31:48

📌 避免增加表达式级别的语法,仅增加类型相关语法。 ⏱ 2022-05-25 00:31:59

📌 TypeScript语言相当于JavaScript语言的“语法糖[插图]”。 ⏱ 2022-05-25 00:32:11

📌 在计算机科学中,语法糖指的是编程语言里的某种语法,这种语法对语言的功能没有影响,但是会方便开发者的使用,能够让程序更加简洁,具有更高的可读性。 ⏱ 2022-05-25 00:32:20

3.1 变量

📌 在计算机程序中,一个变量使用给定的符号名与内存中的某个存储地址相关联并且可以容纳某个值。变量的值可以在程序的执行过程中改变。当我们操作变量时,实际上操作的是变量对应的存储地址中的数据。 ⏱ 2022-05-25 00:36:03

📌 在JavaScript中,每个变量都有唯一的名字,也叫作标识符。 ⏱ 2022-05-25 00:36:42

📌 允许包含字母、数字、下划线和美元符号“$” ⏱ 2022-05-25 00:36:45

📌 其中,var声明是在ECMAScript 2015之前就已经支持的变量声明方式,而let和const声明则是在ECMAScript 2015中新引入的变量声明方式。 ⏱ 2022-05-25 00:37:08

📌 与var声明和let声明不同,const声明用于定义一个常量。const声明使用const关键字来定义,并且在定义时必须设置一个初始值。const声明在初始化之后不允许重新赋值。 ⏱ 2022-05-25 00:37:59

📌 变量的作用域指的是该变量的可访问区域,一个变量只能在其所处的作用域内被访问,在作用域外是不可见的。块级作用域中的块指的是“块语句”。 ⏱ 2022-05-25 00:38:16

📌 块级作用域指的就是块语句所创建的作用域,使用let声明和const声明的变量具有块级作用域,但是使用var声明的变量不具有块级作用域。 ⏱ 2022-05-25 00:38:23

3.2 注释

📌 通过阅读代码能够了解程序在“做什么”,而通过阅读注释则能够了解“为什么要这样做”。 ⏱ 2022-05-25 00:43:27

📌 其中,“//#region”定义了代码折叠区域的起始位置,“//#endregion”定义了代码折叠区域的结束位置。 ⏱ 2022-05-25 00:43:50

📌 JavaScript使用UTF-16编码来表示一个字符。UTF-16编码以两个字节作为一个编码单元,每个字符使用一个编码单元或者两个编码单元来表示。 ⏱ 2022-05-25 00:46:52

📌 ECMAScript 2015规定了字符串允许的最大长度为253 - 1,该数值也是JavaScript所能安全表示的最大整数。 ⏱ 2022-05-25 00:47:09

📌 Number类型表示一个数字。JavaScript不详细区分整数类型、浮点数类型以及带符号的数字类型等。JavaScript使用双精度64位浮点数格式(IEEE 754)来表示数字,因此所有数字本质上都是浮点数 ⏱ 2022-05-25 00:48:21

📌 Symbol是ECMAScript 2015新引入的原始类型。Symbol值有一个重要特征,那就是每一个Symbol值都是唯一的且不可改变的。Symbol值的主要应用场景是作为对象的属性名。 ⏱ 2022-05-25 00:48:29

📌 我们可以将“Symbol()”函数想象成GUID(全局唯一标识符)的生成器,每次调用“Symbol()”函数都会生成一个完全不同的Symbol值。 ⏱ 2022-05-25 00:49:32

📌 Well-Known Symbol ⏱ 2022-05-25 00:49:59

📌 对象属性使用键值来标识,键值只能为字符串或Symbol值。所有字符串(也包括空字符串)和Symbol值都是合法的键值。 ⏱ 2022-05-25 00:50:48

3.4 字面量

📌 在计算机科学中,字面量用于在源代码中表示某个固定值。在JavaScript程序中,字面量不是变量,它是直接给出的固定值。

  • 💭 不是很理解 - ⏱ 2022-05-25 00:51:25

📌 二进制整数字面量、八进制整数字面量、十进制数字面量以及十六进制整数字面量。 ⏱ 2022-05-25 00:51:19

📌 JavaScript中的主流编码风格推荐使用单引号表示字符串字面量。 ⏱ 2022-05-25 00:51:56

📌 模板字面量是ECMAScript 2015引入的新特性,它提供了一种语法糖来帮助构造字符串。模板字面量的出现帮助开发者解决了一些长久以来的痛点,如动态字符串的拼接和创建多行字符串等。模板字符串的基本语法是使用反引号“`”(键盘上数字键1左侧的按键)替换了字符串字面量中的单、双引号。 ⏱ 2022-05-25 00:52:36

3.5 对象

📌 对象属性可以是任意数据类型,如数字、函数或者对象等。当对象属性为函数时,我们通常称之为方法。当然,这只是惯用叫法不同,在本质上并无差别。 ⏱ 2022-05-25 00:53:02

📌 3.5.1.2 存取器属性 ⏱ 2022-05-25 00:53:58

📌 每个对象都有一个原型。对象的原型既可以是一个对象,即原型对象,也可以是null值。原型对象又有其自身的原型,因此对象的原型会形成一条原型链,原型链将终止于null值。 ⏱ 2022-05-25 00:56:46

📌 dog和cat与其原型animal之间具有隐含的引用关系,该关系是通过对象的一个内部属性来维持的,即图3-7中的“Prototype”属性。所谓隐含的引用关系是指,对象的原型不是对象的公共属性,因此无法通过对象属性访问来直接获取对象的原型。 ⏱ 2022-06-03 21:40:09

📌 在立即执行的函数表达式中,我们在起始和结尾位置分别添加了分号。这是为了防止使用代码压缩工具处理代码之后产生错误的语法。 ⏱ 2022-06-03 22:31:52

📌 箭头函数除了能够提供简洁的语法外还有一个特别重要的特性,那就是箭头函数本身没有this绑定,它使用外层作用域中的this绑定。该特性能够帮助缓解程序中常见的一些错误。 ⏱ 2022-06-03 22:40:46

第4章 TypeScript语言进阶

📌 TypeScript语言的一大特色就是能够支持JavaScript语言中的新特性而不必过多担心兼容性问题。开发者可以在TypeScript程序中使用新的JavaScript语言特性,然后由TypeScript编译器将程序编译成兼容指定ECMAScript规范版本的JavaScript程序。通过这种方式,开发者既可以在程序中使用新的语言特性,又不必担心程序兼容性问题。 ⏱ 2022-06-03 22:42:56

4.3 解构

📌 avaScript中的解构是指将数组或对象在结构上进行分解,将其拆分成独立的子结构,然后可以访问那些拆分后的子结构。 ⏱ 2022-06-03 23:19:55

4.4 可选链运算符

📌 可选链运算符

  • 💭 ?. - ⏱ 2022-06-03 23:23:47

📌 如果obj的值为undefined或null,那么表达式的求值结果为undefined;否则,表达式的求值结果为obj.prop。 ⏱ 2022-06-03 23:56:25

📌 如果可选链运算符左侧操作数的求值结果为undefined或null,那么右侧的操作数不会再被求值,我们将这种行为称作短路求值。 ⏱ 2022-06-04 00:02:02

4.5 空值合并运算符

📌 当且仅当“??”运算符左侧操作数a的值为undefined或null时,返回右侧操作数b;否则,返回左侧操作数a。 ⏱ 2022-06-04 00:02:13

📌 当进行JavaScript代码到TypeScript代码的迁移工作时,非严格类型检查是一个不错的选择,因为它能够让我们快速地完成迁移工作。 ⏱ 2022-06-04 00:09:44

📌 此例中,Direction枚举是联合枚举类型,它等同于联合类型UnionDirectionType,其中“|”符号是定义联合类型的语法。关于联合类型的详细介绍请参考6.3节。 ⏱ 2022-06-04 01:01:20

5.7 顶端类型

📌 顶端类型是一种通用类型,有时也称为通用超类型,因为在类型系统中,所有类型都是顶端类型的子类型,或者说顶端类型是所有其他类型的父类型。 ⏱ 2022-06-04 01:12:46

📌 never类型可以作为函数的返回值类型,它表示该函数无法返回一个值。 ⏱ 2022-06-04 01:14:01

📌 如果数组元素是复杂类型,如对象类型和联合类型等,则可以选择使用泛型数组类型表示法。它也许能让代码看起来更加整洁一些。 ⏱ 2022-06-04 01:16:45

5.10 元组类型

📌 元组(Tuple)表示由有限元素构成的有序列表。 ⏱ 2022-06-04 01:20:10

📌 由于元组与数组之间存在很多共性,因此TypeScript使用数组来表示元组。 ⏱ 2022-06-04 01:20:14

📌 Object类型是特殊对象“Object.prototype”的类型,该类型的主要作用是描述JavaScript中几乎所有对象都共享(通过原型继承)的属性和方法。 ⏱ 2022-06-04 16:03:03

📌 多余属性会对类型间关系的判定产生影响。 ⏱ 2022-06-04 17:15:33

📌 多余属性是一个相对的概念,只有在比较两个对象类型的关系时谈论多余属性才有意义。 ⏱ 2022-06-04 17:15:43

读书笔记

2.2.3 安装TypeScript

划线评论

📌 LTS(长期支持)是软件生命周期管理策略的一种,它的维护周期比一般版本的维护周期要长一些。 ^8292450-7zvcBzyUT - 💭 Long Term Support - ⏱ 2022-05-25 00:26:46

2.2.7 可选步骤:设置默认构建任务

划线评论

📌 可选步骤:设置默认构建任务 ^8292450-7zvcTiGBm - 💭 之前没有接触过这种用法 - ⏱ 2022-05-25 00:31:08

3.3.6 Symbol

划线评论

📌 这些Symbol常量用作对象属性名,它们的功能是定制对象的特定行为。 ^8292450-7zve8UyY5 - 💭 暴露内部操作 - ⏱ 2022-05-25 00:50:15

3.4 字面量

划线评论

📌 在计算机科学中,字面量用于在源代码中表示某个固定值。在JavaScript程序中,字面量不是变量,它是直接给出的固定值。 ^8292450-7zveeavBC - 💭 不是很理解 - ⏱ 2022-05-25 00:51:32

4.4 可选链运算符

划线评论

📌 可选链运算符 ^8292450-7zKlzC8rS - 💭 ?. - ⏱ 2022-06-03 23:23:46

本书评论