经验首页 前端设计 程序设计 Java相关 移动开发 数据库/运维 软件/图像 大数据/云计算 其他经验
当前位置:技术经验 » JS/JS库/框架 » JavaScript » 查看文章
TypeScript使用总结
来源:cnblogs  作者:zengzuo613  时间:2021/12/24 9:02:47  对本文有异议

以下将TypeScript简称ts

1. 为什么要学

1). 减少bug,提高质量

强类型、强语言【枚举、接口、泛型...】,代码更健壮,语法等异常,编译阶段能“提前”报错

2). 面向对象

支持面向对象,软件设计与工程化更为成熟,更容易做单元测试、持续集成等

3). 提高效率

  • 语言简单易学,尤其是有C#、java基础的后端同学
  • 相比js,代码简洁易读,大型项目实现相同的功能代码量更少
  • ide支持更为友好,如:智能提示、变量强关联、重构等
  • 绝大部分常用类库已经支持智能提示

4). 业内趋势

2. 练级攻略

3.适用场景

  • 适合:1)框架、类库组件开发;2)业务开发。尤其适合框架、类库组件开发,建议先将类库组件ts,逐步向业务开发推广

4. 推荐ide

新手 webstorm > vscode,老手反之

  • webstorm特点
    • 优点:开箱即用(无需安装插件)、易于重构【个人觉得非常重要】
    • 缺点:收费、没idea成熟
    • 长期:还是要被VSC碾压的

5. 推荐书籍

6. tsconfig.json配置demo

  1. {
  2. "compilerOptions": {
  3. "pretty": true,
  4. "module": "commonjs",
  5. "importHelpers": true,
  6. "target": "es5",
  7. "lib": [
  8. "es2015",
  9. "es2016",
  10. "es2017",
  11. "es2018",
  12. "es2019",
  13. "dom",
  14. "ES2015.Promise"
  15. ],
  16. "allowJs": true,
  17. "sourceMap": false,
  18. "baseUrl": "./src",
  19. "outDir": "./build/src/",
  20. "paths": {
  21. "@/*": [
  22. "*"
  23. ],
  24. "tslib": [
  25. "path/to/node_modules/tslib/tslib.d.ts"
  26. ]
  27. },
  28. //编译异常时候,禁止发行
  29. "noEmitOnError": true,
  30. //禁止隐性any
  31. "noImplicitAny": true,
  32. //严格的null检查,避免如可选参数,未判断undefined引发的问题等
  33. "strictNullChecks": true,
  34. //未使用的变量,抛出错误
  35. "noUnusedLocals": true,
  36. //未使用的参数,抛出错误
  37. "noUnusedParameters": true,
  38. //检查函数是否有返回值
  39. "noImplicitReturns": true,
  40. //启用严格模式,对类型赋值、类型转换更严格
  41. "strict": true,
  42. //https://mariusschulz.com/blog/downlevel-iteration-for-es3-es5-in-typescript
  43. "downlevelIteration": true
  44. },
  45. "typeRoots": [
  46. "node_modules/@types",
  47. "typings"
  48. ],
  49. "include": [
  50. "src/**/*.ts"
  51. ],
  52. "exclude": [
  53. "node_modules",
  54. "test"
  55. ]
  56. }

7. 看法

ts将会是web前端开发首选语言

ts是js的超集,不是替代物

  • 写好ts,还得先学好js
  • 再学习ts语法及面向对象设计
  • 关注ts编译原理及编译结果

不得已存在的any类型

  • 产生问题:any类型,不支持强类型、智能提示等,相当于把ts回退到js
  • 问题原因:1)兼容,老代码及外部依赖如WEBAPI返回的参数类型,在不同浏览器或不同版本的相同浏览器都不一样,只能定义为any类型;2)类库不健全,lid.d.ts不全面,导致部分属性、方法的类型描述不完整,得再类型定义后添加" | any" 组合类型才能满足需求,不得不用any类型
  • 改进办法:有明确的复合类型,可以通过组合类型来定义类型,如: age: int | any,比纯any,IDE能添加int类型相关的智能提示和语法报错

复合类型没必要

  • 交叉类型、索引类型、映射对象类型,意义不大,适用场景少,易滥用,明显降低代码可读性
  • js的问题是语言太随意,导致很多程序员把大量的时间浪费在语法学习上

面向对象不彻底

  • 不支持重载
  • 方法默认是public修饰符

面向对象的边界

  • 服务端开发,如使用nestjs等框架,建议所有代码都面向对象,甚至可以借鉴java spring,使用面向接口编程,解决依赖倒置的需求
  • 客户端开发,部分场景下,过度使用面向对象,可能会导致包体积变大,需要留意

8. 业内实践

原文链接:http://www.cnblogs.com/zengzuo613/p/15638037.html

 友情链接:直通硅谷  点职佳  北美留学生论坛

本站QQ群:前端 618073944 | Java 606181507 | Python 626812652 | C/C++ 612253063 | 微信 634508462 | 苹果 692586424 | C#/.net 182808419 | PHP 305140648 | 运维 608723728

W3xue 的所有内容仅供测试,对任何法律问题及风险不承担任何责任。通过使用本站内容随之而来的风险与本站无关。
关于我们  |  意见建议  |  捐助我们  |  报错有奖  |  广告合作、友情链接(目前9元/月)请联系QQ:27243702 沸活量
皖ICP备17017327号-2 皖公网安备34020702000426号