前言:在前端开发中经常会需要用到检测变量数据类型的需求,比如:判断一个变量是否为undefined或者null来进行下一步的操作,今天在阅读“编写高质量代码-改善JavaScript程序的188个建议”这本书的时候看到这个比较好的方法,在此小记一笔以备在以后的开发中使用。

1:如下所示是我编写的演示代码

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8"/>
  5. <title>Index Page</title>
  6. <script type="text/javascript">
  7. /*
  8. 安全检测JavaScript基本数据类型和内置对象
  9. @param:o表示检测的值
  10. @return:返回字符串'undefined','number','boolean','string','function','regexp','array','date','error','object','null'
  11. */
  12. function typeOf(o)
  13. {
  14. //获取Object对象默认的toString()方法的引用,因为要获取对象的class值的唯一方法是调用Object对象定义的默认toString()方法,不同对象都会预定义自己的toString()方法,转换的逻辑各不相同
  15. var _toString=Object.prototype.toString;
  16. //列举基本数据类型和内置对象类型,可以进一步补充该数组的检测数据类型范围
  17. var _type= {
  18. 'undefined' : 'undefined',
  19. 'number' : 'number',
  20. 'boolean' : 'boolean',
  21. 'string' : 'string',
  22. '[object Function]' : 'function',
  23. '[object RegExp]' : 'regexp',
  24. '[object Array]' : 'array',
  25. '[object Date]' : 'date',
  26. '[object Error]' : 'error'
  27. }
  28. //返回对应的数据类型或者内置对象的字符串表示
  29. return _type[typeof o] || _type[_toString.call(o)] || (o ? 'object' : 'null');
  30. }
  31. /*
  32. 测试方法
  33. */
  34. (function testTypeOf()
  35. {
  36. var obj={'name':'godtrue'},
  37. num=1,
  38. str='hello',
  39. boo=true,
  40. abs=Math.abs,
  41. dat=new Date(),
  42. arr=new Array(),
  43. err=new Error(),
  44. reg=new RegExp();
  45.  
  46. console.info(typeOf(obj));
  47. console.info(typeOf(num));
  48. console.info(typeOf(str));
  49. console.info(typeOf(boo));
  50. console.info(typeOf(abs));
  51. console.info(typeOf(dat));
  52. console.info(typeOf(arr));
  53. console.info(typeOf(err));
  54. console.info(typeOf(reg));
  55. console.info(typeOf(null));
  56.  
  57. console.info('【author:godtrue】');
  58. })();
  59.  
  60. </script>
  61. </head>
  62. <body bgcolor="AliceBlue" align="center">
  63. <p style="color:red;">
  64. 注意:上述方法适用于JavaScript基本数据类型和内置对象,而对自定义对象是无效的。这是因为自定义对象被转换为字符串后,返回值是没有规律的,而且不同的浏览器的返回值也是不同的。因此,要检测费内置对象,只能够使用constructor属性和instaceof运算符来实现。
  65. </p>
  66. </body>
  67. </html>

2:如下所示是演示代码的执行效果,以及注意事项

3:小结

代码中需要注意的地方已在注释中标明,代码整体上也非常简单就简简单单三句话,不过这个方法还是比较有用的,我相信在今后的项目中也会使用的到的。根据我以往的经验,判断一个对象或者变量“非空与否”,“定义未定义与否”是最为常见,此方法具有一定的通用性的,也可以根据自己的需要进行再扩展。

另外,昨天我突然间发现自己的博文,被有些网站私自的转载并且没有注明文章来自博客园,将作者的信息也全部的抹去了,这样我觉得不太好,虽然,我写博客的目的是为了记录自己的技术积累和感想,主要以备自己将来的使用,也非常乐意让其他需要者参看或转载,不过请尊重他人的劳动付出,至少标明一下文章的出处!

JS-安全检测JavaScript基本数据类型和内置对象的方法的更多相关文章

  1. JavaScript (内置对象及方法)

    JavaScript中的对象分为3种:内置对象.浏览器对象.自定义对象 JavaScript 提供多个内置对象:Math/Array/Number/String/Boolean... 对象只是带有属性 ...

  2. 你不知道的JavaScript(五)内置对象模版

    尽管JavaScript中有对象的概念,但一般我们并不说JavaScript是面向对象的编程语言,因为它不具备面向对象的一些最基本特征. 在c++/Java等这些面向对象的编程语言中,我们要定义一个对 ...

  3. javascript的优缺点和内置对象

    1)优点:简单易用,与Java有类似的语法,可以使用任何文本编辑工具编写,只需要浏览器就可执行程序,并且事先不用编译,逐行执行,无需进行严格的变量声明,而且内置大量现成对象,编写少量程序可以完成目标: ...

  4. javaScript中Math内置对象基本方法入门

    概念 Math 是javaScript的内置对象,包含了部分数学常数属性和数学函数方法. Math 不是一个函数对象,用户Number类型进行使用,不支持BigInt. Math 的所有属性与方法都是 ...

  5. JS高级——扩展内置对象的方法

    基本概念 内置对象有很多,几个比较重要的:Math.String.Date.Array 基本使用 1.内置对象创建出来的对象使用的方法使用的其实都是内置对象的原型对象中的方法 (1)a并没有charA ...

  6. jsp内置对象的方法

    JSP内置对象的方法:out:out.print();request:request对象主要用于出列客户端请求.   常用方法:    String getParameter(String name) ...

  7. python 之 前端开发( JavaScript变量、数据类型、内置对象、运算符、流程控制、函数)

    11.4 JavaScript 11.41 变量 1.声明变量的语法 // 1. 先声明后定义 var name; // 声明变量时无需指定类型,变量name可以接受任意类型 name= " ...

  8. JavaScript 核心参考教程 内置对象

    这个标准基于 JavaScript (Netscape) 和 JScript (Microsoft).Netscape (Navigator 2.0) 的 Brendan Eich 发明了这门语言,从 ...

  9. javascript:面向对象和常见内置对象及操作

    本文内容: 面向对象 常见内置对象及操作 首发日期:2018-05-11 面向对象: JavaScript 是面向对象的编程语言 (OOP).OOP 语言使我们有能力定义自己的对象和变量类型. 对象是 ...

随机推荐

  1. Linux下搭建FTP服务器

    实习的公司有一台老服务器转作为FTP服务器,老大把这个任务交给了我.这两天边学边卖的捣腾起来,总算搞成.现在记录下来,加深映像,也以便以后查看复习. 服务器安装的是:Red Hat Enterpris ...

  2. java 运算符使表达式结果类型自动提升

    1.表达式中的自动类型提升: 表达式求值时,Java自动的隐含的将每个byte.short或char操作数提升为int类型,这些类型的包装类型也是可以的. 例如:short s1 = 1; s1 = ...

  3. PSP第九周

    一.表格 C(分类) C(内容) S(开始时间) ST(结束时间) I(打断时间) △(净工作时间) 学习 UML 12:30 13:20 0 50 编码 编码 20:00 22:10 0 130 学 ...

  4. DP(Dynamic programming)——尽力学习之中(2016 HUAS ACM 暑假集训-5)

    这周不打算按照以往的方式更新博客,而是采用整体的方式.一是因为学的太少,没东西写:二是这篇博客会经常更新的.如题,DP——尽力学习之中. ------------------------------- ...

  5. 命名空间System.Threading命名空间的同步锁 Monitor类

    官方备注: Monitor类通过向单个线程授予对象所来控制对对象的访问.对象所提供限制访问代码块的能力.当一个线程拥有对象的锁时,其他任何线程都不能获取该锁.还可以使用Monitor来确保不会允许其他 ...

  6. jQuery高级编程

    jquery高级编程1.jquery入门2.Javascript基础3.jQuery核心技术 3.1 jQuery脚本的结构 3.2 非侵扰事JavaScript 3.3 jQuery框架的结构 3. ...

  7. C++引用详解

    引用的概念 引用:就是某一变量(目标)的一个别名,对引用的操作与对变量直接操作完全一样. 引用的声明方法:类型标识符 &引用名=目标变量名: 如下:定义引用ra,它是变量a的引用,即别名. i ...

  8. ThinkPHP中的动态缓存(S方法)和快速缓存(F方法)

    系统默认的缓存方式是采用File方式缓存,我们可以在项目配置文件里面定义其他的缓存方式,例如,修改默认的缓存方式为Xcache(当然,你的环境需要支持Xcache)    对于File方式缓存下的缓存 ...

  9. 【svn】svn 项目地址修改

    1.IDEA修改 确定OK. 2.TortoiseSVN修改 选择项目目录右键->TortoiseSVN->重新定位(Relocate),然后修改URL, 3.Mac OS或Linux客户 ...

  10. Microsoft Visual Studio 2012注册密钥

    Microsoft Visual Studio Ultimate 2012 旗舰版 有效注册密钥:YKCW6-BPFPF-BT8C9-7DCTH-QXGWCMicrosoft Visual Studi ...