JS中四种数据类型检测

1、typeof [val]:用来检测数据类型的运算符

2、instanceof :用来检测当前实例是否率属于某个类

3、constructor : 基于构造函数检测数据类型(也是基于类的方式)

4、Object.prototype.toString.call() :检测数据类型最好的办法

一、typeof

typeof [value]
@return 
    首先是个字符串
    字符串中包含对应的数据类型,例如:"number"、"object"、"undefined"、"function"、"boolean"、
"symbol"...
@局限性
    typeof null  =>"object"
    不能具体区分对象数据类型的值(无法检测是正则还是数组等)
    typeof []    =>"object"
    typeof {}    =>"object"
    typeof /^$/  =>"object"
@优势
    使用方便,所以在真实项目中,我们也会大量应用它来检测,尤其是在检测基本类型值(除null之外)和函数类型
值的时候,它还是很方便的
 function func(n, m, callback) {
 /*形参赋值默认值*/ 
//=>ES6: func(n = 0, m = 0)
//=>检测形参的值是否为UNDEFINED
// n === undefined ? n = 0 : null;
// typeof m === "undefined" ? m = 0 : null;
//=>基于逻辑或和逻辑与处理(瑕疵:不仅仅是不传赋值默认值,如果传递的值是假也会处理成为默认值)
// n = n || 0;
// m = m || 0;

/* 回调函数执行 */
        // typeof callback === "function" ? callback() : null;
        // callback && callback(); //=>瑕疵:传递的为真即可执行,不一定是一个函数,这样写是开发者心里
    已经知道,要不然不传,要传就是一个函数
    }
    func(10, 20, function anonymous() {}); */

二、instanceof

instanceof:本意是用来检测实例是否隶属于某个类的运算符,我们基于这样的方式,也可以用来做某些数据类型
    的检测,例如:数组、正则等
        @局限性
            不能处理基本数据类型值,只要在当前实例的原型链(proto)中出现过的类,检测结果都是true(用户可能会手
      动修改原型链的指向:example.proto 或者 在类的继承中 等情况)
    
function func() {
    arguments:类数组
    arguments.proto = Array.prototype;
    console.log(arguments instanceof Array); //=>true
}
func();
let arr = [],
    reg = /^$/,
    obj = {};
    // console.log(arr instanceof Array); //=>true
    // console.log(reg instanceof Array); //=>false
    // console.log(arr instanceof Object); //=>true
    // console.log(obj instanceof Array); //=>false
    // console.log(1 instanceof Number); //=>false
    
//=>创建值的两种方式(不管哪种方式都是所属类的实例)
//字面量:let n = 12;
//构造函数:let m = new Number('12');

三、constructor

constructor:构造函数 
    @原理:在类的原型上一般都会带有constructor属性,存储当前类本身,我们也是利用这一点,获取某的实例
constructor属性值,验证是否为所属的类,从而进行数据类型检测
    @局限性:constructor属性值容易被修改

    let n = 12,
        arr = [];
    // console.log(n.constructor === Number); //=>true
    // console.log(arr.constructor === Array); //=>true
    // console.log(arr.constructor === Object); //=>false
    
    // arr.constructor = 111; //=>设置私有属性
    // console.log(arr.constructor === Array); //=>false
    // Func.prototype={}; //=>这样原型上就没有constructor属性,因为被重构了,有需要需手动添加

四、Object.prototype.toString.call([value])

    Object.prototype.toString.call([value]):调用Object原型上的toString方法,让方法执行的时候,
方法中的this是要检测的数据类型 ,从而获取到数据类型所属类的详细信息
    @信息的模板
        "[object 所属类]" ,例如:"[object Array]"

    在所有的数据类型类中,它们的原型上都有toString方法,除Object.prototype.toString不是把数据值转换为
字符串,其余的都是转为字符串,而Object原型上的toString是检测当前实例隶属类的详细信息的(检测数据类型)
    
    obj.toString()
        1.首先基于原型链查找机制,找到Object.prototype.toString
        2.把找到的方法执行,方法中的this -> obj
        3.方法内部把this(obj)的所属类信息输出
        =>方法执行,方法中的this是谁,就是检测谁的所属类信息

    这个方法很强大,所有数据类型隶属的类信息检测的一清二楚
    "[object Number]"  String/Boolean/Null/Undefined/Symbol/Object/Array/RegExp/Date/Math/Function...

let _obj = {},
    toString = _obj.toString;
    
console.log(_obj.toString.call(100)); //=>"[object Number]"
console.log(Object.prototype.toString.call(100)); //=>"[object Number]"

function func(n, m) {
    return n + m;
}

let obj1 = {},
    obj2 = {
        name: '郑一'
    }; 
    
console.log([12, 23].toString()); //=>"12,23"
console.log(/^\d+$/.toString()); //=>"/^\d+$/"
console.log(func.toString()); //=>"function func(n, m) {..."
console.log(obj1.toString()); //=>"[object Object]"
console.log(obj2.toString()); //=>"[object Object]"

师承——北京珠峰培训:周啸天

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 200,302评论 5 470
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 84,232评论 2 377
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 147,337评论 0 332
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 53,977评论 1 272
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 62,920评论 5 360
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,194评论 1 277
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,638评论 3 390
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,319评论 0 254
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,455评论 1 294
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,379评论 2 317
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,426评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,106评论 3 315
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,696评论 3 303
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,786评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,996评论 1 255
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,467评论 2 346
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,043评论 2 341

推荐阅读更多精彩内容