
大家好,我是阿瓜。一个励志分享更多技术的前端瓜 ~
我们已经分享了 radash 库中数组、对象等相关的方法,大家感兴趣的可以前往主页查看阅读;
或许你最近在某个地方听过或者看过 radash 这个词,它是一个typescript编写的方法库,如果你想试试使用它,我们有简单使用示例,直接套用类似情景使用即可,如果你想深入了解一下这个库,想阅读一下它的源码,我们也会带你逐行解析代码;不管是哪种,相信你都能在文章里有所收获;
后续所有方法分享完毕后,我们会整理一份详细目录文章以及思维导图,方便大家查阅使用。
使用说明
Array.isArray() 方法功能一致。true, 否则返回 false。使用代码示例
import { isArray } from 'radash'
isArray('hello') // => false
isArray(['hello']) // => true
源码解析
相当于直接调用 Array.isArray
export const isArray = Array.isArray
Arrary.isArray 重新复制到 isArray,调用时直接写 isArray()使用说明
true, 否则返回 false。使用代码示例
import { isDate } from 'radash'
isDate(new Date()) // => true
isDate(12) // => false
isDate('hello') // => false
源码解析
// 定义一个名为 `isDate` 的函数。
export const isDate = (value: any): value is Date => {
// 使用 `Object.prototype.toString` 方法获取 `value` 的内部 `[[Class]]` 属性。
// 如果 `value` 是一个 `Date` 对象,`[[Class]]` 属性将是 "[object Date]"。
return Object.prototype.toString.call(value) === '[object Date]'
}
方法流程说明:
isDate 函数接受一个任意类型的参数 value。Object.prototype.toString.call(value) 来获取 value 的字符串表示,这是一种检查 JavaScript 值类型的可靠方法。'[object Date]'。value 是一个 Date 对象,函数返回 true。value 不是一个 Date 对象,函数返回 false。使用说明
true,否则返回false。使用代码示例
import { isDate } from 'radash'
isDate(new Date()) // => true
isDate(12) // => false
isDate('hello') // => false
源码解析
// 定义一个函数 `isEmpty`。
export const isEmpty = (value: any) => {
// 如果值为布尔类型,直接返回 true,因为这里假设布尔类型不携带 "内容"。
if (value === true || value === false) return true
// 如果值为 null 或 undefined,返回 true,因为它们代表没有值。
if (value === null || value === undefined) return true
// 如果值为数字,返回是否数字为 0。
// 这里假设 `isNumber` 是一个函数,用于检查值是否为数字类型。
if (isNumber(value)) return value === 0
// 如果值为日期对象,检查日期的时间是否为 NaN。
// 这里假设 `isDate` 是一个函数,用于检查值是否为 Date 对象。
if (isDate(value)) return isNaN(value.getTime())
// 如果值是函数,返回 false,因为函数被认为总是 "非空"。
// 这里假设 `isFunction` 是一个函数,用于检查值是否为函数类型。
if (isFunction(value)) return false
// 如果值是符号,返回 false,因为符号被认为总是 "非空"。
// 这里假设 `isSymbol` 是一个函数,用于检查值是否为 Symbol 类型。
if (isSymbol(value)) return false
// 检查值是否有 length 属性,如果有,检查它是否为 0。
const length = (value as any).length
if (isNumber(length)) return length === 0
// 检查值是否有 size 属性,如果有,检查它是否为 0。
const size = (value as any).size
if (isNumber(size)) return size === 0
// 如果值是对象,通过获取对象的键的数量来判断。
const keys = Object.keys(value).length
return keys === 0
}
方法流程说明:
isEmpty 函数接受一个任意类型的参数 value。value 是否为布尔类型、null 或 undefined,如果是,则返回 true。value 是否为数字或日期对象,并对这些类型进行特定的空值检查。value 是否为函数或符号,如果是,则返回 false。value 的 length 和 size 属性,并检查它们是否为 0。value 是一个对象,函数检查对象的键的数量是否为 0。value 是否为空。使用说明
x 和 y 是否相等。这个函数支持比较原始值、Date 对象、RegExp 对象以及普通对象。true,否则返回false。使用代码示例
import { isEqual } from 'radash'
isEqual(null, null) // => true
isEqual([], []) // => true
isEqual('hello', 'world') // => false
isEqual(22, 'abc') // => false
源码解析
// 定义一个泛型函数 `isEqual`。
export const isEqual = <TType>(x: TType, y: TType): boolean => {
// 首先使用 `Object.is` 检查两个值是否相同,这个方法可以正确处理 `NaN` 和 `-0`。
if (Object.is(x, y)) return true
// 如果两个值都是 `Date` 对象,比较它们的时间戳。
if (x instanceof Date && y instanceof Date) {
return x.getTime() === y.getTime()
}
// 如果两个值都是 `RegExp` 对象,比较它们的字符串表示。
if (x instanceof RegExp && y instanceof RegExp) {
return x.toString() === y.toString()
}
// 如果任何一个值不是对象或者是 `null`,返回 `false`。
if (
typeof x !== 'object' ||
x === null ||
typeof y !== 'object' ||
y === null
) {
return false
}
// 使用 `Reflect.ownKeys` 获取 `x` 和 `y` 的所有自有属性键。
const keysX = Reflect.ownKeys(x as unknown as object) as (keyof typeof x)[]
const keysY = Reflect.ownKeys(y as unknown as object)
// 如果 `x` 和 `y` 的键的数量不同,返回 `false`。
if (keysX.length !== keysY.length) return false
// 遍历 `x` 的键。
for (let i = 0; i < keysX.length; i++) {
// 检查 `y` 是否有相同的键。
if (!Reflect.has(y as unknown as object, keysX[i])) return false
// 递归地调用 `isEqual` 来比较 `x` 和 `y` 在当前键上的值。
if (!isEqual(x[keysX[i]], y[keysX[i]])) return false
}
// 如果所有检查都通过,返回 `true` 表示 `x` 和 `y` 相等。
return true
}
方法流程说明:
isEqual 函数接受两个类型为 TType 的参数 x 和 y。NaN 和 -0 的情况。Date 或 RegExp 对象,分别比较它们的时间戳或字符串表示。null,直接返回 false。x 的键,并检查 y 是否有相同的键。isEqual 函数来比较在每个键上的值。true 表示两个对象相等。使用说明
true;否则返回 false。这个函数依赖于一个未在代码中定义的 isNumber 函数,我们可以假设 isNumber 函数用于检查一个值是否为 number 类型。true,否则返回false。使用代码示例
import { isFloat } from 'radash'
isFloat(12.233) // => true
isFloat(12) // => false
isFloat('hello') // => false
源码解析
// 定义一个名为 `isFloat` 的函数。
export const isFloat = (value: any): value is number => {
// 首先使用 `isNumber` 函数检查 `value` 是否为数字类型。
// 然后检查 `value` 除以 1 的余数是否不等于 0,来确定它是否为浮点数。
return isNumber(value) && value % 1 !== 0
}
方法流程说明:
isFloat 函数接受一个任意类型的参数 value。isNumber 函数检查 value 是否为数字类型。value 除以 1 的余数,如果余数不等于 0,则说明 value 是一个浮点数。value 是一个浮点数,函数返回 true。false。使用说明
value 是否为函数。如果是函数,它返回 true;否则返回 false。true,否则返回false。使用代码示例
import { isFunction } from 'radash'
isFunction('hello') // => false
isFunction(['hello']) // => false
isFunction(() => 'hello') // => true
源码解析
// 定义一个名为 `isFunction` 的函数。
export const isFunction = (value: any): value is Function => {
// 检查 `value` 是否存在,并且 `value` 是否具有 `constructor`、`call` 和 `apply` 属性。
// 这些属性是函数对象特有的,所以这个检查用来判断 `value` 是否为函数。
return !!(value && value.constructor && value.call && value.apply)
}
方法流程说明:
isFunction 函数接受一个任意类型的参数 value。value 是否存在,并且是否具有 constructor、call 和 apply 属性。constructor 属性存在于所有对象上,并指向创建该对象的构造函数。对于函数对象,它通常指向 Function 构造函数。call 和 apply 方法是函数对象的内置方法,用于调用函数。value 是一个函数对象,函数返回 true。value 不是一个函数对象,函数返回 false。使用说明
value 是否为整数。如果是整数,它返回 true;否则返回 false。这个函数依赖于一个未在代码中定义的 isNumber 函数,我们可以假设 isNumber 函数用于检查一个值是否为 number 类型。true,否则返回false。使用代码示例
import { isInt } from 'radash'
isInt(12) // => true
isInt(12.233) // => false
isInt('hello') // => false
源码解析
// 定义一个名为 `isInt` 的函数。
export const isInt = (value: any): value is number => {
// 首先使用 `isNumber` 函数检查 `value` 是否为数字类型。
// 然后检查 `value` 除以 1 的余数是否等于 0,来确定它是否为整数。
return isNumber(value) && value % 1 === 0
}
方法流程说明:
isInt 函数接受一个任意类型的参数 value。isNumber 函数检查 value 是否为数字类型。value 除以 1 的余数,如果余数等于 0,则说明 value 是一个整数。value 是一个整数,函数返回 true。false。。使用说明
value 是否为数字类型。如果是数字类型,它返回 true;否则返回 false。这个函数使用了 Number 构造函数来尝试将 value 转换为数字,然后与原始值进行比较。true,否则返回false。使用代码示例
import { isNumber } from 'radash'
isNumber('hello') // => false
isNumber(['hello']) // => false
isNumber(12) // => true
源码解析
// 定义一个名为 `isNumber` 的函数。
export const isNumber = (value: any): value is number => {
try {
// 尝试使用 `Number` 构造函数将 `value` 转换为数字。
// 如果转换后的值与原始值 `value` 相等,返回 `true`。
return Number(value) === value
} catch {
// 如果在尝试转换过程中发生错误,返回 `false`。
return false
}
}
方法流程说明:
isNumber 函数接受一个任意类型的参数 value。Number 构造函数将 value 转换为数字。value 相等(且没有类型转换),则说明 value 本身就是一个数字,函数返回 true。value 是一个对象或某个无法转换为数字的值),捕获错误并返回 false。使用说明
value 是否为普通对象(即直接由 Object 构造函数创建的对象)。如果是普通对象,它返回 true;否则返回 false。true,否则返回false。使用代码示例
import { isObject } from 'radash'
isObject('hello') // => false
isObject(['hello']) // => false
isObject(null) // => false
isObject({ say: 'hello' }) // => true
源码解析
// 定义一个名为 `isObject` 的函数。
export const isObject = (value: any): value is object => {
// 首先检查 `value` 是否为真值,以排除 `null` 和未定义的值。
// 然后检查 `value.constructor` 是否等于 `Object` 构造函数,
// 这是因为普通对象的构造函数应该是 `Object`。
return !!value && value.constructor === Object
}
方法流程说明:
isObject 函数接受一个任意类型的参数 value。value 是否为真值,以确保它不是 null 或 undefined(这些值会导致 value.constructor 访问抛出错误)。value 的 constructor 属性是否等于全局 Object 构造函数。这个检查用来确认 value 是否是由 Object 构造函数创建的普通对象。value 是一个普通对象,函数返回 true。false。使用说明
value 是否是原始值。原始值是指那些不是对象也不是函数的数据类型,包括 undefined、null、boolean、number、string 和 symbol。如果 value 是原始值,函数返回 true;否则返回 false。true,否则返回false。使用代码示例
import { isPrimitive } from 'radash'
isPrimitive(22) // => true
isPrimitive('hello') // => true
isPrimitive(['hello']) // => false
源码解析
// 定义一个名为 `isPrimitive` 的函数。
export const isPrimitive = (value: any): boolean => {
// 检查 `value` 是否为 `undefined` 或 `null`,这两个值是原始值。
// 或者检查 `value` 的类型是否不是 'object' 和 'function',这两个类型表示复合类型。
return (
value === undefined ||
value === null ||
(typeof value !== 'object' && typeof value !== 'function')
)
}
方法流程说明:
isPrimitive 函数接受一个任意类型的参数 value。value 是否等于 undefined 或 null,这两个值是标准的原始值。typeof 操作符检查 value 是否不是对象('object')或函数('function')类型。value 是原始值类型之一,函数返回 true。value 是对象或函数类型,函数返回 false。Promise使用说明
value 是否是一个 Promise 对象。如果是 Promise 对象,它返回 true;否则返回 false。这个函数在检查时会考虑 value 是否存在、是否具有 then 属性,以及 then 属性是否是一个函数。Promise返回true,否则返回false。使用代码示例
import { isPromise } from 'radash'
isPromise('hello') // => false
isPromise(['hello']) // => false
isPromise(new Promise(res => res())) // => true
源码解析
// 定义一个名为 `isPromise` 的函数。
export const isPromise = (value: any): value is Promise<any> => {
// 首先检查 `value` 是否存在,如果不存在(比如是 `null` 或 `undefined`),返回 `false`。
if (!value) return false
// 检查 `value` 是否具有 `then` 属性,如果没有,返回 `false`。
// `then` 属性是 `Promise` 对象特有的。
if (!value.then) return false
// 使用 `isFunction` 函数检查 `value.then` 是否是一个函数,如果不是,返回 `false`。
if (!isFunction(value.then)) return false
// 如果通过了所有检查,返回 `true` 表示 `value` 是一个 `Promise` 对象。
return true
}
方法流程说明:
isPromise 函数接受一个任意类型的参数 value。value 是否存在,因为 null 和 undefined 显然不是 Promise 对象。value 是否具有 then 属性,因为所有的 Promise 对象都有一个 then 方法用于注册回调。isFunction 函数检查 value.then 是否是一个函数,以确保它符合 Promise 的特性。value 满足所有条件,函数返回 true。value 不满足任何一个条件,函数返回 false。使用说明
value 是否为字符串。如果是字符串,它返回 true;否则返回 false。函数检查 value 的类型是否为 'string',这包括了字符串字面量和字符串对象(通过 String 构造函数创建的字符串实例)。true,否则返回false。使用代码示例
import { isString } from 'radash'
isString('hello') // => true
isString(['hello']) // => false
源码解析
// 定义一个名为 `isString` 的函数。
export const isString = (value: any): value is string => {
// 检查 `value` 的类型是否为 'string',这包括了字符串字面量。
// 使用 `instanceof String` 检查 `value` 是否为字符串对象,
// 即通过 `new String(...)` 创建的对象。
return typeof value === 'string' || value instanceof String
}
方法流程说明:
isString 函数接受一个任意类型的参数 value。typeof 操作符检查 value 是否为 'string' 类型,这会匹配所有的字符串字面量。instanceof String 检查 value 是否为 String 对象,这会匹配通过 new String(...) 创建的字符串实例。value 是字符串字面量或字符串对象,函数返回 true。value 不是字符串字面量或字符串对象,函数返回 false。Symbol类型使用说明
value 是否为 symbol 类型。如果是 symbol 类型,它返回 true;否则返回 false。Symbol类型返回true,否则返回false。使用代码示例
import { isSymbol } from 'radash'
isSymbol('hello') // => false
isSymbol(Symbol('hello')) // => true
源码解析
// 定义一个名为 `isSymbol` 的函数。
export const isSymbol = (value: any): value is symbol => {
// 首先检查 `value` 是否为真值(即不是 `null` 或 `undefined`)。
// 然后检查 `value.constructor` 是否等于全局 `Symbol` 函数,
// 这是因为 `symbol` 类型的值的构造函数应该是 `Symbol`。
return !!value && value.constructor === Symbol
}
方法流程说明:
isSymbol 函数接受一个任意类型的参数 value。value 是否为真值,以确保它不是 null 或 undefined(这些值会导致 value.constructor 访问抛出错误)。value 的 constructor 属性是否等于全局 Symbol 函数。这个检查用来确认 value 是否是一个由 Symbol 函数创建的 symbol 类型的值。value 是一个 symbol 类型的值,函数返回 true。false。我相信能看到最后的都是帅气多金又想进步的~~~~人才。
如果你想查看其他 radash 相关方法,前往主页查看
目前radash库得所有方法已经更新完毕,下期阿瓜会整理一份radash完整方法目录上传,包括思维导图和使用目录。
大家有任何问题或见解,欢迎评论区留言交流和批评指正!!!
你的每一个收藏都是作者写作的动力!!!
目前为止,radash库的所有方法我们已经分享完毕。如果你想尝试使用,又或者想了解下源码,阿瓜的文章都值得一读,相信你总能有所收获。后续我们回整理一份使用说明进行发布。
或许你最近在某个地方听过或者看过 `radash` 这个词,它是一个typescript编写的方法库,无论你是想简单使用还是深入了解他的源码,本系列文章都值得一读。