TypeScript 中的类型检查实用函数

怼烎@ 2023-10-15 13:32 119阅读 0赞

TypeScript 中的类型检查实用函数

文章目录

  • TypeScript 中的类型检查实用函数
  • 一、概述
  • 二、代码实现

一、概述

在前端开发中,我们经常需要判断变量的类型以进行相应的操作或处理。TypeScript 提供了基础的类型检查,但有时我们需要更复杂或更灵活的类型检查。这篇博客文章将介绍一组实用函数,用于各种常见的类型检查。

二、代码实现

  1. // 禁用一些 ESLint 规则,主要是因为下面使用了 Object.prototype 的方法
  2. // eslint-disable-next-line @typescript-eslint/unbound-method
  3. const {
  4. toString } = Object.prototype
  5. // 判断一个值是否为指定类型
  6. export function is(val: unknown, type: string) {
  7. return toString.call(val) === `[object ${
  8. type}]`
  9. }
  10. // 判断一个值是否已定义
  11. export function isDef<T = unknown>(val?: T): val is T {
  12. return typeof val !== 'undefined'
  13. }
  14. // 判断一个值是否未定义
  15. export function isUnDef<T = unknown>(val?: T): val is T {
  16. return !isDef(val)
  17. }
  18. // 判断一个值是否是对象
  19. export function isObject(val: any): val is Record<any, any> {
  20. return val !== null && is(val, 'Object')
  21. }
  22. // 判断一个值是否为空
  23. export function isEmpty<T = unknown>(val: T): val is T {
  24. if (isArray(val) || isString(val)) return val.length === 0
  25. if (val instanceof Map || val instanceof Set) return val.size === 0
  26. if (isObject(val)) return Object.keys(val).length === 0
  27. return false
  28. }
  29. // 判断一个值是否是日期对象
  30. export function isDate(val: unknown): val is Date {
  31. return is(val, 'Date')
  32. }
  33. // 判断一个值是否是 null
  34. export function isNull(val: unknown): val is null {
  35. return val === null
  36. }
  37. // 判断一个值是否是 null 或 undefined
  38. export function isNullOrUnDef(val: unknown): val is null | undefined {
  39. return isUnDef(val) || isNull(val)
  40. }
  41. // 判断一个值是否是数字
  42. export function isNumber(val: unknown): val is number {
  43. return is(val, 'Number')
  44. }
  45. // 判断一个值是否是 Promise
  46. export function isPromise<T = any>(val: unknown): val is Promise<T> {
  47. return is(val, 'Promise') && isObject(val) && isFunction(val.then) && isFunction(val.catch)
  48. }
  49. // 判断一个值是否是字符串
  50. export function isString(val: unknown): val is string {
  51. return is(val, 'String')
  52. }
  53. // 判断一个值是否是函数
  54. export function isFunction(val: unknown): val is Function {
  55. return typeof val === 'function'
  56. }
  57. // 判断一个值是否是布尔值
  58. export function isBoolean(val: unknown): val is boolean {
  59. return is(val, 'Boolean')
  60. }
  61. // 判断一个值是否是正则表达式
  62. export function isRegExp(val: unknown): val is RegExp {
  63. return is(val, 'RegExp')
  64. }
  65. // 判断一个值是否是数组
  66. export function isArray(val: any): val is Array<any> {
  67. return !!val && Array.isArray(val)
  68. }
  69. // 判断一个值是否是 Window 对象
  70. export function isWindow(val: any): val is Window {
  71. return typeof window !== 'undefined' && is(val, 'Window')
  72. }
  73. // 判断一个值是否是 DOM 元素
  74. export function isElement(val: unknown): val is Element {
  75. return isObject(val) && !!val.tagName
  76. }
  77. // 判断一个值是否是 Map 对象
  78. export function isMap(val: unknown): val is Map<any, any> {
  79. return is(val, 'Map')
  80. }
  81. // 判断当前环境是否是服务器
  82. export const isServer = typeof window === 'undefined'
  83. // 判断当前环境是否是客户端
  84. export const isClient = !isServer
  85. // 判断一个字符串是否是有效的 URL
  86. export function isUrl(path: string): boolean {
  87. const reg = /^((https|http|ftp|rtsp|mms):\/\/)(([0-9a-zA-Z_!~*'().&=+$%-]+: )?[0-9a-zA-Z_!~*'().&=+$%-]+@)?(([0-9]{1,3}.){3}[0-9]{1,3}|([0-9a-zA-Z_!~*'()-]+.)*([0-9a-zA-Z][0-9a-zA-Z-]{0,61})?[0-9a-zA-Z].[a-zA-Z]{2,6})(:[0-9]{1,4})?((\/?)|(\/[0-9a-zA-Z_!~*'().;?:@&=+$,%#-]+)+\/?)$/
  88. return reg.test(path)
  89. }

发表评论

表情:
评论列表 (有 0 条评论,119人围观)

还没有评论,来说两句吧...

相关阅读