By

JavaScript 中的数据类型

  • 基本数据类型
    • string
    • number
    • boolean
  • 复杂数据类型
    • Object
    • Function
    • Date
    • Array

在 js 中变量的声明很随便

var可以声明任意数据类型的变量

而且不同数据类型的变量可以赋值和转换

字符串转数字

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
var str1 = '123';
var str2 = '123.456';
var str3 = '123abc';
var str4 = 'abc123';
console.log(str1 + ' --- ' + typeof str1);  // => 123 --- string

console.log('-----+-----');
var a1 = str1 + 0;
console.log(a1 + ' --- ' + typeof a1);  // => 1230 --- string

console.log('-----------');
var b1 = str1 - 0;
var b2 = str2 - 0;
var b3 = str3 - 0;
var b4 = str4 - 0;
console.log(b1 + ' --- ' + typeof b1);  // => 123 --- number
console.log(b2 + ' --- ' + typeof b2);  // => 123.456 --- number
console.log(b3 + ' --- ' + typeof b3);  // => NaN --- number
console.log(b4 + ' --- ' + typeof b4);  // => NaN --- number

console.log('-----*-----');
var c1 = str1 * 1;
var c2 = str2 * 1;
var c3 = str3 * 1;
var c4 = str4 * 1;
console.log(c1 + ' --- ' + typeof c1);  // => 123 --- number
console.log(c2 + ' --- ' + typeof c2);  // => 123.456 --- number
console.log(c3 + ' --- ' + typeof c3);  // => NaN --- number
console.log(c4 + ' --- ' + typeof c4);  // => NaN --- number

console.log('-----/-----');
var d1 = str1 / 1;
var d2 = str2 / 1;
var d3 = str3 / 1;
var d4 = str4 / 1;
console.log(d1 + ' --- ' + typeof d1);  // => 123 --- number
console.log(d2 + ' --- ' + typeof d2);  // => 123.456 --- number
console.log(d3 + ' --- ' + typeof d3);  // => NaN --- number
console.log(d4 + ' --- ' + typeof d4);  // => NaN --- number

console.log('-----%-----');
var h1 = str1 % 1;
var h2 = str2 % 1;
var h3 = str3 % 1;
var h4 = str4 % 1;
console.log(h1 + ' --- ' + typeof h1);  // => 0 --- number
console.log(h2 + ' --- ' + typeof h2);  // => 0.45600000000000307 
--- number
console.log(h3 + ' --- ' + typeof h3);  // => NaN --- number
console.log(h4 + ' --- ' + typeof h4);  // => NaN --- number

console.log('-----Number-----');
var e1 = Number(str1);
var e2 = Number(str2);
var e3 = Number(str3);
var e4 = Number(str4);
console.log(e1 + ' --- ' + typeof e1);  // => 123 --- number
console.log(e2 + ' --- ' + typeof e2);  // => 123.456 --- number
console.log(e3 + ' --- ' + typeof e3);  // => NaN --- number
console.log(e4 + ' --- ' + typeof e4);  // => NaN --- number

console.log('-----parseInt-----');
var f1 = parseInt(str1);
var f2 = parseInt(str2);
var f3 = parseInt(str3);
var f4 = parseInt(str4);
console.log(f1 + ' --- ' + typeof f1);  // => 123 --- number
console.log(f2 + ' --- ' + typeof f2);  // => 123 --- number
console.log(f3 + ' --- ' + typeof f3);  // => 123 --- number
console.log(f4 + ' --- ' + typeof f4);  // => NaN --- number

console.log('-----parseFloat-----');
var g1 = parseFloat(str1);
var g2 = parseFloat(str2);
var g3 = parseFloat(str3);
var g4 = parseFloat(str4);
console.log(g1 + ' --- ' + typeof g1);  // => 123 --- number
console.log(g2 + ' --- ' + typeof g2);  // => 123.456 --- number
console.log(g3 + ' --- ' + typeof g3);  // => 123 --- number
console.log(g4 + ' --- ' + typeof g4);  // => NaN --- number
  • conclusion：
    • 在js中遇到 - 、* 、/ 、% 操作符时
    • js引擎会尝试着先将操作符两边的数据转换成number类型
    • 如果成功则进行相应的操作，如果不成功则NaN
    • 在使用Number函数进行字符串强制转换数字类型时
    • 无论是整数还是小数类型的字符串都会转换成相应的number类型
    • 字符串中含有除小数点之外的非数字字符时NaN
    • parseInt和parseFloat方法可以强制转换数字类型的字符串
    • 而且可以转换数字+字母("123abc")类型的字符串
    • 不过遇到字母+数字("abc123")就会NaN

数字转字符串

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
var num = 123.456;
var arr = [1, 2, 3];
console.log(num + '---' + typeof num);  // => 123.456---number
console.log(arr + '---' + typeof arr);  // => 1,2,3---object
console.log('------');

var a1 = num + '';
var a2 = num - '';
var a3 = arr + '';
var a4 = arr - '';
console.log(a1 + '---' + typeof a1);  // => 123.456---string
console.log(a2 + '---' + typeof a2);  // => 123.456---number
console.log(a3 + '---' + typeof a3);  // => 1,2,3---string
console.log(a4 + '---' + typeof a4);  // => NaN---number
console.log('------');

var b1 = String(num);
var b2 = String(arr);
console.log(b1 + '---' + typeof b1);  // => 123.456---string
console.log(b2 + '---' + typeof b2);  // => 1,2,3---string
console.log('------');

var c1 = num.toString();
var c2 = arr.toString();
console.log(c1 + '---' + typeof c1);  // => 123.456---string
console.log(c2 + '---' + typeof c2);  // => 1,2,3---string
  • conclusion：
    • 当一个数字类型的数据和空（''）字符串进行加（+）运算时
    • 会自动转换成string类型
    • 构造函数String可以实现字符串的转换
    • 在进行对象转换时其实调用了toString方法
      toString可以进行字符串转换

数字和字符转换布尔类型

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
var a = 123;
var b = '123';
var c = 'abc';
var d = null;
var e = 0;
var f = undefined;
var g = [];
var h = {};
var i = c - 1;
var j = '';
var k = '0';
console.log(i);  // => NaN

var a1 = !!a;
var b1 = !!b;
var c1 = !!c;
var d1 = !!d;
var e1 = !!e;
var f1 = !!f;
var g1 = !!g;
var h1 = !!h;
var i1 = !!i;
var j1 = !!j;
var k1 = !!k;
console.log(a1 + '---' + typeof a1);  // => true---boolean
console.log(b1 + '---' + typeof b1);  // => true---boolean
console.log(c1 + '---' + typeof c1);  // => true---boolean
console.log(d1 + '---' + typeof d1);  // => false---boolean
console.log(e1 + '---' + typeof e1);  // => false---boolean
console.log(f1 + '---' + typeof f1);  // => false---boolean
console.log(g1 + '---' + typeof g1);  // => true---boolean
console.log(h1 + '---' + typeof h1);  // => true---boolean
console.log(i1 + '---' + typeof i1);  // => false---boolean
console.log(j1 + '---' + typeof j1);  // => false---boolean
console.log(k1 + '---' + typeof k1);  // => true---boolean
console.log('------');

var a2 = Boolean(a);
var b2 = Boolean(b);
var c2 = Boolean(c);
var d2 = Boolean(d);
var e2 = Boolean(e);
var f2 = Boolean(f);
var g2 = Boolean(g);
var h2 = Boolean(h);
var i2 = Boolean(i);
var j2 = Boolean(j);
var k2 = Boolean(k);
console.log(a2 + '---' + typeof a2);  // => true---boolean
console.log(b2 + '---' + typeof b2);  // => true---boolean
console.log(c2 + '---' + typeof c2);  // => true---boolean
console.log(d2 + '---' + typeof d2);  // => false---boolean
console.log(e2 + '---' + typeof e2);  // => false---boolean
console.log(f2 + '---' + typeof f2);  // => false---boolean
console.log(g2 + '---' + typeof g2);  // => true---boolean
console.log(h2 + '---' + typeof h2);  // => true---boolean
console.log(i2 + '---' + typeof i2);  // => false---boolean
console.log(j2 + '---' + typeof j2);  // => false---boolean
console.log(k2 + '---' + typeof k2);  // => true---boolean
console.log('------');
  • conclusion：
    • 可以使用运算符进行隐式转换（!!）
    • 也可以通过构造函数强制转换
    • null、数字0、undefined、空字符串''、NaN 转换成false

布尔值转数字或字符串

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
var bool1 = true;
var bool2 = false;
console.log(bool1+'---'+typeof bool1);  // => true---boolean

var n1 = bool1.toString();
var n2 = bool2.toString();
console.log(n1+'---'+typeof n1);        // => true---string
console.log(n2+'---'+typeof n2);        // => false---string
console.log('------');

var m1 = bool1 + '';
var m2 = bool2 + '';
console.log(m1 +'---'+typeof m1);       // => true---string     
console.log(m2 +'---'+typeof m2);       // => false---string 
console.log('------');

var s1 = bool1 - 0;
var s2 = bool2 - 0;
console.log(s1 + '---' + typeof s1);    // => 1---number   
console.log(s2 + '---' + typeof s2);    // => 0---number
console.log('------');

var q1 = bool1 - '';
var q2 = bool2 - '';
console.log(q1 + '---' + typeof q1);    // => 1---number
console.log(q2 + '---' + typeof q2);    // => 0---number
console.log('------');

var w1 = bool1 * 1;
var w2 = bool1 / 1;
console.log(w1 + '---' + typeof w1);    // => 1---number
console.log(w2 + '---' + typeof w2);    // => 1---number
console.log('------');

var z1 = bool1 + 0;
console.log(z1 + '---' + typeof z1);    // => 1---number
  • conclusion:
    • 在boolean转number时
    • true转换成 1
    • false 转换成 0
    • 在boolean转string时
    • true转换成'true'字符串
    • false转换成字符串'false'
    • 在进行隐式转换时，在和字符串进行+运算时转换成 string类型
    • 在和数字进行+运算时转换成 number类型
    • 在进行-、* 、/运算时转换成number类型
文章目录
  1. 1. JavaScript 中的数据类型
  2. 2. 字符串转数字
  3. 3. 数字转字符串
  4. 4. 数字和字符转换布尔类型
  5. 5. 布尔值转数字或字符串