JavaScript 数据类型
一:简介
再提数据类型是因为其与操作符结合、以及如何判断一个变量是哪种类型时会有一些容易让人疑惑的地方、比如数据类型与操作符组合之后的结果有时候并不是我们想象的那样。再比如=、== 与===有什么区别。
二:隐式转换
下面的测试可以通过chrome浏览器的开发者模式(按F12调出)的console中直接输入、回车后再输入相应的变量名就可以很直观的看到结果。
JavaScript中比较两个数据是否相同可以使用“==”或者“===”。前者在比较时如果两个数据类型不同、则会做一定转换再比较。后则为绝对相等、如果相比较的两个对象类型不同则直接返回false。
隐式转换见于两个相比较对象对比时。
-
a===b:
-
类型不同直接返回false、
-
类型相同再进一步比较值是否相同、需要注意的是:如果是对象比较、JavaScript比较的是两个对象的引用是否为同一引用、是则为true、否则为false。
-
null === null、undefined === undefined、NaN != NaN、new Object != new Object.
-
a==b :
-
类型相同、与a===b等价。
-
类型不同
-
null与undefined相等
-
number与String相比时String转换成number
-
Boolean与其他相比时、true转换成1 false转换成0.但是如果是先定义一个变量值为 1 再与true做对比则结果为false。
-
object与其他相比时、object转为基本类型、其他false。
-
-
example:
var str1 = '12.5';
var num1 = 12.5;
console.info("str1 + num1 : " + (str1 + num1));
console.info("str1 - num1 : " + (str1 - num1));
console.info("str1 * num1 : " + (str1 * num1));
console.info("str1 / num1 : " + (str1 / num1));
console.info("=========================================\r\n");
// string number interconversion
var strFromNum = 12.5 + "";
console.info("strFromNum type : " + typeof strFromNum);
var numFromStr = '12.5' - 0;
console.info(("numFromStr type : " + typeof numFromStr));
console.info("=========================================\r\n");
// == example
var str2 = '25.0';
var str3 = new String('25.0');
var num2 = 25.0;
var num3 = 0;
var num4 = 1;
var booTrue = true;
var booFalse = false;
var arr1 = [1, 2];
var arr2 = [1, 2];
console.info("str2 == str3 : " + (str2 == str3));
console.info("str2 == num2 : " + (str2 == num2));
console.info("str3 == num2 : " + (str3 == num2));
console.info("booTrue == num3 : " + (booTrue == num3));
console.info("booFalse == num4 : " + (booFalse == num4));
console.info("booTrue == 1 : " + (booTrue == 1));
console.info("booFalse == 0 : " + (booFalse == 0));
console.info("arr1 == arr2 : " + (arr1 == arr2));
console.info("null == undefined : " + (null == undefined));
console.info("NaN == NaN : " + (NaN == NaN));
console.info("=========================================\r\n");
// === example
console.info("str2 === str3 : " + (str2 === str3));
console.info("str2 === num2 : " + (str2 === num2));
console.info("str3 === num2 : " + (str3 === num2));
console.info("booTrue === num3 : " + (booTrue === num3));
console.info("booFalse === num4 : " + (booFalse === num4));
console.info("booTrue === 1 : " + (booTrue === 1));
console.info("booFalse === 0 : " + (booFalse === 0));
console.info("arr1 === arr2 : " + (arr1 === arr2));
console.info("null === undefined : " + (null === undefined));
console.info("NaN === NaN : " + (NaN === NaN));
console.info("=========================================\r\n");
三:类型检测
JavaScript中可以通过一下几种方式来判断一个数据的类型:typeof、instanceof、Object.prototype.toString、constructor、duck type.
1.typeof:
a)适用于判断基本类型和函数类型。
b)typeof null结果为“Object”。
c)typeof判断数组、输出结果为Object。
example:
/*
要点:
1. 基本类型没有属性、方法
2. 调用基本类型会产生临时包装对象、调用完成之后包装对象就被消耗、此时再想获取基本类型的伪属性就会返回undefined。
*/
var str4 = 'alien';
console.info("str4.length : " + str4.length);
console.info("str4.p : " + (str4.p = 'star'));
console.info("str4.p : " + str4.p);
console.info("=========================================\r\n");
console.info("typeof 1: " + typeof 1);
console.info("typeof '1': " + typeof '1');
console.info("typeof boolean: " + typeof false);
console.info("typeof null: " + typeof null);
console.info("typeof undefined: " + typeof undefined);
console.info("typeof [1, 2]: " + typeof [1, 2]);
console.info("typeof Math: " + typeof Math);
function fun (){}
console.info("typeof fun: " + typeof fun);
console.info("typeof NaN: " + typeof NaN);
console.info("=========================================\r\n");
2.instanceof
a)适用于判断被检测类型属于哪种对象类型——obj instanceof Object;
b)其左边的运算数是一个对象,右边的运算数是对象类的名字或构造函数。如果 object 是 class 或构造函数的实例,则 instanceof 运算符返回 true。如果 object 不是指定类或函数的实例,或者 object 为 null,则返回false。
c)instanceof 不能跨iframe使用!不同iframe中创建的对象不会共享一个prototype。
example:
console.info("[1, 2] instanceof Array : " + [1, 2] instanceof Array);
function Person(){}
function Student(){}
Student.prototype = new Person();
Student.prototype.constructor = Student;
var alien = new Person();
console.info("alien instanceof Person : " + alien instanceof Person);
var student = new Student();
console.info("student instanceof Person : " + student instanceof Person);
console.info("=========================================\r\n");
3.Object.prototype.toString.apply();
通过对象的prototype判断其具体类型、可用于判断数组类型
example:
Object.prototype.toString.apply([]); //"[object Array]"
Object.prototype.toString.apply(function(){}); //"[object Function]"
Object.prototype.toString.apply(Math); //"[object Math]"
Object.prototype.toString.apply(new Person()); //"[object Object]"
Object.prototype.toString.apply(null); //"[object Null]"
Object.prototype.toString.apply(NaN); //"[object Number]"
Object.prototype.toString.apply('alien'); //"[object String]"
Object.prototype.toString.apply(undefined); //"[object Undefined]"
console.info("=========================================\r\n");
-
constructor 、通过构造器判断类型、constructor可以被改写、不经常用
-
duck type 鸭子类型、通过类型特有属性或者方法来判断数据类型、如判断一个数据类型是否是数组可以查看此数据是否有length属性等。
四:总结
typeof:适合基本类型和function检测、遇到null则失效。
Object.prototype.toString.applay()判断。
instancof:适合自定义对象、也可以用来检测原生对象、在不同iframe和window之间失效。
后两种不常用、视情况而定。
五:补充
测试结果:
/*
* Result :
str1 + num1 : 12.512.5
str1 - num1 : 0
str1 * num1 : 156.25
str1 / num1 : 1
=========================================
strFromNum type : string
numFromStr type : number
=========================================
str2 == str3 : true
str2 == num2 : true
str3 == num2 : true
booTrue == num3 : false
booFalse == num4 : false
booTrue == 1 : true
booFalse == 0 : true
arr1 == arr2 : false
null == undefined : true
NaN == NaN : false
=========================================
str2 === str3 : false
str2 === num2 : false
str3 === num2 : false
booTrue === num3 : false
booFalse === num4 : false
booTrue === 1 : false
booFalse === 0 : false
arr1 === arr2 : false
null === undefined : false
NaN === NaN : false
=========================================
str4.length : 5
str4.p : star
str4.p : undefined
typeof 1: number
typeof '1': string
typeof boolean: boolean
typeof null: object
typeof undefined: undefined
typeof [1, 2]: object
typeof Math: object
typeof fun: function
*/