JavaScript中类型检测
文章首发: http://www.cnblogs.com/sprying/p/4349426.html
本文罗列了一般Js类型检测的方法,是构建Js知识体系的一小块,这篇文章是我很早之前总结的。
一、Js中有5种基本数据类型
Undefined 、Null、Boolean、String、Number(包含NaN)
NaN和任何类型的值都不相等,包括NaN;isNaN用来判断数值是不是NaN类型
二、类型判断
1. isFinite(number)
是不是无穷大。如果是NaN,或者正负无穷大,或者非数字类型,则返回false。
2. typeof运算符
使用的时候,空格或者typeof(param)
返回的值
string
number
boolean
undefined
function
object null也返回object
根据以上,判断类型可以如下:
1 2 3 4 5 6 | var obtainType = function (o){ var t; if (o === null ) return “ null ”; else if (o !== o) return “NaN”; else if ( (t = typeof o) !== ‘object’) return t; } |
可以识别出null、NaN string number boolean undefined function。
上面最后只剩下object,比如数组的识别,自定义类型的识别
3. 数组等原生类型的识别,可以采用如下
1 2 3 4 5 6 7 8 9 10 | function obtainType(type) { return function (obj) { return Object.prototype.toString.call(obj) === "[object " + type + "]" } } var isObject = isType( "Object" ) var isString = isType( "String" ) var isArray = Array.isArray || isType( "Array" ) var isFunction = isType( "Function" ) |
4. 自定义类型判断
1 2 3 4 5 6 7 | /** * 返回函数的名字,可能为空串;不是函数,返回null */ Function.prototype.getName = function () { if ( "name" in this ) return this .name; return this .name = this .toString().match(/ function \s*([^(]*)\(/)[1]; }; |
原生类型和自定义类型的object都可以判断了,于是
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 | /** * 返回:null NaN undefined string number boolean * function Array String Object(包括一些自定义类型) 自定义类型 */ var obtainType = function (o){ /** * 获取参数类型 * 对象直接量、Object.create、自定义构造函数的类属性皆为Object; * 识别出原生类型 (内置构造函数和宿主对象) */ function classOf(obj){ return Object.prototype.toString.call(obj).slice(8, -1); } /** * 返回函数的名字,可能为空串;不是函数,返回null */ Function.prototype.getName = function () { if ( "name" in this ) return this .name; return this .name = this .toString().match(/ function \s*([^(]*)\(/)[1]; }; var t, c, n; // 处理null值特殊情形 if (o === null ) return "null" ; // NaN:和自身值不相等 if (o !== o) return "NaN" ; // 识别出原生值类型和函数、undefined if ((t = typeof o) !== "object" ) return t; // 识别出原生类型 if ((c = classOf(o)) !== "Object" ) return c; // 返回自定义类型构造函数名字 if (o.constructor && typeof o.constructor === "function" && (n = o.constructor.getName())) return n; return "Object" ; }; |
5.
1 2 3 4 5 | var strObj = new String( 'abc' ); typeof strObj // "object" obtainType(strObj) // "String" |
三、 其它
1. Dom元素判断
if(dom.nodeType){...Dom...}
if(dom.createElement)
2. jQuery等类型判断
$('#aa') instanceof jQuery//不支持跨多窗口和框架子页面
3. if(a) a为null undefined 0 "" NaN时自动转换成false
一般推荐的写法
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 | // bad if (name !== '' ) { // ...stuff... } // good if (name) { // ...stuff... } // bad if (collection.length > 0) { // ...stuff... } // good if (collection.length) { // ...stuff... } |
有任何问题,欢迎留言交流。
注意:已解决的问题,会在整理后删除掉。
*******站在巨人的肩膀上
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· 震惊!C++程序真的从main开始吗?99%的程序员都答错了
· 单元测试从入门到精通
· 【硬核科普】Trae如何「偷看」你的代码?零基础破解AI编程运行原理
· 上周热点回顾(3.3-3.9)
· winform 绘制太阳,地球,月球 运作规律