zoukankan      html  css  js  c++  java
  • 详解数据类型检测的四种方式

    详解数据类型检测的四种方式

    typeof:用来检测数据类型的运算符

    console.log(typeof 12);
    var name = 'xiaoke';
    console.log(typeof name);
    

    使用typeof检测数据类型,首先返回的都是一个字符串,其次字符串中包含了对应的数据类型

    • 例如:"number"、"string"、"boolean"、"undefined"、"function"、"object"、""

    局限性: typeof null->"object"

    • 不能具体细分是数组还是正则,还是对象中其他的值,因为使用type哦对检测数据类型,对于对象数据类型中的值,最后返回的结果都是"object"
    console.log(typeof typeof typeoof function());//->"string"
    
    function fn(callback){
    	//typeof callback === "function"?callback:null;
    	callback&&callback();
    }
    fn(function(){});
    

    instanceof:检测某一个实例是否属于某个类

    var obj = [12,23];
    console.log(obj instanceof Array);//true
    console.log(obj instanceof RegExp);//false
    

    局限性:

    • 在类的原型继承中,我们最后检测出来的结果不一定正确

    在原型被修改之后都可能不正确

    console.log(1 instanceof Number);//false
    console.log("" instanceof String);//false
    var ary = [];
    console.log(ary instanceof Array);//true
    function fn(){}
    var ary = new Array;
    fn.prototype = new Array;//->原型继承;让子类的原型等于父类的一个实例
    var f = new fn;
    f.__proto__ = fn.prototype=ary.__proto__=Array.prototype;
    fn.prototype->Array.prototype->Object.prototype
    console.log(f instanceof Array);//true
    

    constructor:构造函数

    作用和instanceof非常相似

    • 可以处理基本数据类型的检测
    • constructor检测Object和instanceof不一样,一般情况下是检测不了的

    局限性:

    • 我们可以把类的原型进行重写,在重写的过程中很有可能出现之前的constructor给覆盖了,这样检测出来的结果就是不正确的
    var num = 1;
    console.log(num.constructor ===Number);//
    var reg = /^$/;
    console.log(reg.constructor===RegExp);//true
    console.log(reg.constructor===Object);//false
    
    function Fn(){}
    Fn.protoype = new Array;
    var f = new Fn;
    console.log(f.constructor);//Array
    

    注意:对于特殊的数据类型,比如:null和undefined,他们的所属类是Null和Undefined,但是浏览器把这两个类保护起来了,不允许在外面访问使用

    Object.prototype.toString.call():最准确最常用的方式

    什么叫Object?

    • Object是内置类、是所有对象的基类、Object是引用数据类型
    • 首先获取Object原型上的toString方法,让方法执行,并且改变方法中的this关键字
    • 作用:Object.prototype.toString它的作用是返回当前方法的执行主体(方法中的this)所属类的详细信息,[object Object],第一个object代表当前实例是对象数据类型(这个是固定死的),第二个Object代表的是obj所属类是Object
    var obj = {};
    console.log(obj.toString());//->toString中的this是谁?->obj,返回的是obj所属类的信息->"[object Object]" 
    

    对toString的理解

    咋一看应该是转换为字符串,但是某些toString方法不仅仅是转换为字符串
    对于Number、String、Boolean、Array、RegExp、Date、Function原型上的toString方法都是把当前的数据类型转换为字符串类型的(它们的作用仅仅是用来转换为字符串的)

    • Number.prototype.toString()是用来转换为字符串的,如果toString()的参数为一个,可以转换为各种进制的数字

    console.log(({}).toString());//[object Object]

    • 字符串的原型上的toString()也是用来转换为字符串的,进制转换不管用
    console.log((1).toString());//Number.prototype.toString()转换为字符串
    console.log((true).toString());//"true"
    console.log((null).toString());//Cannot read property''toString' of null
    console.log((undefined).toString());//Cannot read property''toString' of undefined
    console.log(({}).toString());//[object Object]
    
    
  • 相关阅读:
    Python 2, Python 3, Stretch & Buster
    React Native v0.4 发布,用 React 编写移动应用
    Web性能优化分析
    剖析页面绘制时间
    Web页面制作之开发调试工具
    AlloyRenderingEngine入门
    LFTP 4.6.2 发布,命令行 FTP 工具。这个东东可以用来做插件
    麻省理工的 Picture 语言:代码瘦身的秘诀
    2015超实用的前端开发指南
    手机软件没过多久就删了 APP到底得了什么病?
  • 原文地址:https://www.cnblogs.com/kjz-jenny/p/9311856.html
Copyright © 2011-2022 走看看