zoukankan      html  css  js  c++  java
  • JavaScript中判断数据类型

    1.typeof进行判断

    typeof 是一个一元运算符,放在运算数之前,运算数可以是任意类型。它返回值是一个字符串,该字符串说明运算数的类型。typeof 一般只能返回如下几个结果: number、string、boolean、function、object、undefined。看下面例子:

    console.log(typeof '1');   //string
    console.log(typeof 1);     //number
    console.log(typeof true);  //boolean
    console.log(typeof {});   //object
    console.log(typeof []);   //object
    function t (){}
    console.log(typeof t);   //function
    console.log(typeof null);  //object
    console.log(typeof undefined); //undefined

     

    从上面例子可以看出通过typeof运算数组类似对象,返回的也是object,此时无法判断一个对象是不是数组。

    2.instanceof进行判断

    instanceof用于判断一个变量是否是某个对象的实例。

    看下面例子:

    console.log([] instanceof Array);//true
    console.log([] instanceof Object);//true

    从上面例子可以看出,还是没办法判断数组类型。

    3.constructor判断

    在W3C定义中:constructor属性返回对创建对象数组函数的引用,也就是返回对象相应的构造函数。

    console.log([].constructor == Array);//true
    console.log([].constructor == Object);//false
    console.log((1).constructor == Number);//true
    console.log('str'.constructor == String);//true
    console.log(true.constructor == Boolean);//true
    function t(){}
    console.log(t.constructor == Function);//true

    从上面可以看出通过数据的constructor属性可以判断数据类型。

    但是要注意的是:

    被判断的array必须是在当前页面声明的。比如,一个页面(父页面)有一个框架,框架中引用了一个页面(子页面),在子页面中声明了一个array,并将其赋值给父页面的一个变量,这时判断该变量,Array == array.constructor会返回false。

    原因:

    1>.array属于引用型数据,在传递过程中,仅仅是引用地址的传递。

    2>.每个页面的Array原生对象所引用的地址是不一样的,在子页面声明的array,所对应的构造函数,是子页面的Array对象;父页面来进行判断,使用Array并不等于子页面的Array。

    4.完美的解决方案

    使用Object.prototype.toString.call来解决。

    下面是ECMA中对Object.prototype.toString的解释:

    Object.prototype.toString( )
    When the toString method is called, the following steps are taken:
    1. Get the [[Class]] property of this object.
    2. Compute a string value by concatenating the three strings “[object “, Result (1), and “]”.
    3. Return Result (2)

    其过程简单说来就是:1>.获取对象的类名(对象类型)。2.然后将‘[object’ 、获取的类名、‘]’三者组合并返回

    console.log(Object.prototype.toString.call([]) === '[object Array]');//true
    console.log(Object.prototype.toString.call([]) === '[object Object]');//false
    console.log(Object.prototype.toString.call({}) === '[object Object]');//true
    console.log(Object.prototype.toString.call(1) === '[object Number]');//true
    console.log(Object.prototype.toString.call('1') === '[object String]');//true
    console.log(Object.prototype.toString.call(true) === '[object Boolean]');//true
    console.log(Object.prototype.toString.call(null) );// [object Null]
    console.log(Object.prototype.toString.call(undefined));//[object Undefined]
    function t(){}
    console.log(Object.prototype.toString.call(t) === '[object Function]');//true

    这种方式既解决了instanceof存在的跨页面问题,也解决了属性检测方式所存在的问题,实在是一种妙招,一个很好的解决方案。

  • 相关阅读:
    洛谷P2831 愤怒的小鸟
    2017-10-7 清北刷题冲刺班p.m
    2017-10-7 清北刷题冲刺班a.m
    2017-10-6 清北刷题冲刺班p.m
    2017-10-5 清北刷题冲刺班p.m
    2017-10-6 清北刷题冲刺班a.m
    2017-10-5 清北刷题冲刺班a.m
    2017-10-4 清北刷题冲刺班p.m
    2017-10-4 清北刷题冲刺班a.m
    题目
  • 原文地址:https://www.cnblogs.com/erduyang/p/4652912.html
Copyright © 2011-2022 走看看