ECMAScript - JS数据类型、数据类型转换（显示/隐式）

一、JS数据类型

1.基本数据类型

number string boolean null undefined

• number（包括Java里的int和float）
var x = 1;
var a = 3.14;
• string（包括Java里的char和string）
var a = ‘啦啦啦’;
• boolean
var a = true;
• null（空值，数据类型为object，JavaScript将null值看成了一个空对象指针）
• undefined（无值，数据类型为undefined）

console.log(null==undefined);//true，==只需要值相等
console.log(null===undefined);//false,===需要数据类型和值都相等

//以下两种方法判断x是否为null
var x = null;
if (!x && typeof x != "undefined" && x != 0){
    console.log("x is null");
}
//!x为true时，x有可能为null、undefined、数字0、false
//typeof x != "undefined"排除undefined
//x != 0排除数字0和false
if (x === null){
    console.log("x is null");
}

2.引用数据类型

array object function date RegExp
• Object（广义） 包括 object（狭义）array function Date RegExp

1.object

var person = {
// 属性名/键名：属性值/键值
name:"jacky",
weight:105,
job:"student"
}
console.log(person.name); // jacky
person.name = 'Jessie'//重新赋值

2.array

var arr = [1, 2, 3, 4];
console.log(arr[3]);//取值 索引从0开始
arr[3] = 1;//赋值
console.log(arr.length);//打印长度
//遍历
for(var i = 0; i < arr.length; i++){
console.log(arr[i]);
}

• 数组是一种特殊的对象，只不过键名只能是有序整数(0，1，2……)
• JavaScript规定对象的键名一律为字符串，所以，虽然数组是用a[i]的形式读取，但数字i已被隐形转为字符串。

var arr = ['a', 'b', 'c'];
arr[0] // 'a'
arr['0'] // 'a'

• 由于数组是对象，可以往数组中加入其他类型的键名，但不会算入length里

var a = [];
a['p'] = 'abc';
a.length // 0
a[2.1] = 'abc';
a.length // 0

• 由于JavaScript是动态语言，所以数组的值可以是不同数据类型

var arr = [
  {a: 1},
  [1, 2, 3],
  function() {return true;}
];
arr[0];//{a: 1}
arr[1];//[1, 2, 3]
arr[2];//ƒ () {return true;}

3.栈内存和堆内存

1.原始类型值储存在栈内存中（先进后出），数据是永久保存不可改的

var a = 3;// 开辟一块空间，命名为a，在a空间中储存 3
var b = a; // 开辟一个空间，命名为b，在a空间中取到值，拷贝到b空间中
a = 1;// 不会修改原来的a空间，而是会把这个空间里之前的a名字抹掉，重新开辟一个新空间命名为a，储存1
//原来的3依然在，只是不再对应a变量。

2.引用类型值存在栈内存，储存的是对象地址，指向的对象值存在堆内存中

var arr1 = [1, 2, 3];//在栈内存中声明一个空间arr1，在堆内存中储存值，栈内存的空间中储存的是堆内存中的地址
var arr2 = arr1;// 在栈内存中声明一个空间arr2 在arr1的空间中取到值（也就是地址），拷贝到arr2中，所以在调用arr1和arr2的时候都是指向同一个地址，值是完全相同的
var arr1 = [1, 2];
// 在栈内存中声明一个新空间arr1，在新的arr1的空间中储存新的对象地址，这时候调用arr1 和arr2分别指向不同的地址所以值也不相同

二、数据类型转换

1.typeof()

typeof()可打印的数据类型包括：
基本类型 number string boolean undefined
引用类型 object (object、array、null的type都返回object)
函数 function

console.log(typeof(123)); //number
console.log(typeof('123'));//string
console.log(typeof(true));//boolean
console.log(typeof({}));// Object
console.log(typeof([]));// Object
console.log(typeof(null));// Object
console.log(typeof(undefined));// undefined
console.log(typeof(function(){}));// function
console.log(typeof("1" + "1"))//string
console.log(typeof("1" - "1"));//number

• 当变量a未声明时，直接打印会报错
• 打印typeof(a)会输出"undefined"
• 打印typeof(typeof(a))会输出"string"

// console.log(a)//未声明 a 报错
console.log(typeof(a));//undefined
console.log(typeof(typeof(a)));//string  typeof()输出的是字符串
console.log(typeof(NaN));//number

2.显式类型转换

Number()

• true -> 1; false -> 0; “” ->0; “true” -> NaN;
• null -> 0; undefined -> NaN;
• “3.14” -> 3.14; “123” -> 123;

var a1 = true;
typeof(Number(a1)) + "|" + Number(a1);//number|1
var a2 = "true";
typeof(Number(a2)) + "|" + Number(a2);//number|NaN
var a3 = null;
typeof(Number(a3)) + "|" + Number(a3);//number|0
var a4 = undefined;
typeof(Number(a4)) + "|" + Number(a4);//number|NaN
var a = "123";
typeof(Number(a)) + "|" + Number(a);//number|123
var a5 = "3.14";
typeof(Number(a5)) + "|" + Number(a5);//number|3.14
var a6 = "1a";
typeof(Number(a6)) + "|" + Number(a6);//number|NaN

parseInt(string, radix)

• 解析一个字符串并返回指定基数的十进制整数， radix是2-36之间的整数，表示基数。
• string是要被解析的值。如果参数不是字符串，则隐式转换为字符串(调用ToString)。字符串开头的空白符将会被忽略。
• 何时返回NaN：当radix小于2或大于36时；当string的第一个非空字符串不是数字时。
• 如果string中有字母、或超出radix进制的数字，parseInt将忽略该字符以及后续字符

var a1 = "true";
typeof(parseInt(a1)) + "|" + parseInt(a1);//number|NaN
var a2 = true;
typeof(parseInt(a2)) + "|" + parseInt(a2);//number|NaN
var a3 = null;
typeof(parseInt(a3)) + "|" + parseInt(a3);//number|NaN
var a4 = undefined;
typeof(parseInt(a4)) + "|" + parseInt(a4);//number|NaN
var a = "123";
typeof(Number(a)) + "|" + Number(a);//number|123
var a5 = "3.14";
typeof(parseInt(a5)) + "|" + parseInt(a5);//number|3 直接扔掉小数点
var a6 = "1a";
typeof(parseInt(a6)) + "|" + parseInt(a6);//number|1

parseInt("123abc")//123
parseInt("abc123")//NaN
parseInt("b2",14);//156   11*14^1+2*14^0 = 156
parseInt("b2",3)// NaN
parseInt("133",3)// 1   1*3^0 = 1 对于超出radix进制的数字会直接舍弃

parseFloat(string)

• 如果string中有正号（+）、负号（- ）、数字（0-9）、小数点（.）、科学记数法中的指数（e 或 E）以外的字符，则会忽略该字符以及之后的所有字符

var a = "3.1415926";
typeof(parseFloat(a)) + "|" + parseFloat(a);//number|3.1415926
//.toFixed(n) 保留小数点后n位 (4舍5入)
parseFloat(a).toFixed(2);//3.14

String() .toString()

• String() 是 JavaScript 的全局函数；toString() 是 Object 原型上的一个方法。
• String() 可以将 null, undefined 转化为字符串；而 toString()不可以。【原因：.toString()是对象上的方法，number/string/boolean都有对应的包装类，但null和undefined没有】

String(null)
// "null"
String(undefined)
// "undefined"
null.toString()
// Uncaught TypeError: Cannot read property 'toString' of null
undefined.toString()
// Uncaught TypeError: Cannot read property 'toString' of undefined

• String()只支持转为普通字符串；
• Number.toString(radix)可以将一个Number对象转换radix对应进制的字符串

var num = 2;
num.toString(num, 2);// "10"

• 整数.toString()报错的问题：
JS引擎在解释代码时，对于1.toString()认为第一个.是浮点符号；第二个为属性访问的语法
所以 1…toString()正常；而 (1).toString() 排除了小数点的影响所以也为正常；

1.toString() // Uncaught SyntaxError: Invalid or unexpected token
(1).toString() // "1"
1..toString() // "1"

Boolean()

• undefined null 0 “” false NaN 判断为false；其他都是true
• 注意：任何对象都会判断为true，包括false对象

var x = new Boolean(false);
// typeof(x) = object
if (x) {
  console.log("判断为true");  //此句会输出
}

var y = Boolean(NaN);
// typeof(y) = boolean
if (y) {
  console.log("判断为true");  // 此句不会输出
}

3.隐式类型转换

+、-、*、/、%、自增、自减、

（1）+ 运算中只要有一个字符串，就会将字符串后面的数字转成string；
（2）自增/自减、* 、/、 -、 % 一律将字符串转换成number 或 NaN

比较运算符

（1）>、 <、 <=、 >=、 ==、 != 中，只要有一边是number，就会将另一边的string隐式转换成number或 NaN，再比较；如果两边都是string，则都转换成ASCⅡ码，再比较（‘4.5’ > ‘11’ 为true）
（2）undefined 和 null 既不大于0 也不小于0 也不等与0（虽然Number(null)==0为true，但是null == 0为false）
（3）===中，不会进行隐式类型转换

+、-号

在值前加正号(+)或负号(-)会隐式转换成number或NaN

-"";//-0
-"abc";//NaN
-false;//-0
-true;//-1
-null;//-0
-undefined;//NaN
-null == 0;//true
null == 0;//false

isNaN()

isNaN(thing)函数中，会先对thing做Number()隐式转换，再判断是否为NaN

练习题1

var a = "123"; 
a++;先Number(a) 再自增
console.log(a);//124

var a = "a" + 1; //String(1)
console.log(a);//a1

var a = "3" * 2; //Number(3)
console.log(a);//6

// * / - % 都会将string转换成number
var a = "1" > 2; //false
var a = 100 > "a";// false  Number("a")=NaN
var a = "b" > "a";// true
var a = 1 == "1"; // true
var a = 1 != "2"; //true
var a = 1 === "1"; //false  不进行隐式转换

var a = NaN == NaN; //false,NaN不等于任何值，包括它自己
var a = NaN === NaN; //false

var a1 = 2 > 1 > 3; //false  比较运算符从左往右，2>1结果为true true>3结果为false（true被转换成1）
var a2 = 2 > 1 == 1; //true

var a = "123";
console.log(+a);//str -> number  123
var a = "123";
console.log(-a);//str -> number  -123

undefined == null //true
undefined === null //false

console.log(isNaN(NaN));//true
console.log(isNaN("a"));//true 先Number("a")=NaN
console.log(isNaN(null));//false 先Number(null)=0
console.log(isNaN(undefined));//true 先Number(undefined)=NaN
console.log(isNaN("123"));//false

练习题2

var a = false + 1;//number(false) = 0+1
console.log(a);//1

var b = false == 1;
console.log(b);//false

if (typeof(a) && (-true) + (+undefined) + ""){
console.log('通过了') // 输出 '通过了'
}else{
console.log("没通过")
}
// typeof(a) ->"undefined" -> true，&&遇到真往后走
//  (-true) + (+undefined) + "" =>-1 + NaN + ""->"NaN"->true