JavaScript数据类型检测详解

 //JS该如何检测数据的类型呢？

//使用关键字: typeof

//输出结果依次为：'number','string','boolean'.

1 console.log(typeof 17);
2 console.log(typeof '17');
3 console.log(typeof true);

//输出结果依次为：'object','undefined'

1 console.log(typeof null);
2 console.log(typeof undefined);

//可知：null 是object类型。

//输出结果依次为：'number','object'. 能够设想一下String('17'),new String('17');

1 console.log(typeof Number(17));
2 console.log(typeof new Number(17));

//输出结果依次为：'string','object'

1 console.log(typeof String('17'));
2 console.log(typeof new String('17'));

//同理：'boolean','object'。

1 console.log(typeof Boolean(true));
2 console.log(typeof new Boolean(true));

//Why ?
//使用new 关键字是构造新的对象。new Number()是构建一个number对象。
//new Number(17) 是17 的包装类型对象。而单纯的Number(17)是强制转换，是转型函数。
//使用new调用基本包装类型的构建函数与直接调用同名的转型函数是不同的。
//再看下面的实例，依次输出：false,true,false

1 console.log((17) instanceof Number);
2 console.log(new Number(17) instanceof Number);
3 console.log(Number(17) instanceof Number);

//在Java编程中，咱们都知道针对原始类型，Java API都提供对应包装对象。
//那么JS编程中，JS针对三种原始类型也提供了对应的包装对象：Number,String,Boolean.
//同理适用于String,Boolean. 

//接着往下看。
//输出结果为：'object','object','function'

1 console.log(typeof []);
2 console.log(typeof {});
3 console.log(typeof function(){});

//'object'，阴魂不散，真使人讨厌。
//问题来了，该如何准确的判断这些'object'呢？

//先介绍下call,apply 方法。
//在JS中，函数是一等公民。便可构建对象，又可做为值来使用。
//声明函数很简单

 1 function f1(){
 2 　　console.log("声明函数使用关键字function");
 3 }
 4 function f2(num1,num2){
 5 　　console.log("这是带二个参数的函数。"+num1+num2);
 6 }
 7 function f3(who){
 8 　　console.log("hello "+who);
 9 　　return "我是有返回值的函数";
10 }

//调用函数至关简单：一对圆括号，若是须要参数就附带上参数。

f1();f2(1,2);console.info(f3('china'));

//关于函数表达式，函数做为值，在后面讲闭包时在讲。
//关于函数参数

 1 function test(num1,num2){
 2 　　console.log(num1);
 3 　　num1=10;
 4 　　console.log(arguments[0]+" "+num2);
 5 　　arguments[0]=2;
 6 　　console.log(num1+" "+num2);
 7 　　console.log(arguments instanceof Array);
 8 　　console.log(arguments.toString());
 9 }
10 test(0,1);

//在JS中，系统有一个叫做：arguments的东东进行维护函数的参数。argument不是Array的实例。
//可是arguments拥有相似数组的特性:好比可使用方括号语法访问参数的元素，
//拥有length属性获取参数的个数。

1 function f4(arg1,arg2,arg3){
2 　　console.log(arguments.length);
3 　　for(var index=0,length=arguments.length;index<length;index++){
4 　　console.log(arguments[index]);
5 　　}
6 }
7 f4('中国',"福建");
8 f4('I ','am ','dylan');
9 f4('I ','am ','dylan','!!!');

//正是由于有arguments类数组管理参数，因此在参数传递时JS不会去考虑参数的个数。
//同时请观察test函数，能够发现num1与argument[0]值不只相等，并且是同步改变的。
//在传统面向对象编程中，构建函数是能够重载的，可是在JS中没有重载。
//function 也是对象。

console.log(function(){} instanceof Object);

//扩展一下，既然function是对象，那么函数名就是指向函数的指针了。
//既然是对象就必有相应的属性与方法，function拥有length,prototype属性（此属性后续再讲）
//拥有apply,call方法。

 1 function testLength1(){
 2  console.log("testLength1.length="+testLength1.length);
 3  console.log("没有参数，所以length为0。");
 4  console.log("arguments.callee.length="+arguments.callee.length);
 5 }
 6 function testLength2(name){
 7  console.log("testLength2.length="+testLength2.length);
 8  console.log("有一个参数，参数长度为1");
 9  console.log("arguments.callee.length="+arguments.callee.length);
10  console.log("arguments.length="+arguments.length);
11 }
12 
13 testLength1();
14 testLength2(); //注意
15 testLength2("dylan");
16 console.info(testLength1.length);
17 console.info(testLength2.length);

//一目了然了吧：length属性表示函数但愿接收的命名参数的个数。
//arguments是个类数组，它主要做用是管理函数的参数。
//arguments.callee表明当前函数名，在本例中就是：testLenght2.
//使用argument.callee在递归中颇有帮忙。感兴趣同窗能够去探索一下。
//函数的length属性与函数调用时实际接收到的参数值并不必定相等。

//每一个function都有二个方法：apply,call. 做用是执行指定函数（对象）的上下文。

 1 var o1 ={
 2  name: 'dylan',
 3  getName: function(){
 4  return this.name;
 5 },
 6  setName: function(greet,name){
 8  return greet+" , "+ name
 9  }
10 }
11 
12 var o2 ={
13  name: 'bady',
14  getName: function(){
15  return this.name;
16  }
18 }
19 //var o3={name:'hello'};
20 var o3={};

//调用o1的getName的方法，指定的上下文对象是o3，而o3没有name属性，因此返回undefined.

console.log(o1.getName.call(o3));

//调用o1的getName的方法，此的上下文对象是o2。因此返回bady.

console.log(o1.getName.call(o2));

//call与apply区分不大，主要在于apply 参数为数组。

1 console.log(o1.setName.call(o2,'Hi',' tony '));
2 console.log(o1.setName.apply(o2,['Hi',' fred ']));
3 //console.log(o1.setName.apply(o2,'Hi',' fred '));

//ok，说了这么多，如今回归typeof

 1 function toType(type){
 2   if(arguments.length==0){
 3   return ;
 4 }
 5  if((typeof type)!=='object'){
 6  return typeof type;
 7 }
 8 
 9 //return ({}).toString.call(type);
10  return ({}).toString.call(type).match(/\s(\w+)/)[1];
11 }    
12 console.log(toType([12]));
13 console.log(toType({}));
14 console.log(toType(function(){}));
15 console.log(toType(17));
16 console.log(toType('17'));
17 console.log(toType(false));
18 console.log(toType(new Number(17)));
19 console.log(toType(null));
20 console.log(toType(undefined));
21 console.log(toType(String("dylan")));

//toType还能够这样优化。
//return ({}).toString.call(type).match(/\s(\w+)/)[1];

//最后还能够调用toLowerCase方法。

//return ({}).toString.call(type).match(/\s(\w+)/)[1].toLowerCase();