前言

  ECMAScript中有5种数据类型,分别为Number,Boolean,Null,UndifinedString,以及一种复杂的数据类型Object(由名值对组成,是这门语言所有对象的基础类型).后来 ES6又添加了一种新的数据类型 Symbol(只存在于ES6).

  复杂的数据类型Object 类型,即引用类型,细分的话,有:Object 类型Array 类型Date 类型RegExp 类型Function 类型 等。后 ES6又添加了 SetIterator 两种新的数据类型。 ES6 更多新的知识 可以看看 阮一峰 老师的博文 《ESCMScript6入门》

  ECMAScript是松散类型,是弱类型语言。

基础

  先看看值类型和引用类型的区别;

var a=10;
var b=a; a++;

  基本类型是不可变的,基本类型在赋值操作后,两个变量是相互不受影响的

var a={ value: 10; };
var b=a;
a.vaule++;

 引用类型的赋值其实是对象保存在栈区地址指针的赋值,因此两个变量指向同一个对象,任何的操作都会相互影响。

类型检测

  在使用算术运算符时,运算符两边的数据类型可以是任意的,比如,一个字符串可以和数字相加。之所以不同的数据类型之间可以做运算,是因为JavaScript引擎在运算之前会悄悄的把他们进行了隐式类型转换的,如下是数值类型和布尔类型的相加:

  因此,有时候会发生 类型错误有可能会被类型转换所隐藏 等情况,所以我们要进行类型检测。

1.typeof 操作符 :经常用来检测一个变量是不是最基本的数据类型

var str='abc';
typeof(str); // 'string'
typeof str; // 'string'
typeof 92; // 'number'
typeof true; // 'boolean' typeof a; // "undefined" 未声明的变量 a 或者 声明后未初始化的变量 a typeof null;// 'object'

 注意点:

  ① 特殊值 null 会被当成空的对象引用,因此会返回 'object'

  ② undefined 派生自 null ,所以 进行弱相等特性检测时会返回 true

null==undefined ;    // true
null===undefined; // false
  • = = : 只进行值的比较

  • = = = : 不仅进行值得比较,还要进行数据类型的比较

  所以,上面  null==undefined 时,进行了数据类型的隐式类型转换,结果返回 true 。

typeof /\w/ ; // "object"

  ③ Safari 5 及之前和 chrome 7 及其之前,对于typeof 正则表达式 会返回‘function’,其他返回 ‘object’

2. instanceof 操作符 :用来判断某个构造函数的 prototype 属性所指向的对象是否存在于另外一个要检测对象的原型链上

({}) instanceof Object              // true
([]) instanceof Array // true
(/aa/g) instanceof RegExp // true
(function(){}) instanceof Function // true

再看下面这个例子

 function SuperType(){
}
function SubType(){
} SubType.prototype=new SuperType(); var instance= new SubType();
instance instanceof SuperType; // true
10 instance instanceof SubType; // true

通过 SubType构造函数创建了 instance 实例,因此

instance.__proto__ == SubType.prototype

又由于

SubType.prototype=new SuperType();

因此, instance instanceof SuperType; // true

3. 安全的类型检测

  在任何值上调用 Object的原生方法 toString(),会返回一个 [object NativeConstructorName]的字符串,根据这一点我们可以检测原生javascript对象,注意开发人员自定义的任何构造函数都会返回 [object Object];

Object.prototype.toString.call(value);

基于这一思路我们可以创建

function isArray(value){
if(typeof Array.isArray=='function'){
return Array.isArray(value);
}
return Object.prototype.toString.call(value)=="[object Array]";
}

检测原生函数和正则表达式:

function isFunction(value){
return Object.prototype.toString.call(value)=="[object Function]";
}
function isRegExp(value){
return Object.prototype.toString.call(value)=="[object RegExp]";
}

 结束语

  以上总结了js类型检测的基本方法,以及简单的介绍了基础类型和引用类型。javascript本就是弱类型语言,如果真的很纠结数据类型的话,不妨可以去看看 TypeScript .

JavaScript 类型 检测的更多相关文章

  1. 谈谈JavaScript类型检测

      javascript内置的类型检测机制并非完全可靠.比如typeof操作符,并不能准确的判断数据是哪个类型,比如:数组和对象就不能通过typeof来区分. typeof [] ==="o ...

  2. Javascript类型检测

    原地址 http://www.cnblogs.com/fool/archive/2010/10/07/javascrpt.html 开门见山,我们先来看一下代码: var is = function ...

  3. javascript 类型检测

    javascript数据类型分为简单数据类型和复杂数据类型.简单数据类型分为string,number,boolean,defined,null,复杂数据类型为Object.类型检测在写代码可能会非常 ...

  4. JavaScript类型检测汇总

        曾经我以为JavaScript中的类型检测只要使用 typeof 或 instanceof 就可以通通解决.后来我发现我是too young too naive啊!早说过JavaScript是 ...

  5. JavaScript类型检测, typeof操作符与constructor属性的异同

    *#type.js function Person(name, age) { this.name = name; this.age = age; } var d = {an: 'object'}; v ...

  6. JavaScript——类型检测

    要检测一个变量是否是基本数据类型,可以用 Typeof 操作符.如果我们想知道它是什么类型的对象,我们可以用instanceof 操作符,语法如下所示: result=variable instanc ...

  7. javascript类型与类型检测

    1.javascript类型: 注:包装对象:如"hello".length实际为js为我们隐式创建了一个String临时对象,去调用该对象的length属性,调用过后再将该临时对 ...

  8. 小结 javascript中的类型检测

    先吐槽一下博客园的编辑器,太不好用了,一旦粘贴个表格进来就会卡死,每次都要用html编辑器写,不爽! 关于javascript的类型检测,早在实习的时候就应该总结,一直拖到现在,当时因为这个问题还出了 ...

  9. JavaScript的三种类型检测typeof , instanceof , toString比较

    1.typeof typeof是js的一个操作符,在类型检测中,几乎没有任何用处. typeof 返回一个表达式的数据类型的字符串,返回结果为javascript中的基本数据类型,包括:number. ...

随机推荐

  1. Badboy - 从excel中读取数据

    参考: http://leafwf.blog.51cto.com/872759/1119161 http://www.51testing.com/html/00/130600-1367743.html ...

  2. Badboy录制模式

    参考: http://leafwf.blog.51cto.com/872759/1109940 http://www.51testing.com/html/00/130600-1367743.html ...

  3. Codefroces 366 D Dima and Trap Graph (最短路)

    Dima and Trap Graph 题意:Dima和Inna越来越喜欢对方,但是Dima的室友缺很没有热情出去玩,然后Dima就把他室友Seryozha骗进了陷阱里.现在Seryozha想要从陷阱 ...

  4. hdu Sumsets

    Farmer John commanded his cows to search for different sets of numbers that sum to a given number. T ...

  5. 前后端分离,获取token,验证登陆是否失效

    maven依赖 <dependency> <groupId>com.auth0</groupId> <artifactId>java-jwt</a ...

  6. 了解css中px、em、rem的区别并使用Flexible实现vue移动端的适配

    本人java菜鸟一名,若有错误,还请见谅. 1.px和em和rem的定义和区别 px:px像素,是相对单位,相对于屏幕的分辨率而言,也就是说,当屏幕的分辨率不同那么px相同,实际看到的大小也会不同. ...

  7. Python 之父的解析器系列之六:给 PEG 语法添加动作

    原题 | Adding Actions to a PEG Grammar 作者 | Guido van Rossum(Python之父) 译者 | 豌豆花下猫("Python猫"公 ...

  8. charles 发布Glist

    本文参考:charles 发布Glist Publish Gist /发布代码段 选中某个文件,点击Publish Gist,如果你没有github,这个文件将被匿名发布,您也就无法删除它: 当然你可 ...

  9. 你好,C语言

    对于我来说,C语言就和陌生人一样,对他完全不了解,更不要提什么C++了,这就要我主动和他打招呼,深入认识了解它了哈.目前对于C语言的理解,只知道他的的功强大,能操作硬件,编写各类驱动,强悍的LINUX ...

  10. TestNG(五) 5-7 套件测试

    <?xml version="1.0" encoding="utf-8" ?> <suite name="test"> ...