Day 19 Libraries & TypeScript

前面中场休息的 Project 今天暂且休一天,来介绍一下可以在 JavaScript 跟 TypeScript 使用以及只有 TypeScript 能够使用的 Library 吧!

第一个要介绍的是 Lodash,在原生的 JavaScript 是一个很好用的处理资料的 library,如果照着官网上面的操作安装并且 import 的话,会跳出无法辨识 lodash 这个 module 的错误,因为 TypeScript 不认识这个用 JavaScript 写的 library,那要怎麽用在 TypeScript 上呢?

感谢有各路大神们写好的 type's package,帮一些用 JavaScript 写的第三方 library 翻译成 TypeScript 的样子,让我们能够很容易的使用这些工具,有兴趣的话也能到 github 上面看看哦!

像是 Lodash 的话就能够下载这个套件:https://www.npmjs.com/package/@types/lodash
安装之後它就会自动帮我们把 Ladash 翻译成 TypeScript 了!如果想在 TypeScript 专案用其他比较多人在使用却是用 JavaScript 写的 library,像是 jquery,那就可以用 @types/jquery 搜寻看看。

第二个要介绍的是 class-transformer,使用情境是有时我们会从後端拿到前端要渲染的资料,但是通常都是 JSON 物件,然後我们再把它转成 JavaScript 的物件,但这时候这些资料可能没办法跟我们前端的程序码比如说 class 里面的 method 做连接,必须要透过多写一些程序码来把 JSON 资料放到 class 创造的实例才能使用 class 里面的方法,比如说用 forEach 把每一笔资料都做一个实例,但这样其实除了要多写程序码之外,也浪费了许多效能。

这时候透过 class-transformer 就可以很轻易的把我们想转换的物件转换成我们要的样子,依照指示从 npm 下载之後再 import plainToClass 方法就可以把 JavaScript 物件转换成 Class 了!另外这个套件也可以用在原生的 JavaScript 上面哦~

最後一个是 class-validate,这个写了很多个帮忙验证的装饰器!!!天阿超级方便,也是只要简单的 npm 下载就可以直接使用了,里面提供了许多常用的验证方法,比如说验证 email、length、max、min、date、是不是空格......等等。另外不免俗的还是要再次提醒,记得把 "experimentalDecorators": true 打开哦!这个 library 就是专门给 TypeScript 使用的啦!

这几天工作有点稍微力不从心,给自己信心小喊话一下,希望明天还能继续 catch up 这个系列呜呜,今天的学习笔记就到这边,谢谢阅读。:)


<<:  第 19 集:Bootstrap 客制化 Sass 必备知识(下)

>>:  Day19:SwiftUI—Button

[实例研究] car

在Raspberry pi 的网站上面 有Raspberry Pi 宠物小车学习套件 以及Ducki...

Leetcode: 630. Course Schedule III | 含C++笔记

思路: 我一开始看到这题,感觉他像可以用Greedy解法解的问题,然後又想他是III,所以他也可以用...

30天轻松学会unity自制游戏-了解动画系统

这篇来让Player加上左右转的动画,先在window视窗上开启Animation->Anim...

Progressive Web App 闲置中: Idle Detection API 空闲检测入门实做 (20)

什麽是 Idle Detection API Idle Detection API 的设计是当 Ap...

半导体布局设计工程师能力监定上课

请问各位大大,小的想去考111年的半导体布局设计工程师能力监定,请问哪里可以有实体或线上课程呢,上完...