TypeScript+React Web应用开发实战-图书

推荐0
收藏0
浏览71

TypeScript+React Web应用开发实战

王金柱编著 (作者)　董英 , 付睿 (责任编辑)

书　　号：9787121469299
出版日期：2024-03-01
页　　数：
开　　本：16(185*235)
出版状态：上市销售
维护人：博文小编

《TypeScript+React Web应用开发实战》适应于当今前端开发的流行趋势，注重理论与实战相结合的思想，配合大量的、基础且实用的代码实例，帮助读者学习基于TypeScript语言规范的React框架开发的相关知识。全书内容通俗易懂、覆盖面广、充分翔实、重点突出，涵盖了TypeScript语言规范和React框架开发的方方面面。
《TypeScript+React Web应用开发实战》内容共10章，TypeScript语言部分包括TypeScript语言基础与开发环境的搭建、TypeScript项目开发与配置、TypeScript语法规范和TypeScript语法高级特性等方面的内容；React框架部分包括React框架基础与开发环境的搭建，React语法、组件、状态与生命周期，React框架高级指引和React Hook新特性等方面的内容。同时，为了突出本书项目实战的特点，针对性地开发了两个Web项目应用，以帮助读者深入学习基于TypeScript + React技术的开发流程。
《TypeScript+React Web应用开发实战》是学习基于TypeScript + React技术开发的实战图书，全书内容简明、代码精练、实例丰富。希望本书的内容能够帮助前端开发的初学者快速入门，尽快提高Web应用程序开发的技术水平。

免费赠送视频课程，配有丰富的项目实战案例，注重理论与实践相结合，系统介绍TypeScript和React的相关知识

王金柱，资深Web开发人员，硕士学历，毕业于华北电力大学计算机应用技术专业。作者本人对JavaScript和TypeScript语言开发有着较为深刻的理解，多年从事基于Node.js、React、Vue.js等Web前端开发语言框架的开发工作，参与过多家上市公司的企业级Web系统平台项目的前端模块开发工作，有着较为丰富的实践经验。参与了《15天学会JavaScript》（视频教学版）、《ECMAScript从零开始学》（视频教学版）、《Node.js 10实战》、《React.js 16从入门到实战》和《Vue.js+Node.js全栈开发实战》等Web前端图书的编写工作。本书是作者倾注了自己多年开发经验的呕心沥血之作，读者可以从中学习、领会基于TypeScript+React开发Web应用的诸多精妙之处。

前言
语言与框架
必须掌握的TypeScript语言
TypeScript语言主要利用支持静态类型与面向对象的特性，降低开发过程中出现未知错误的概率，提高开发效率并使项目具有很好的可维护性。同时，对有JavaScript语言开发经验及面向对象编程思想的开发人员而言，学习TypeScript语言并不困难。目前流行的三大前端开发框架（Angular、React和Vue.js）均已实现了对使用TypeScript语言进行开发的支持。
最流行的前端React框架
React框架自诞生开始就受到了广大前端开发人员的关注，这一切皆源自该框架自身的强大背景。React框架来自社交网络巨头Meta公司的一个内部项目——Instagram网站，目标是设计出一个成熟的JavaScript MVC前端框架。由于受制于多种因素，Meta公司始终不满意Instagram的框架设计，于是全新开发了React框架。
出乎意料的是，React框架因独特的设计思想成为一款革命性前端框架产品。目前，React框架凭借良好的性能优势、简洁的代码逻辑和庞大的受众群体，已经成为越来越多的开发人员进行Web应用开发的首选框架。
React框架的核心思想是通过封装组件来构建UI，组件维护自身的状态和UI，每当状态发生改变，就会自动重新渲染组件自身，而不需要通过反复查找DOM元素后再重新渲染整个组件。同时，React框架支持传递多种类型的参数，如代码声明、动态变量，甚至可交互的应用组件。因此，UI渲染既可以通过传统的静态HTML DOM元素，也可以通过传递动态变量，甚至通过整个可交互的组件来完成。
本书的内容安排
本书共10章，各章针对不同的知识点进行了详细的介绍。
第1章主要介绍了TypeScript语言的基础知识，包括TypeScript语言与JavaScript语言的关系、TypeScript编译器的原理、TypeScript语言的思维方式，以及搭建TypeScript开发环境等方面的内容。
第2章主要介绍了TypeScript项目开发与配置，包括通过Babel编译工具、Rollup工具和webpack工具进行TypeScript项目开发与配置方面的内容。
第3章主要介绍了TypeScript语言的一些新特性，包括基础类型、接口、类、函数、泛型和枚举等方面的内容。TypeScript是一种给JavaScript语言添加功能扩展特性的编程语言，这些新特性让前端脚本编程语言焕发出新的活力。
第4章主要介绍了TypeScript语言高级特性的内容，包括类型推论、类型兼容性、高级类型、迭代器、生成器、模块、命名空间及装饰器方面的内容。
第5章主要介绍了React框架的基础知识，包括React框架的特点和应用方式、编写React应用的方法、搭建React开发环境的方法，以及在React应用中使用TypeScript模板功能的方法。
第6章主要介绍了React虚拟DOM、React JSX/TSX语法扩展与表达式、React渲染机制、React组件设计与参数、React状态与生命周期、React事件处理、React组件条件渲染、React列表转化、React表单与受控组件、React状态提升、组合模式与特例关系等方面的内容。
第7章主要介绍了React代码分割、Context对象的使用方式、错误边界、Ref属性、Ref转发、React高阶组件技巧、PropTypes静态类型检查等方面的内容。
第8章主要介绍了React Hook的基础知识，主要包括State Hook应用、Effect Hook应用、Context Hook特性应用、React Hook使用规则、自定义Hook应用方面的内容。
第9章和第10章主要基于TypeScript语言规范和React框架技术，针对性地开发了两个Web项目应用，以帮助读者在实践中学习并掌握基于TypeScript + React技术开发Web前端应用的方法与流程。
本书特点
1．本书从最简单的、最通用的TypeScript代码实例出发，摒弃枯燥的纯理论知识介绍，通过实例讲解的方式帮助读者学习React框架开发的技巧。
2．本书内容涵盖TypeScript语言和React框架及其技术开发所涉及的绝大部分知识点，将这些内容整合起来，读者可以系统地了解这门语言的全貌，为介入大型Web项目的开发做很好的铺垫。
3．本书对实例中的难点进行了详细的分析，能够帮助读者有针对性地提高开发水平。此外，通过多个实际的项目应用，本书尽可能地帮助读者掌握React框架开发所涉及的方方面面。
4．本书在TypeScript语言和React框架的相关知识点上按照类别进行了合理的划分，全部的代码实例都是独立的，读者可以从头开始阅读，也可以从中间开始阅读，不会影响学习效果。
5．本书代码遵循重构原则，以避免代码污染，真心希望读者能写出优秀的、简洁的、可维护的代码。
本书涉及的主要软件或工具
Visual Studio Code Google Chrome EditPlus
Firefox Node&NPM
本书涉及的技术或框架
React JSON HTTP
HTML TypeScript HTTPS
HTML5 JavaScript CSS3
antd webpack Vite
RegExp
本书读者
 JavaScript语言开发的初学者和前端爱好者
 TypeScript语言学习爱好者
 React框架开发爱好者
 Web框架初学者
 Web服务器开发入门人员
 掌握前端开发基础的开发人员
 具有一定基础的全栈开发人员
 网站建设与网页设计的开发人员
 喜欢或从事网页设计工作并对前端开发感兴趣的人员
 各种IT培训学校的学生
 大中专院校的学生

第1篇 TypeScript快速开发
第1章 TypeScript语言基础 2
1.1 为什么要学TypeScript语言 2
1.1.1 什么是TypeScript语言 2
1.1.2 TypeScript语言的背景 3
1.1.3 学习TypeScript语言的必要性 3
1.2 JavaScript语言、ECMAScript标准规范与 TypeScript语言 3
1.2.1 JavaScript语言 4
1.2.2 ECMAScript标准规范 4
1.2.3 TypeScript语言的特性 5
1.2.4 TypeScript语言与JavaScript语言的区别 5
1.3 TypeScript编译器 6
1.3.1 TypeScript编译器的基础 6
1.3.2 TypeScript源码的编译流程 7
1.3.3 TypeScript编译器的架构 8
1.4 TypeScript语言的思维方式 10
1.4.1 JavaScript语言的不足之处 10
1.4.2 弱类型与强类型、静态语言与动态语言 11
1.4.3 TypeScript类型思维 12
1.5 开发实战：搭建TypeScript开发环境 12
1.5.1 获取TypeScript的方式 13
1.5.2 安装TypeScript开发环境 14
1.5.3 TypeScript应用 18
1.6 小结 23
第2章 TypeScript项目开发与配置 24
2.1 通过Babel编译工具编译TypeScript项目 24
2.1.1 Babel编译工具介绍 24
2.1.2 开发实战：通过Babel编译工具编译JavaScript代码 25
2.1.3 开发实战：通过Babel编译工具编译TypeScript代码 30
2.2 通过Rollup工具打包TypeScript项目 34
2.2.1 Rollup工具介绍 34
2.2.2 开发实战：通过Rollup工具打包JavaScript项目 35
2.2.3 开发实战：通过Rollup工具打包TypeScript项目 40
2.3 通过webpack工具构建TypeScript项目 44
2.3.1 webpack工具介绍 44
2.3.2 开发实战：通过webpack工具构建JavaScript项目 45
2.3.3 开发实战：通过webpack工具构建TypeScript项目 49
2.4 小结 51
第3章 TypeScript语言基础进阶 52
3.1 TypeScript语法基础 52
3.1.1 变量声明、变量作用域与变量提升 52
3.1.2 开发实战：TypeScript变量类型声明应用 53
3.1.3 开发实战：TypeScript变量作用域应用 55
3.1.4 开发实战：TypeScript变量提升应用 56
3.1.5 开发实战：TypeScript函数提升应用 57
3.1.6 let关键字与块级作用域 61
3.1.7 开发实战：let关键字与块级作用域 61
3.1.8 const关键字的常量声明 63
3.1.9 开发实战：const关键字的常量声明应用 63
3.1.10 开发实战：const关键字的常量作用域应用 64
3.1.11 开发实战：const关键字的常量对象应用 65
3.1.12 解构赋值 67
3.1.13 开发实战：TypeScript数组解构赋值应用 67
3.1.14 开发实战：TypeScript对象解构赋值应用 69
3.1.15 开发实战：TypeScript函数参数解构赋值应用 70
3.2 TypeScript基础类型 72
3.2.1 布尔类型、数字类型与字符串类型 72
3.2.2 开发实战：遍历字符串应用 72
3.2.3 数组与元组类型 74
3.2.4 开发实战：数组操作应用 74
3.2.5 开发实战：元组操作应用 75
3.2.6 枚举类型 77
3.2.7 开发实战：枚举类型应用 78
3.2.8 Any类型 80
3.2.9 开发实战：Any类型应用 80
3.2.10 Void、Null与Undefined类型 82
3.2.11 开发实战：Void、Null与Undefined类型应用 82
3.2.12 联合类型 84
3.2.13 开发实战：联合类型应用 84
3.3 TypeScript接口 85
3.3.1 接口类型与接口继承 85
3.3.2 开发实战：基于属性类型接口设计实现用户信息应用 87
3.3.3 开发实战：基于函数类型接口设计实现算术四则运算应用 90
3.3.4 开发实战：基于可索引类型接口设计实现字符串数组类型应用 91
3.3.5 开发实战：基于类类型接口设计实现日期时间应用 93
3.3.6 开发实战：基于单接口继承设计实现计算周长的应用 94
3.3.7 开发实战：基于多接口继承设计实现计算周长和面积的应用 96
3.3.8 开发实战：基于混合类型接口设计实现计数器应用 98
3.4 TypeScript类 100
3.4.1 类与类继承 100
3.4.2 公共、私有与保护修饰符 101
3.4.3 开发实战：设计实现存取器应用 101
3.5 TypeScript函数 103
3.5.1 函数基础 103
3.5.2 开发实战：函数类型应用 104
3.5.3 开发实战：函数参数应用 106
3.5.4 开发实战：匿名函数应用 107
3.5.5 开发实战：箭头函数与this关键字应用 108
3.6 TypeScript泛型 111
3.6.1 泛型基础 111
3.6.2 开发实战：泛型函数应用 111
3.6.3 开发实战：泛型变量应用 112
3.6.4 开发实战：泛型类型应用 115
3.6.5 开发实战：泛型接口应用 118
3.6.6 开发实战：泛型类应用 120
3.7 TypeScript枚举 121
3.7.1 开发实战：数字枚举应用 122
3.7.2 开发实战：字符串枚举应用 123
3.7.3 开发实战：常量和计算量的枚举应用 124
3.8 小结 126
第4章 TypeScript语法高级特性 127
4.1 TypeScript类型推论 127
4.2 TypeScript类型兼容性 128
4.2.1 类型兼容性介绍 128
4.2.2 开发实战：对象类型正向兼容性测试应用 129
4.2.3 开发实战：对象类型逆向兼容性测试应用 130
4.2.4 开发实战：接口类型兼容性测试应用 131
4.2.5 开发实战：类类型兼容性测试应用 132
4.3 TypeScript高级类型 133
4.3.1 高级类型基础 134
4.3.2 开发实战：交叉类型应用 135
4.3.3 开发实战：联合类型应用 137
4.3.4 开发实战：typeof关键字应用 142
4.3.5 开发实战：instanceof关键字应用 143
4.3.6 开发实战：可选参数应用 145
4.3.7 开发实战：可选属性应用 146
4.3.8 开发实战：类型别名应用 148
4.3.9 开发实战：字面量应用 151
4.3.10 开发实战：可辨识的联合类型应用 154
4.3.11 开发实战：索引类型应用 157
4.3.12 开发实战：映射类型应用 159
4.4 TypeScript迭代器与生成器 162
4.4.1 迭代器与生成器介绍 162
4.4.2 开发实战：迭代器应用 163
4.4.3 开发实战：生成器应用 168
4.5 TypeScript模块与命名空间 169
4.5.1 模块与命名空间介绍 170
4.5.2 开发实战：模块应用 170
4.5.3 开发实战：命名空间应用 175
4.5.4 TypeScript模块解析 179
4.6 TypeScript装饰器 180
4.6.1 装饰器介绍 180
4.6.2 开发实战：装饰器应用 181
4.6.3 开发实战：类装饰器应用 182
4.6.4 开发实战：类方法装饰器应用 183
4.6.5 开发实战：类属性装饰器应用 185
4.7 小结 187
第2篇 React快速开发
第5章 React框架发展过程 190
5.1 React框架介绍 190
5.2 React框架特点 191
5.3 React框架应用方式 191
5.4 编写React应用 192
5.5 搭建React开发环境 194
5.6 在React应用中使用TypeScript模板功能 197
5.7 小结 199
第6章 React框架基础进阶 200
6.1 React虚拟DOM 200
6.1.1 什么是虚拟DOM 200
6.1.2 开发实战：虚拟DOM应用 201
6.2 React JSX/TSX语法扩展与表达式 203
6.2.1 JSX/TSX语法扩展与表达式的介绍 203
6.2.2 开发实战：JSX/TSX语法扩展应用 203
6.2.3 开发实战：React表达式应用 205
6.3 React渲染机制 208
6.3.1 React渲染机制的介绍 208
6.3.2 开发实战：设计实现页面动态时钟应用 208
6.4 React组件设计与参数 210
6.4.1 React组件设计与参数的介绍 210
6.4.2 开发实战：基于React框架实现登录界面 211
6.4.3 开发实战：基于Props参数与UI交互方式设计用户信息界面 213
6.4.4 开发实战：基于TSX语法与Props参数设计用户信息界面 216
6.4.5 开发实战：基于Props默认参数设计用户信息界面 218
6.4.6 开发实战：React组件切分与提取应用 221
6.5 React状态与生命周期 227
6.5.1 状态与生命周期的介绍 227
6.5.2 开发实战：在React组件中引入状态 228
6.5.3 开发实战：基于组件状态与JSX语法实现页面动态时钟 230
6.5.4 开发实战：基于组件状态与TSX语法实现页面动态时钟 233
6.6 参数、状态与生命周期 235
6.6.1 参数、状态与生命周期的关系 235
6.6.2 开发实战：斐波那契数列应用 235
6.7 React事件处理 241
6.7.1 React事件处理的介绍 241
6.7.2 开发实战：基于单击事件弹出消息框 242
6.7.3 开发实战：实现状态切换按钮组件应用 244
6.7.4 开发实战：文本框事件处理应用 246
6.8 开发实战：React组件条件渲染 249
6.9 开发实战：React列表转化 255
6.10 React表单与受控组件 257
6.10.1 表单与受控组件的介绍 258
6.10.2 开发实战：React受控组件表单应用 258
6.11 开发实战：React状态提升 261
6.12 组合模式与特例关系 266
6.12.1 组合模式与特例关系的介绍 267
6.12.2 开发实战：基于组合模式设计实现UI组件 267
6.12.3 开发实战：基于特例关系设计实现UI组件 272
6.13 小结 274
第7章 React高级指引 275
7.1 React代码分割 275
7.1.1 什么是代码分割 275
7.1.2 开发实战：React传统加载方式应用 276
7.1.3 开发实战：React动态加载方式应用 277
7.2 React Context 278
7.2.1 Context介绍 278
7.2.2 开发实战：Context传递参数应用 278
7.2.3 开发实战：Context传递动态参数应用 283
7.2.4 开发实战：更新Context对象应用 288
7.2.5 开发实战：消费多个Context对象应用 293
7.3 错误边界 297
7.3.1 错误边界介绍 298
7.3.2 开发实战：错误边界应用 298
7.4 Ref属性与Ref转发 302
7.4.1 Ref属性基础 303
7.4.2 开发实战：Ref回调方式应用 303
7.4.3 开发实战：React.createRef()方式应用 305
7.4.4 开发实战：React.useRef()方式应用 310
7.4.5 Ref转发介绍 311
7.4.6 开发实战：Ref转发应用 311
7.5 开发实战：React高阶组件技巧 314
7.6 PropTypes静态类型检查 317
7.6.1 PropTypes静态类型检查介绍 317
7.6.2 开发实战：类型验证应用 318
7.6.3 开发实战：属性验证应用 320
7.6.4 开发实战：限制单一子代元素验证应用 323
7.7 小结 325
第8章 React Hook 326
8.1 React Hook基础 326
8.2 State Hook应用 327
8.2.1 开发实战：State Hook计数器应用 328
8.2.2 开发实战：State Hook动态更新用户信息应用 329
8.2.3 开发实战：State Hook页面动态时钟应用 331
8.3 Effect Hook应用 333
8.3.1 开发实战：Effect Hook计数器应用改进 333
8.3.2 开发实战：Effect Hook动态更新用户信息应用改进 335
8.3.3 开发实战：Effect Hook页面动态时钟应用改进 338
8.4 开发实战：Context Hook特性应用 340
8.5 React Hook使用规则 344
8.6 自定义Hook应用 345
8.6.1 自定义Hook基础介绍 345
8.6.2 开发实战：基于自定义Hook改进计数器应用 346
8.6.3 开发实战：基于自定义Hook实现页面动态时钟应用 348
8.7 小结 351
第3篇 TypeScript + React开发实战
第9章基于TypeScript + React Hook + antd构建Web计算器应用 354
9.1 Web计算器应用功能介绍 354
9.2 应用架构设计 356
9.3 主面板容器 359
9.4 计算显示面板容器 362
9.5 数据输入面板容器 364
9.6 一元运算符面板容器 374
9.7 二元运算符面板容器 398
9.8 等于运算符面板容器 406
9.9 数据修改面板容器 413
9.10 小结 420
第10章基于TypeScript + React + antd + Vite构建Web应用管理系统 421
10.1 Web应用管理系统功能介绍 421
10.2 应用架构设计 422
10.3 首页容器组件 423
10.4 顶部菜单栏容器组件 428
10.5 用户登录容器组件 439
10.6 左侧导航栏容器组件 445
10.7 路由功能容器组件 452
10.8 路由权限功能 458
10.9 首页容器组件 461
10.10 文档容器组件 472
10.11 表单容器组件 475
10.12 表格容器组件 477
10.13 侧边栏容器组件 480
10.14 选项卡组件 482
10.15 单选卡片容器组件 485
10.16 小结 487

全部展开

图书分类

高可靠系统构建指南：服务稳定性建设与技术债务治理

特色专题

帮助

TypeScript+React Web应用开发实战

目录

读者评论