本人已参与「新人创作礼」活动,一起开启掘金创作之路。
常规的判断方法
在项目的很多地方都需要去判断数据类型。你还在使用像这样的判断吗👇
if (typeof params === 'number'){
....
}
这样的写法在功能上是没有问题的。
但是他还有优化的空间。
他的不足有
- 当我们需要判断某一个类型的时候要现场去想判断方式,比如判断一个变量是否是数组类型的时候,一些不熟悉的小伙伴可能还需要花一点时间去想。
- 使用 typeof params === "type" 这种写法,不美观。多个类型判断在一起的时候会比较长,不好看。 举个例子
if(typeof params1 === "undefined" && typeof params2 === "null" && typeof params3 === "number" ){
.....
}
和使用工具判断函数
if(isUndefined(params1) & isNumber(params2) && isNull(params3)){
.....
}
工具函数相对的要直观那么一点点。
现在工程化的项目中,注重项目规范的公司在总会utils文件下加一个is.js文件,用于存储判断函数。
以下附上工具函数。大家可以直接复制走,文件最好命名为is.js
/*
判断文件 is.js
*/
const toString = Object.prototype.toString;
export const is = (val, type): boolean => toString.call(val) === `[Object ${type}]`;
//判断非undefined
export const isDef = (val): boolean => typeof val !== 'undefined';
//判断是undefined
export const isUnDef = (val): boolean => !isDef(val);
//判断是否是对象
export const isObject = (val): boolean => val !== null && toString.call(val) === `[object Object]`;
export const isEmpty = (val):boolean => {
if (isArray(val) || isString(val)) return val.length === 0;
if (val instanceof Map || val instanceof Set) return val.size === 0;
if (isObject(val)) return Object.keys(val).length === 0;
return;
}
//判断是否是时间类型
export const isDate = (val): boolean => is(val, "Date");
//判断是否是null类型
export const isNull = (val): boolean => val === null;
//判断不可访问类型
export const isNullAndUnDef = (val): boolean => isUnDef(val) && isNull(val);
//判断undefined和null其中一个
export const isNullOrUnDef = (val): boolean => isUnDef(val) || isNull(val);
//判断是否是数字类型
export const isNumber = (val): boolean => is(val, "Number");
//判断是否是Promise类型
export const isPromise = (val): boolean => {
return (
is(val, "promise") &&
isObject(val) &&
isFunction(val.then) &&
isFunction(val.catch)
)
}
//判断是否是字符类型
export const isString = (val): boolean => is(val, "string");
//判断是否为函数
export const isFunction = (val): boolean => typeof val === "function";
//判断是否为booean类型
export const isBoolean = (val): boolean => is(val, "boolean");
//判断是否是正则表达式
export const isRegExp = (val): boolean => is(val, "RegExp");
//判断是否是数组
export const isArray = (val): boolean => val && Array.isArray(val);
//判断是否是window对象
export const isWindow = (val): boolean => typeof window !== "undefined" && is(val, "window");
使用方式
import {isNumber,isUnDef} from "@/utils/is.js"
const num = 1;
const str = "昨晚所有的基金都是绿的,只有我的眼睛是红的";
if(isNumber(num) && isString(str)){
...
}
欢迎技术沟通,摸鱼聊天~
备注来自掘金~
wx:XXF1096032096