img

js类型判断其实还可以更优雅!!!该提升一下逼格了

2023-03-30 0条评论 663次阅读 JavaScript


在我们写js代码需要判断对象类型时是不是还是Object.prototype.toString.call(),然而写这么一长串只是为了一个对象类型,那显然对与我这种强迫症来说是不允许存在的,当然是要精简··精简···再精简。

在之前我需要判断的时候都是在项目如果使用超过两次,就是临时在公共区域封装一个方法进行融合性判断,其实就是根据输出对象类型再用===进行判断

function objectType(value) {
 return Object.prototype.toString.call(value)
}

objectType('demo') === '[Object String]'

相信肯定有人肯定也是和我一样这样的吧

写到这儿肯定有人要反驳,还是太繁琐,,,那索性再优化简单一点, 由于返回的格式前半部分还算统一,所以我们截取,进一步优化

function objectType(value) {
 return Object.prototype.toString.call(value).slice(8,-1)
}

objectType('demo') === 'String'

这个对于临时使用已经够简化了吧,,,我是能想到的就到这儿了,如果你有其他高见,请在评论区谈谈高见。

经过一系列的假设,进入今天的终极话题,如何更高逼格的进行判断;那就是现在比较流行的,也是大家张口就来的····封装

这是偶然一次机会,接触了某大厂一个位大佬的代码,想写一篇文章记录一下,

首先是他们是封装了一个is.ts 文件。这个文件封装好了所有类型判断。可以为开发工作增加很多便利。所以我就自己写了一个。给大家分享一下。


/**
 * 判断文件
 * 
 * 如果你需要类型判断,请不要再使用 Object.prototype.toString.call()方法
 * 直接调用我们下方封装好的is函数即可
 * 我想,以下函数,已经可以满足所有情况下的类型判断
 */

export const toString = Object.prototype.toString;

export const is = (val, type) => toString.call(val) === `[object ${type}]`;

//判断非undefined
export const isDef = (val) => typeof val !== 'undefined';

//判断是undefined
export const isUnDef = (val) => !isDef(val);

//判断是否是对象
export const isObject = (val) => val !== null && toString.call(val) === `[object Object]`;

export const isEmpty = (val) => {
    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) => is(val, "Date");

//判断是否是null类型
export const isNull = (val) => val === null;

//判断不可访问类型
export const isNullAndUnDef = (val) => isUnDef(val) && isNull(val);

//判断undefined和null其中一个
export const isNullOrUnDef = (val) => isUnDef(val) || isNull(val);

//判断是否是数字类型
export const isNumber = (val) => is(val, "Number");

//判断是否是Promise类型
export const isPromise = (val) => {
    return (
        is(val, "Promise")
    )
}

//判断是否是字符类型
export const isString = (val) => is(val, "String");

//判断是否为函数
export const isFunction = (val) => typeof val === "function";

//判断是否为booean类型
export const isBoolean = (val) => is(val, "Boolean");

//判断是否是正则表达式
export const isRegExp = (val) => is(val, "RegExp");

//判断是否是数组
export const isArray = (val) => val && Array.isArray(val);

//判断是否是window对象
export const isWindow = (val) => typeof window !== "undefined" && is(val, "Window");

在utils文件夹下面建立一个is.js/is.ts,然后把以上内容直接复制进去即可。

引入这个后我们在上面的案例中引用

if(isString('demo')) {

}

秒变瘦身,完结。

本文转自 https://juejin.cn/post/7215114042494861372,如有侵权,请联系删除。

🏷️ #判断类型

💬 COMMENT


🦄 支持markdown语法

👋友