JavaScript知识点总结(六)之JavaScript判断变量数据类型


Posted in Javascript onMay 31, 2016

最近做了一个项目,其中有关于js判断数据类型的处理,在网上搜了相关资料,并且亲自测试了各种数据类型的判断,绝对安全。下面小编把具体内容总结分享给大家,大家参考下!

一、JS中的数据类型

1.数值型(Number):包括整数、浮点数。

2.布尔型(Boolean)

3.字符串型(String)

4.对象(Object)

5.数组(Array)

6.空值(Null)

7.未定义(Undefined)

二、判断一个变量的数据类型

1.数值型(number)

比较常用的判断方法是:

function isNumber(val){
return typeof val === 'number';
}

但有些情况就不行,比如:

var a;
alert(isNumber(parseInt(a)));

这里弹出来的是true,如下图所示:

JavaScript知识点总结(六)之JavaScript判断变量数据类型

但实际上变量a是NaN,它是不能用于数值运算的。

所以上面的函数可以修改为:

function isNumber(val){
return typeof val === 'number' && isFinite(val);
}

修改了之后,弹出来的就是false,如下图所示:

JavaScript知识点总结(六)之JavaScript判断变量数据类型

顺便介绍一下JavaScript isFinite() 函数,isFinite() 函数用于检查其参数是否是无穷大,如果 number 是有限数字(或可转换为有限数字),那么返回 true。否则,如果 number 是 NaN(非数字),或者是正、负无穷大的数,则返回 false。

2.布尔型(boolean)

布尔类型的判断比较简单,可以用如下的方法进行判断:

/*
判断变量val是不是布尔类型
*/
function isBooleanType(val) {
return typeof val ==="boolean";
}

测试代码:

<script type="text/javascript">
/*
判断变量val是不是布尔类型
*/
function isBooleanType(val) {
return typeof val ==="boolean";
}
var a;
var b = false;
alert("变量a是布尔类型的判断结果是:"+isBooleanType(a));
alert("变量b是布尔类型的判断结果是:"+isBooleanType(b));
</script>

运行结果:

JavaScript知识点总结(六)之JavaScript判断变量数据类型

3. 字符串(String)

字符串类型的判断比较简单,可以用如下的方法进行判断:

/*
判断变量是不是字符串类型
*/
function isStringType(val) {
return typeof val === "string";
}

测试代码:

<script type="text/javascript">
/*
判断变量是不是字符串类型
*/
function isStringType(val) {
return typeof val === "string";
}
var a;
var s = "strType";
alert("变量a是字符串类型的判断结果是:"+isStringType(a));
alert("变量s是字符串类型的判断结果是:"+isStringType(s));
</script>

运行结果:

JavaScript知识点总结(六)之JavaScript判断变量数据类型

4.未定义(Undefined)

未定义的判断比较简单,可以用如下的方法进行判断:

/*
判断变量是不是Undefined
*/
function isUndefined(val) {
return typeof val === "undefined";
}

测试代码:

<script type="text/javascript">
var a;//a是undefined
var s = "strType";
/*
判断变量是不是Undefined
*/
function isUndefined(val) {
return typeof val === "undefined";
}
alert("变量a是Undefined的判断结果是:"+isUndefined(a));
alert("变量s是Undefined的判断结果是:"+isUndefined(s));
</script>

运行结果:

JavaScript知识点总结(六)之JavaScript判断变量数据类型

5.对象(Object)

由于当变量是空值Null时,typeof也会返回object,所以Object不能直接用 typeof 判断。

应该这样:

function isObj(str){
if(str === null || typeof str === 'undefined'){
return false;
}
return typeof str === 'object';
}

测试代码:

<script type="text/javascript">
/*
判断变量是不是Object类型
*/
function isObj(str){
if(str === null || typeof str === 'undefined'){
return false;
}
return typeof str === 'object';
}
var a;
var b = null;
var c = "str";
var d = {};
var e = new Object();
alert("b的值是null,typeof b ==='object'的判断结果是:"+(typeof b ==='object'));
alert("变量a是Object类型的判断结果是:"+isObj(a));//false
alert("变量b是Object类型的判断结果是:"+isObj(b));//false
alert("变量c是Object类型的判断结果是:"+isObj(c));//false
alert("变量d是Object类型的判断结果是:"+isObj(d));//true
alert("变量e是Object类型的判断结果是:"+isObj(e));//true
</script>

运行结果:

JavaScript知识点总结(六)之JavaScript判断变量数据类型

6.空值(Null)

判断空值用 val === null 即可

function isNull(val){
return val === null;
}

测试代码:

/*
判断变量是不是null
*/
function isNull(val){
return val === null;
}
/*测试变量*/
var a;
var b = null;
var c = "str";
//弹出运行结果
alert("变量a是null的判断结果是:"+isNull(a));//false
alert("变量b是null类型的判断结果是:"+isNull(b));//true
alert("变量c是null类型的判断结果是:"+isNull(c));//false

运行结果:

JavaScript知识点总结(六)之JavaScript判断变量数据类型

7.数组(Array)

数组类型不可用typeof来判断。因为当变量是数组类型是,typeof会返回object。

  这里有两种方法判断数组类型:

/*判断变量arr是不是数组
方法一
*/
function isArray(arr) {
return Object.prototype.toString.apply(arr) === '[object Array]';
}
/*判断变量arr是不是数组
方法二
*/
function isArray(arr) {
if(arr === null || typeof arr === 'undefined'){
return false;
}
return arr.constructor === Array;
}

测试代码:

<script type="text/javascript">
/*判断变量arr是不是数组
方法一
*/
function isArray(arr) {
return Object.prototype.toString.apply(arr) === '[object Array]';
}
/*判断变量arr是不是数组
方法二
*/
function isArray(arr) {
if(arr === null || typeof arr === 'undefined'){
return false;
}
return arr.constructor === Array;
}
//测试变量
var a = null;
var b = "";
var c ;
var arr = [,,];
var arr = new Array();
//打印测试结果
document.write("arr变量是数组类型,typeof arr === 'object'的结果是:"+(typeof arr === 'object'));
document.write("<br/>");
document.write("------------------------------------------------------------------------------------------------");
document.write("<br/>");
document.write("使用isArray方法判断结果如下:");
document.write("<br/>");
document.write("------------------------------------------------------------------------------------------------");
document.write("<br/>");
document.write("变量a是数组类型的判断结果是:"+isArray(a));
document.write("<br/>");
document.write("变量b是数组类型的判断结果是:"+isArray(b));
document.write("<br/>");
document.write("变量c是数组类型的判断结果是:"+isArray(c));
document.write("<br/>");
document.write("变量arr是数组类型的判断结果是:"+isArray(arr));
document.write("<br/>");
document.write("变量arr是数组类型的判断结果是:"+isArray(arr));
document.write("<br/>");
document.write("------------------------------------------------------------------------------------------------");
document.write("<br/>");
document.write("使用isArray方法判断结果如下:");
document.write("<br/>");
document.write("------------------------------------------------------------------------------------------------");
document.write("<br/>");
document.write("变量a是数组类型的判断结果是:"+isArray(a));
document.write("<br/>");
document.write("变量b是数组类型的判断结果是:"+isArray(b));
document.write("<br/>");
document.write("变量c是数组类型的判断结果是:"+isArray(c));
document.write("<br/>");
document.write("变量arr是数组类型的判断结果是:"+isArray(arr));
document.write("<br/>");
document.write("变量arr是数组类型的判断结果是:"+isArray(arr));
document.write("<br/>");
</script>

运行结果:

JavaScript知识点总结(六)之JavaScript判断变量数据类型

以上内容是小编给大家介绍的JavaScript知识点总结(六)之JavaScript判断变量数据类型的相关知识,希望对大家有所帮助,如果大家想了解更多内容敬请关注三水点靠木网站!

Javascript 相关文章推荐
raphael.js绘制中国地图 地图绘制方法
Feb 12 Javascript
jquery根据属性和index来查找属性值并操作
Jul 25 Javascript
深入理解JavaScript系列(17):面向对象编程之概论详细介绍
Mar 04 Javascript
jQuery使用slideUp方法实现控制元素缓慢收起
Mar 27 Javascript
JavaScript实现带标题的图片轮播特效
May 20 Javascript
使用JQuery 加载页面时调用JS的实现方法
May 30 Javascript
jquery计算出left和top,让一个div水平垂直居中的简单实例
Jul 13 Javascript
Mongoose实现虚拟字段查询的方法详解
Aug 15 Javascript
js将URL网址转为16进制加密与解密函数
Mar 04 Javascript
JavaScript实现字符串与HTML格式相互转换
Mar 17 Javascript
JS实现滑动拼图验证功能完整示例
Mar 29 Javascript
微信小程序用户登录和登录态维护的实现
Dec 10 Javascript
JavaScript知识点总结(五)之Javascript中两个等于号(==)和三个等于号(===)的区别
May 31 #Javascript
JavaScript知识点总结(四)之逻辑OR运算符详解
May 31 #Javascript
JS中使用apply方法通过不同数量的参数调用函数的方法
May 31 #Javascript
jQuery解决IE6、7、8不能使用 JSON.stringify 函数的问题
May 31 #Javascript
利用jQuery实现CheckBox全选/全不选/反选的简单代码
May 31 #Javascript
TinyMCE汉化及本地上传图片功能实例详解
May 31 #Javascript
JS定时器使用,定时定点,固定时刻,循环执行详解
May 31 #Javascript
You might like
PHP中JSON的应用技巧
2015/10/10 PHP
用javascript父窗口控制只弹出一个子窗口
2007/04/10 Javascript
深入探密Javascript数组方法
2015/01/08 Javascript
JavaScript将当前时间转换成UTC标准时间的方法
2015/04/06 Javascript
js实现下拉列表选中某个值的方法(3种方法)
2015/12/17 Javascript
jQuery侧边栏实现代码
2016/05/06 Javascript
js 自带的sort() 方法全面了解
2016/08/16 Javascript
JavaScript中const、var和let区别浅析
2016/10/11 Javascript
微信小程序 MINA文件结构
2016/10/17 Javascript
js oncontextmenu事件使用详解
2017/03/25 Javascript
详解Vue2中组件间通信的解决全方案
2017/07/28 Javascript
JavaScript基础之流程控制语句的用法
2017/08/31 Javascript
vue.js实现标签页切换效果
2018/06/07 Javascript
微信小程序学习笔记之表单提交与PHP后台数据交互处理图文详解
2019/03/28 Javascript
[43:51]2018DOTA2亚洲邀请赛3月30日 小组赛B组 EG VS Secret
2018/03/31 DOTA
[00:33]2018DOTA2亚洲邀请赛TNC出场
2018/04/04 DOTA
python实现模拟按键,自动翻页看u17漫画
2015/03/17 Python
在Python下尝试多线程编程
2015/04/28 Python
Python中用sleep()方法操作时间的教程
2015/05/22 Python
浅谈终端直接执行py文件,不需要python命令
2017/01/23 Python
Django数据库操作的实例(增删改查)
2017/09/04 Python
Python输出各行命令详解
2018/02/01 Python
详解tensorflow训练自己的数据集实现CNN图像分类
2018/02/07 Python
Python全排列操作实例分析
2018/07/24 Python
PyQt5实现类似别踩白块游戏
2019/01/24 Python
python for和else语句趣谈
2019/07/02 Python
Python简单处理坐标排序问题示例
2019/07/11 Python
python 解决flask uwsgi 获取不到全局变量的问题
2019/12/22 Python
scrapy爬虫:scrapy.FormRequest中formdata参数详解
2020/04/30 Python
Pycharm安装python库的方法
2020/11/24 Python
SQL Server面试题
2013/04/04 面试题
介绍一下Linux文件的记录形式
2012/04/18 面试题
介绍一下grep命令的使用
2015/06/12 面试题
给校长的建议书范文
2015/09/14 职场文书
python实战之一步一步教你绘制小猪佩奇
2021/04/22 Python
jQuery ajax - getScript() 方法和getJSON方法
2021/05/14 jQuery