js

类型识别的几种方式

Posted by liyaozr on April 9, 2017

首先我们来了解一下js中的数据类型包含哪些。

一、js数据类型

1.Number(数字型)

2.String(字符串行)

3.Boolean(布尔型)

4.Object (引用类型/对象类型)

5.Null(空值)

6.Undefined(未定义值)

除Object为对象(引用)类型之外,其他都是原始(值)类型。

javascript是以Object为基础的语言,除基本数据类型外,其他所有的引用数据类型,本质上都是Object。

二、类型识别的几种方式

1.typeof

typeof是一个一元运算,放在一个运算数之前,运算数可以是任意类型。

它返回值是一个字符串,该字符串说明运算数的类型。typeof一般只能返回如下几个结果:

number,boolean,string,function,object,undefined

console.log(typeof 'abc');  //string
console.log(typeof 1 );  //number
console.log(typeof true );  //boolean
console.log(typeof undefined );  //undefined
console.log(typeof null );  //object
console.log(typeof {name: 'moon'} );  //object
console.log(typeof function () {} );  //function
console.log(typeof [] );  //object
console.log(typeof new Date() );  //object
console.log(typeof /\d/ );  //object
function Person() {}
console.log(typeof new Person() );  //object

小结:

  • typeof可以识别原始类型(Null除外),Null类型会被识别成object
  • 不能识别具体的对象类型(Function除外)

2.instanceof

instanceof 用于判断一个变量是否某个对象的实例(一个实例是否属于某一类型),用来识别对象类型。

或者说,对象与构造函数在原型链上是否有关系。

//能够判别内置对象
var a=new Array();
console.log(a instanceof Array); //true
console.log(a instanceof Object);//true.(因为Array是object的子类)
//能够判别自定义对象类型
function test(){};
var a=new test();
console.log(a instanceof test); //true
//不能判别原始数据类型
console.log(1 instanceof Number); //false
console.log('moon' instanceof String); //false

小结:

  • 可以判别所有对象类型,包括内置对象和自定义对象
  • 不能判别原始类型

3.Constructor

查看对象的构造函数

//判别原始类型
console.log('moon'.constructor === String); //true
console.log((1).constructor === Number);  //true,注意这里1要加上括号
console.log(true.constructor === Boolean); //true
//判别内置对象
console.log([].constructor === Array );  //true
//判别自定义对象
function Aaa(){
}
var a1 = new Aaa();
console.log( a1.constructor );  //Aaa

小结:

  • 判别原始类型(Undefined和Null除外,因为它们没有构造函数)
  • 判别内置对象类型
  • 判别自定义对象类型

获取对象构造函数名称的方法:

function getConstructorName(obj){
    return (obj===undefined||obj===null)?
            obj:
           (obj.constructor&&obj.constructor.toString().match(/function\s*([^(]*)/)[1]);
}

说明:

1.入参obj如果是undefined和null,则返回其自身;

2.入参obj如果是其他值,则返回obj.constructor&&obj.constructor.toString().match(/function\s([^(])/)[1]的结果;

1)obj.constructor //保证这个对象存在构造函数,保证&&后面的语句正常执行。

2)obj.constructor.toString(); //”function Number(){[native code]}”,构造函数的名称,这里假设为Number()对象。

3).match(/function\s([^(])/)[1]; //”Number” ,通过.match方法获取字符串中的子字符串

4.Object.prototype.toString.call()或{}.prototype.toString.call()

在使用时Object.prototype.toString.call(xxx)会返回类似[object String]的字符串给我们,用它就可以很好的判断类型了。

先把方法封装成一个函数

function type(obj) {
    return Object.prototype.toString.call(obj).slice(8,-1);
}
//字符串截取我们需要的部分
console.log(type('moon')); //String
console.log(type(1)); //Number
console.log(type(true)); //Boolean
console.log(type(undefined)); //Undefined
console.log(type(null));  //Null
console.log(type({})); //Object
console.log(type([])); //Array
console.log(type(new Date())); //Date
console.log(type(/\d/));  //RegExp
console.log(type(function () {})); //Function
function Person() {
}
console.log(type(new Person())); //Object

小结:

  • 可以识别所有原始类型和内置对象类型
  • 不能识别自定义对象类型

5.总结

没有完美的判断类型的方法,但是我们可以根据需求自行选取合适的。

最后来一个练习题吧~

函数myType用于根据输入参数返回相应的类型信息。

语法如下:

var str = myType (param);

使用范例如下:

myType (1);     返回值: "number"
myType (false);     返回值: "boolean"
myType ({});        返回值: "object"
myType ([]);        返回值:" Array"
myType (function(){});  返回值:"function"
myType (new Date());    返回值: "Date"

请写出函数myType的实现代码。

function myType(param){
    if(typeof param=="object"){
        return Object.prototype.toString.call(param).slice(8,-1)=="Object"?
              "object":
               Object.prototype.toString.call(param).slice(8,-1);
   }else{
       return typeof param;
    }
}