• JavaScript数据类型检测


    在JavaScript中有两种数据类型的值:

    a:基本数据类型:Number、String、Boolean、Undefined、Null;

    b:引用类型数据:Object、Array、Function、Date、RegExp;

    那如何检验变量属于哪种数据类型....

    1.typeof方法

    typeof只能检测基本数据类型,对引用类型数据都返回"object";

    /*- 基本类型数据 -*/
    var str = "abc",
         num = 12,
         bool = false,
        unde;
    
    console.log(typeof str); //=> "string"
    console.log(typeof num); //=> "number"
    console.log(typeof bool); //=> "boolean"
    console.log(typeof unde); //=> "undefined"
    
    /*- 引用类型数据 -*/
    function fu(){};
    var obj = {};
    var arr = [];
    console.log(typeof fu); //=> "function"
    console.log(typeof obj); //=> "object"
    console.log(typeof arr); //=> "object"
    console.log(typeof null); //=> "object"
    console.log(typeof new Date()); //=> "object"
    console.log(typeof new RegExp()); //=> "object"
    

      

     2.instanceof方法;用来判断某个构造函数的prototype属性是否存在另外一个要检测对象的原型链上

    function A(){};
    function B(){};
    var a = new A();
    var b = new B();
    console.log(a instanceof A); //=> true;
    console.log(b instanceof A); //=> false;
    
    console.log(a instanceof Object); //=> true;
    console.log(b instanceof Object); //=> true;
    //a,b 都继承自Object

    注意:

    a:如果表达式 obj instanceof Foo 返回true,则并不意味着该表达式会永远返回ture,

    因为Foo.prototype属性的值有可能会改变,改变之后的值很有可能不存在于obj的原型链上,这时原表达式的值就会成为false

    另外一种情况下,原表达式的值也会改变,就是改变对象obj的原型链的情况,

    虽然在目前的ES规范中,我们只能读取对象的原型而不能改变它,但借助于非标准的__proto__魔法属性是可以实现的

    比如执行obj.__proto__ = {}之后obj instanceof Foo就会返回false了。

    b:instanceof和多全局对象(多个frame或多个window之间的交互);

    在浏览器中,我们的脚本可能需要在多个窗口之间进行交互。多个窗口意味着多个全局环境,不同的全局环境拥有不同的全局对象,从而拥有不同的内置类型构造函数。

    这可能会引发一些问题。比如,

    表达式 [] instanceof window.frames[0].Array 会返回false,因为 Array.prototype !== window.frames[0].Array.prototype

    因此你必须使用 Array.isArray(myObj) 或者Object.prototype.toString.call(myObj) === "[object Array]"来判断myObj是否是数组。

    function A(){};
    var a = new A();
    A.prototype = {};
    console.log(a instanceof A); //=> false;
    
    var a2 = new A();
    console.log(a2 instanceof A); //=> true;
    

    3.constructor方法;通过obj.constructor得到实例obj的对应的构造函数;

    注意:在修改了构造函数A的原型链且没有显示修改A.prototype.constructor的情况下,结果将不是我们想要的;

    function A(){};
    var a = new A();
    console.log(a.constructor); //=> function A(){};
    
    function B(){};
    A.prototype = new B();
    var a1 = new A();
    console.log(a1.constructor); //=> function B(){};
    
    A.prototype.constructor = A;
    console.log(a1.constructor); //=> function A(){};
    

    4.{}.toString || Object.prototype.toString(推荐使用) 返回一个代表该对象的字符串

    var ots = Object.prototype.toString
    ots.call(11); //=> "[object Number]";
    ots.call("string"); //=> "[object String]";
    ots.call(false); //=> "[object Boolean]";
    
    var aaa; //申明未赋值
    ots.call(aaa); //=> "[object Undefined]";
    
    ots.call(null); //=> "[object Null]";
    
    ots.call({}); //=> "[object Object]"
    ots.call([]); //=> "[object Array]"
    ots.call(function a(){}); //=> "[object Function]"

    补上常用的数据类型判断

    /*
     *数据类型检测
     */
    
    var ots = Object.prototype.toString,Type = {};
    /*基本数据类型:Number、String、Boolean、Undefined、Null*/ Type.isNumber = function(o){ return (o === 0 || o) && (typeof o === 'number' || ots.call(o) === '[object Number]'); }; Type.isString = function(o){ return (o === "" || o) && (typeof o === 'string || ots.call(o) === '[object String]');
    };
    Type.isBoolean = function(o){ return (o === false || o) && (typeof o === 'boolean' || ots.call(o) === '[object Boolean]'); }; 
    Type.isUndefined = function(o){//不可在全局环境调用函数 return typeof(o) === 'undefined' || ots.call(o) === '[object Undefined]'; };
    Type.isNull = function(o){ return o === null ots.call(o) === '[object Null]'; };

    /*引用数据类型:Object、Array、Function*/
    Type.isObiect = function(o){ return o && (o instanceof Object || ots.call(o) === "[object Object]"); };
    Type.isArray = function(o){ return o && (o instanceof Array || ots.call(o) === "[object Array]"); };
    Type.isFunction = function(o){ return o && (o instanceof Function || ots.call(o) === '[object Function]'); };

      

  • 相关阅读:
    《JavaScript 源码分析》之 jquery.unobtrusive-ajax.js
    《JavaScript高级程序设计》读书笔记 2
    《JS设计模式笔记》构造函数和工厂模式创建对象
    《ES6基础教程》之 map、forEach、filter indexOf 用法
    《JS设计模式笔记》 5,适配器模式
    51Nod 1058 N的阶乘的长度
    ACM总结——2017区域赛网络赛总结
    ACM-ICPC国际大学生程序设计竞赛北京赛区(2017)网络赛 题目9 : Minimum
    hiho一下 第168周
    Fast Matrix Calculation HDU
  • 原文地址:https://www.cnblogs.com/pangzai/p/4863078.html
Copyright © 2020-2023  润新知