资讯专栏INFORMATION COLUMN

js基础--数据类型检测的相关知识

MangoGoing / 886人阅读

摘要:话不多说,我们开干,加油干货满满今天,我们一起学习一下中的数据类型检测相关的知识,也顺便做个总结。基本数据类型又包括,还有一个新增的,我们这先不说。

欢迎访问我的个人博客:http://www.xiaolongwu.cn

前言

最近工作有点忙,好几天都没更新技术博客了。

周末起床打开有道云笔记,发现自己的博客todolist里躺了一堆只有名字的文件。

话不多说,我们开干,加油!

干货满满

今天,我们一起学习一下js中的数据类型检测相关的知识,也顺便做个总结。

1、数据类型介绍

我们都知道,在js中分为基本数据类型和复杂数据类型。

基本数据类型又包括 Sting Number Boolean Null Undefined ,还有一个es6新增的Symbol,我们这先不说。

复杂数据类型只有一种,那就是Object。

我们平时见到的数组Array、正则RegExp、时间对象Date、函数Function等都属于Object。

2、如何判断基本数据类型

这点想必大家都知道,但是我还是要在这里啰嗦一下。

判断基本数据类型我们可以选择typeof来判断。

这里需要注意就是返回值,他的返回值为小写字母开头的字符串。

//字符串
typeof "leon"  // "sting"

//整数
typeof 22  // "number"

//undefined
typeof undefined  // "undefined"

//Boolean
typeof true  // "boolean"

//Null
typeof null  // "object" 这为什么是object ?
// 因为null表示的是一个空指针,指针表示的是引用型数据,所以返回object

//Object
typeof [1,2.3]      //"object" 
typeof {a: "ww"}    //"object" 
typeof new Date()   //"object" 

//function
typeof function(){}     //"function"
3、instanceof

instanceof是用来检测引用类型,检测是那种类型的实例。

他的返回值为Boolean值,真为true,否则为false。

不能检测null,会报错。

// 这种检测方式一般不常用
[1, 2] instanceof Array  //true

({a: 1}) instanceof Object  //true

(function(){}) instanceof Function  //true
4、Constructor

返回结果为构造器,也可以检测自定义类型;

但是不适用于null和undefined。

"leon".constructor == String // true
(1234).constructor == Number // true
(true).constructor == Boolean // true
[1, 2].constructor == Array // true
({name:"leon"}).constructor == Object // true
(function(){}).constructor == Function // true

检测自定义类型

function Leon(){}
var leon = new Leon();
leon.constructor == Leon;  // true 
5、Object.prototype.toString.call(obj)

这种方式是最权威的,也是很多框架插件中用到的方法,推荐使用;

Object.prototype.toString.call("leon"); //"[object String]"
Object.prototype.toString.call(1234);  //"[object Number]"
Object.prototype.toString.call(true); //"[object Boolean]"
Object.prototype.toString.call([1,2,3]); //"[object Array]"
Object.prototype.toString.call({name:"leon"}); //"[object Object]"
Object.prototype.toString.call(function(){}); //"[object Function]"
Object.prototype.toString.call(null); //"[object Null]"
Object.prototype.toString.call(undefined); //"[object Undefined]"

实际使用时,可以这么写

var test = Object.prototype.toString.call("leon");
if(test == "[object String]") {
    console.log("这是个字符串")
}

//当然我们也可以选择用正则去判断第二个单词,从而得到数据的类型

github文章资源地址:js基础--数据类型检测的相关知识

我的CSDN博客地址:https://blog.csdn.net/wxl1555

如果您对我的博客内容有疑惑或质疑的地方,请在下方评论区留言,或邮件给我,共同学习进步。

邮箱:wuxiaolong802@163.com

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/109093.html

相关文章

  • 前端开发知识点整理

    摘要:前言本文主要是有关前端方面知识按照目前的认知进行的收集归类概括和整理,涵盖前端理论与前端实践两方面。 前言:本文主要是有关前端方面知识按照 XX 目前的认知进行的收集、归类、概括和整理,涵盖『前端理论』与『前端实践』两方面。本文会告诉你前端需要了解的知识大致有什么,看上去有很多,但具体你要学什么,还是要 follow your heart & follow your BOSS。 初衷...

    Blackjun 评论0 收藏0
  • 前端开发知识点整理

    摘要:前言本文主要是有关前端方面知识按照目前的认知进行的收集归类概括和整理,涵盖前端理论与前端实践两方面。 前言:本文主要是有关前端方面知识按照 XX 目前的认知进行的收集、归类、概括和整理,涵盖『前端理论』与『前端实践』两方面。本文会告诉你前端需要了解的知识大致有什么,看上去有很多,但具体你要学什么,还是要 follow your heart & follow your BOSS。 初衷...

    Sike 评论0 收藏0
  • 前端开发知识点整理

    摘要:前言本文主要是有关前端方面知识按照目前的认知进行的收集归类概括和整理,涵盖前端理论与前端实践两方面。 前言:本文主要是有关前端方面知识按照 XX 目前的认知进行的收集、归类、概括和整理,涵盖『前端理论』与『前端实践』两方面。本文会告诉你前端需要了解的知识大致有什么,看上去有很多,但具体你要学什么,还是要 follow your heart & follow your BOSS。 初衷...

    tracy 评论0 收藏0
  • js基础知识

    摘要:注意乱序遍历对象属性。注意因为会遍历整个原型链的所有属性值,所以效率较循环慢了很多。,不做类型转换,类型不同的一定不等操作事件机制几个概念事件流,事件冒泡,事件捕获原型继承面向对象前端模块化规范列表项目闭包跨域 根据百度学院的教程复习下js基础,在这里做一个汇总笔记 1.数据类型、判断 最新的 ECMAScript 标准定义了 7 种数据类型: string number boole...

    浠ラ箍 评论0 收藏0
  • 基础 - 收藏集 - 掘金

    摘要:的语言的动态性意味着我们可以使用以上种数据类型表示变换过渡动画实现案例前端掘金以下所有效果的实现方式均为个人见解,如有不对的地方还请一一指出。 读 zepto 源码之工具函数 - 掘金Zepto 提供了丰富的工具函数,下面来一一解读。 源码版本 本文阅读的源码为 zepto1.2.0 $.extend $.extend 方法可以用来扩展目标对象的属性。目标对象的同名属性会被源对象的属性...

    wuaiqiu 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<