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

//使用关键字: typeof

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

 console.log(typeof 17);
console.log(typeof '17');
console.log(typeof true);

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

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

//可知:null 是object类型。

//输出结果依次为:'number','object'. 可以设想一下String('17'),new String('17');

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

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

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

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

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

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

 console.log((17) instanceof Number);
console.log(new Number(17) instanceof Number);
console.log(Number(17) instanceof Number);

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

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

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

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

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

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

//调用函数相当简单:一对圆括号,如果需要参数就附带上参数。

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

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

 function test(num1,num2){
  console.log(num1);
  num1=10;
  console.log(arguments[0]+" "+num2);
  arguments[0]=2;
  console.log(num1+" "+num2);
  console.log(arguments instanceof Array);
  console.log(arguments.toString());
}
test(0,1);

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

 function f4(arg1,arg2,arg3){
  console.log(arguments.length);
  for(var index=0,length=arguments.length;index<length;index++){
  console.log(arguments[index]);
  }
}
f4('中国',"福建");
f4('I ','am ','dylan');
f4('I ','am ','dylan','!!!');

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

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

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

 function testLength1(){
console.log("testLength1.length="+testLength1.length);
console.log("没有参数,因此length为0。");
console.log("arguments.callee.length="+arguments.callee.length);
}
function testLength2(name){
console.log("testLength2.length="+testLength2.length);
console.log("有一个参数,参数长度为1");
console.log("arguments.callee.length="+arguments.callee.length);
console.log("arguments.length="+arguments.length);
} testLength1();
testLength2(); //注意
testLength2("dylan");
console.info(testLength1.length);
console.info(testLength2.length);

//一目了然了吧:length属性表示函数希望接收的命名参数的个数。
//arguments是个类数组,它主要作用是管理函数的参数。
//arguments.callee代表当前函数名,在本例中就是:testLenght2.
//使用argument.callee在递归中很有帮忙。感兴趣同学可以去探索一下。
//函数的length属性与函数调用时实际接收到的参数值并不一定相等。

//每个function都有二个方法:apply,call. 作用是执行指定函数(对象)的上下文。

 var o1 ={
name: 'dylan',
getName: function(){
return this.name;
},
setName: function(greet,name){
return greet+" , "+ name
}
} var o2 ={
name: 'bady',
getName: function(){
return this.name;
16 }
}
//var o3={name:'hello'};
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 参数为数组。

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

//ok,说了这么多,现在回归typeof

 function toType(type){
if(arguments.length==0){
return ;
}
if((typeof type)!=='object'){
return typeof type;
} //return ({}).toString.call(type);
return ({}).toString.call(type).match(/\s(\w+)/)[1];
}
console.log(toType([12]));
console.log(toType({}));
console.log(toType(function(){}));
console.log(toType(17));
console.log(toType('17'));
console.log(toType(false));
console.log(toType(new Number(17)));
console.log(toType(null));
console.log(toType(undefined));
console.log(toType(String("dylan")));

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

//最后还可以调用toLowerCase方法。

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

JavaScript数据类型检测详解的更多相关文章

  1. 从mixin到new和prototype:Javascript原型机制详解

    从mixin到new和prototype:Javascript原型机制详解   这是一篇markdown格式的文章,更好的阅读体验请访问我的github,移动端请访问我的博客 继承是为了实现方法的复用 ...

  2. 【面试题】JS第七种数据类型Symbol详解

    JS第七种数据类型Symbol详解 点击打开视频讲解更加详细 一.什么是Symbol? Symbol是ES6中引入的一种新的基本数据类型,用于表示一个独一无二的值.它是JavaScript中的第 七种 ...

  3. APP漏洞扫描器之本地拒绝服务检测详解

    APP漏洞扫描器之本地拒绝服务检测详解 阿里聚安全的Android应用漏洞扫描器有一个检测项是本地拒绝服务漏洞的检测,采用的是静态分析加动态模糊测试的方法来检测,检测结果准确全面.本文将讲一下应用漏洞 ...

  4. JavaScript严格模式详解

    转载自阮一峰的博客 Javascript 严格模式详解   作者: 阮一峰 一.概述 除了正常运行模式,ECMAscript 5添加了第二种运行模式:"严格模式"(strict m ...

  5. [转]javascript console 函数详解 js开发调试的利器

    javascript console 函数详解 js开发调试的利器   分步阅读 Console 是用于显示 JS和 DOM 对象信息的单独窗口.并且向 JS 中注入1个 console 对象,使用该 ...

  6. javascript 节点属性详解

    javascript 节点属性详解 根据 DOM,html 文档中的每个成分都是一个节点 DOM 是这样规定的:整个文档是一个文档节点每个 html 标签是一个元素节点包含在于 html 元素中的文本 ...

  7. (" use strict")Javascript 严格模式详解

    Javascript 严格模式详解 转载别人的博客内容,浏览了一遍,没有全部吸收,先保存一下链接 http://www.ruanyifeng.com/blog/2013/01/javascript_s ...

  8. 【转载】MyBatis JdbcType 与Oracle、MySql数据类型对应关系详解

    [原文链接]:MyBatis JdbcType 与Oracle.MySql数据类型对应关系详解 1. Mybatis JdbcType与Oracle.MySql数据类型对应列表 2. Mybatis ...

  9. 【HANA系列】SAP HANA XS使用JavaScript数据交互详解

    公众号:SAP Technical 本文作者:matinal 原文出处:http://www.cnblogs.com/SAPmatinal/ 原文链接:[HANA系列]SAP HANA XS使用Jav ...

随机推荐

  1. hdu 质方数

    Problem Description   小明天生对数字比较敏感,3岁的时候就能背诵圆周率一百位. 现在,小明慢慢长大了,但依然很喜欢数字,最近,他迷上了质数和平方数,并且自己把质数的平方命名为“质 ...

  2. Android入门——电话拨号器和4种点击事件

    关于HelloWorld为,电话拨号程序还AndroidA入门demo,从这个样例我们要理清楚做安卓项目的思路. 大体分为三步: 1.理解需求,理清思路 2.设计UI 3.代码实现 电话拨号器 1.  ...

  3. java OutOfMorryError (replaceAll)

    最近在使用string类中的replaceAll函数时碰到这个错误,由于string长度比较长,文本文档9M多,可以增加jvm的内存大小解决. 下面是一篇对OutOfMorryError错误的一些处理 ...

  4. java web.xml listener servlet 和filter加载顺序

    在该项目中总会遇到一些关于加载的优先问题.最近遇到了同样的类别似的,所以,如果你发现信息汇总下,以下是转载其他一些人,毕竟,人们写的不错.它不重复创建的轮.只是略作修改自己的观点. 首先能够肯定的是, ...

  5. git合并远端分支到本地分支的两种方式

    作者:zhanhailiang 日期:2014-11-21 在使用版本号工具提交改动之前,都须要通过update先将本地代码更新到最新版本号.SVN通过svn update就能够实现,那么git怎样实 ...

  6. Unity3D-RPG项目实战(3):整合Visual Studio 2013开发环境

    古人云:工欲善其事必先利其器,IDE尽管属于一个非常上层的工具,可是一个好的IDE对工作效率提高还是非常大的. 事实上我还是满想用一下官方推荐的Mono,毕竟跨平台如今还是非常重要的一个特性.尝试了这 ...

  7. href 做导航 特效

    <div> <div> <%for (int i = 0; i < 200; i++) { %><%=i.ToString() %> <br ...

  8. RF1001: 各浏览器对 '@font-face' 规则支持的字体格式不同,IE 支持 EOT 字体,Firefox Safari Opera 支持 TrueType 等字体

    http://w3help.org/zh-cn/causes/RF1001 http://blog.csdn.net/agileclipse/article/details/12450949 http ...

  9. 去掉UITableView HeaderView或FooterView随tableView 移动的黏性

    去掉UITableView HeaderView或FooterView随tableView 移动的黏性(sticky) 控制器中实现以下方法即可: - (void)scrollViewDidScrol ...

  10. 常见浏览器扩展开发笔记(chrome firefox 360 baidu qq sougou liebao uc opera)

    浏览器扩展开发貌似时下很冷门啊,但是不少企业还是有类似的应用,360的抢票插件啊,笔者最近在做的网页翻译扩展之类的.笔者在开发的过程中,遇到了不少坑,说是坑,说白了就是各个厂商支持的API不统一导致的 ...