操作系统：Windows10
运行环境：NodeJS v8.1.2
Shell：Windows PowerShell
ES6 基本数据类型整理
简介：对 7 种数据类型进行简单整理
1 定义
1在 ES6 中共有 7 种基本数据类型：undefined、null、Boolean、String、Number、Object、Symbol
2
3undefined（未定义）：表示变量未初始化，属性不存在，函数没有返回值
4null（空值）：表示变量为空值
5Boolean（布尔值）：true 或 false
6String（字符串）：单引号字符串 ‘’ 或 双引号字符串 ""
7Number（数值）：范围 [-2^53, 2^53]
8Object（对象）：表示属性的集合，其中每个属性由“名/值对”构成
9Symbol（符号）：表示独一无二（ES6 新增）
2 使用
2.1 undefined
1// 1 变量取值
2let a;
3console.log(a); // undefined
4let b = undefined;
5console.log(b); // undefined
6// 2 属性查询
7let obj = { b: undefined, };
8console.log(obj.a); // undefined
9console.log(obj.b); // undefined
10if('b' in obj) {
11 console.log(true); // true
12}
13// 3 函数返回值
14function func () {}
15console.log(func()); // undefined
16function func2 (arg) { return arg; }
17let arg = undefined;
18console.log(func2(arg)); // undefined
19arg = 'something';
20console.log(func2(arg)); // something
21
22
23小结：
241 在变量取值时得到 undefined ，表示变量未定义；
252 在对象的属性查询时得到 undefined ,表示查询的属性的值未定义，不能据此判断属性是否存在；
263 在函数返回值时得到 undefined ，表示此次调用该函数的返回值未定义，不能说明该函数没有返回值。
2.2 null
1// 1 变量取值
2let a = null;
3console.log(a); // null
4// 2 属性查询
5let obj = { b: null, };
6console.log(obj.b); // null
7// 3 函数返回值
8function func (arg) { return arg; }
9let arg = null;
10console.log(func(arg)); // null
11
12
13小结：
141 在变量取值时得到 null ，表示变量为空值；
152 在对象的属性查询时得到 null ,表示查询的属性的值为空值，可以判断属性存在；
163 在函数返回值时得到 null ，表示此次调用该函数的返回值为空值，说明该函数有返回值。
2.3 Boolean
1let b1 = false;
2let b2 = Boolean(undefined); // false
3let b3 = Boolean(null); // false
4let b4 = Boolean(0); // false
5let b5 = Boolean(-0); // false
6let b6 = Boolean(NaN); // false
7let b7 = Boolean(''); // false
8let b8 = Boolean(""); // false
9console.log(b1, b2, b3, b4);
10console.log(b5, b6, b7, b8);
11let bool1 = true;
12let bool2 = Boolean('0'); // true
13let bool3 = Boolean("0"); // true
14let bool4 = Boolean(1); // true
15let bool5 = Boolean(Infinity); // true
16let bool6 = Boolean(-Infinity); // true
17let bool7 = Boolean({}); // true
18let bool8 = Boolean(Symbol()); // true
19console.log(bool1, bool2, bool3, bool4);
20console.log(bool5, bool6, bool7, bool8);
21let o1 = Boolean(Boolean(true)); // true
22let o2 = Boolean(Boolean(false)); // false
23let o3 = Boolean(String('')); // false
24let o4 = Boolean(String("")); // false
25let o5 = Boolean(String('abc')); // true
26let o6 = Boolean(Number(0)); // false
27let o7 = Boolean(Number(1)); // true
28let o8 = Boolean(Object()); // true
29console.log(o1, o2, o3, o4);
30console.log(o5, o6, o7, o8);
31let obj1 = Boolean(new Boolean(true)); // true
32let obj2 = Boolean(new Boolean(false)); // true
33let obj3 = Boolean(new String('')); // true
34let obj4 = Boolean(new String("")); // true
35let obj5 = Boolean(new String('abc')); // true
36let obj6 = Boolean(new Number(0)); // true
37let obj7 = Boolean(new Number(1)); // true
38let obj8 = Boolean(new Object()); // true
39console.log(obj1, obj2, obj3, obj4);
40console.log(obj5, obj6, obj7, obj8);
41
42
43
44小结：其它 6 中基本数据类型转 Boolean
451 undefined 转 Boolean 得 false ；
462 null 转 Boolean 得 false ；
473 {} 转 Boolean 得 true ；
484 Symbol() 转 Boolean 得 true ；
495 0|-0|NaN 转 Boolean 得 false ，其它数字 得 true ；
506 '' or "" 转 Boolean 得 false ，非空字符串 得 true ；
517 通过各基本类型的包装对象的转换函数转换后，在转 Boolean ，结果与1~6点一致；
528 各包装对象转 Boolean ，由于包装对象都是对象，因此转换都得 true 。
2.4 String
1let str1 = 'abc';
2let str2 = "abc";
3let str3 = 'abc"def"ghi';
4let str4 = "abc'def'ghi";
5let str5 = "No, I can't.";
6let str6 = 'No, I can\'t.';
7let str7 = 'abc\
8def\
9hij';
10let str8 = 'abc\
11 def\
12 hij';
13console.log(str1); // abc
14console.log(str2); // abc
15console.log(str3); // abc"def"ghi
16console.log(str4); // abc'def'ghi
17console.log(str5); // No, I can't.
18console.log(str6); // No, I can't.
19console.log(str7); // abcdefghi
20console.log(str8); // abc def ghi
21let s1 = 'Hello';
22let s2 = "World";
23let s3 = s1 + ' ' + s2.toLowerCase();
24console.log(s1); // Hello
25console.log(s2); // World
26console.log(s3); // Hello world
27console.log(s3.length); // 11
28
29
30小结：
311 字符串直接量可以由 单引号 或 双引号 括起来（参考str1~str8）；
322 字符串直接量在行末由反斜线“\”结尾，字符串可以拆分到多行（参考str7|str8）；
333 字符串直接量中可以使用转义字符（参考str6）；
344 字符串的连接使用加号“+”（参考s3）；
355 可以直接通过字符串直接量调用字符串对象的属性/方法（参考s3）。
36
37JavaScript 转义字符表
38转义字符 含义
39\o NUL 字符（\u0000）
40\b 退格符（\u0008）
41\t 水平制表符（\u0009）
42\n 换行符（\u000A）
43\v 垂直制表符（\u000B）
44\f 换页符（\u000C）
45\r 回车符（\u000D）
46\" 双引号（\u0022）
47\' 单引号（\u0027）
48\\ 反斜线（\u005C）
49\xXX 由两位十六进制数XX指定的 Latin-l 字符
50\uXXXX 由四位十六进制数XXXX指定的 Unicode 字符
2.5 Number
1// part 1
2let n1 = 0;
3let n2 = 0xff;
4let n3 = 1.01;
5let n4 = .02;
6let n5 = 5.05e22;
7let n6 = 2.4E-10;
8console.log(n1); // 0
9console.log(n2); // 255
10console.log(n3); // 1.01
11console.log(n4); // 0.02
12console.log(n5); // 5.05e+22
13console.log(n6); // 2.4e-10
14console.log(1 + 1); // 2
15console.log(1 - 1); // 0
16console.log(2 * 4); // 8
17console.log(5 / 2); // 2.5
18console.log(5 % 2); // 1
19console.log(5.5 % 2.5); // 0.5
20
21
22// part 2
23console.log(1 / 0); // Infinity
24console.log(1 / -0); // -Infinity
25console.log(-1 / -0); // Infinity
26console.log(0 / 0); // NaN
27
28
29// part 3
30console.log(NaN === NaN); // false
31console.log(0 === -0); // true
32console.log(Infinity === -Infinity); // false
33
34
35小结：
361 JavaScript 不区分整数和浮点数，数字直接量参考 n1~n6 ；
372 JavaScript 预定义了全局变量 Infinity 和 NaN，分别表示 无穷大 和 非数字（参考 part2）；
383 NaN 不等于自身（参考 part 3）；
2.6 Object
1// part 1 - 方法一
2let obj1 = {
3 x:1,
4 y:2,
5 func: function () { return 'hello, world'; },
6};
7console.log(obj1); // { x: 1, y: 2, func: [Function: func] }
8console.log(obj1.x); // 1
9console.log(obj1.y); // 2
10console.log(obj1.func()); // hello world
11
12
13// part 2 - 方法二
14function MyClass () {
15 this.x = 1;
16 this.y = 2;
17 this.func = function () { return 'hello world'; };
18}
19MyClass.prototype.a = 10;
20MyClass.prototype.b = 20;
21MyClass.prototype.func = function () {
22 return 'Hello World';
23};
24MyClass.a = 100;
25MyClass.b = 200;
26MyClass.func = function () {
27 return 'Hello, World!';
28};
29let obj2 = new MyClass();
30console.log(obj2); // MyClass { x: 1, y: 2, func: [Function] }
31console.log(obj2.x); // 1
32console.log(obj2.y); // 2
33console.log(obj2.func()); // hello world
34console.log(obj2.a); // 10
35console.log(obj2.b); // 20
36console.log(MyClass.a); // 100
37console.log(MyClass.b); // 200
38console.log(MyClass.func()); // Hello, World!
39
40
41// part 3 - 方法三
42let objectPrototype = {
43 a: 10,
44 b: 20,
45 func: function () { return 'Hello World'; },
46}
47let propertyDescriptorObject = {
48 x: { value: 1, writable: true, enumerable: true, configurable: true },
49 y: { value: 2, writable: true, enumerable: true, configurable: true },
50 func: { value: function () { return 'hello world'; },
51 writable: false,
52 enumerable: true,
53 configurable: false
54 },
55}
56let obj3 = Object.create(objectPrototype, propertyDescriptorObject);
57console.log(obj3); // { x: 1, y: 2, f: [Getter/Setter], func: [Function: value] }
58console.log(obj3.x); // 1
59console.log(obj3.y); // 2
60console.log(obj3.func()); // hello world
61console.log(obj3.a); // 10
62console.log(obj3.b); // 20
63
64
65小结：
661 对象有三种创建方法：
671.1 标识符 = 对象直接量
681.2 标识符 = new 构造函数()
691.3 标识符 = Object.create()
702 通过对象直接量创建的对象，相当于创建一个匿名对象，使用标识符去访问此对象，对象的原型为 Object.prototype ；
713 通过 new 关键字创建的对象，首先需要为待创建的对象定义构造函数，可以通过构造函数为新对象指定其原型，也可以使用构造函数模仿类属性与类方法；
724 通过 Object.create() 创建对象，必须提供新对象的原型作为该方法的第一个参数，可选提供新对象的属性描述对象作为该方法的第二个参数。
2.7 Symbol
1// part 1
2let s1 = Symbol();
3let s2 = Symbol();
4console.log(s1); // Symbol()
5console.log(s2); // Symbol()
6console.log(s1 === s2); // fasle
7
8
9// part 2
10let s1 = Symbol('a');
11let s2 = Symbol('a');
12console.log(s1); // Symbol(a)
13console.log(s2); // Symbol(a)
14console.log(s1 === s2); // false
15
16
17// part 3
18let mySymbol = Symbol();
19
20let a = {};
21a[mySymbol] = 'hello 1';
22console.log(a[mySymbol]); // hello 1
23
24let b = {
25 [mySymbol]: 'hello 2',
26};
27console.log(b[mySymbol]); // hello 2
28
29let c = {};
30Object.defineProperty(c, mySymbol, { value: 'hello 3' });
31console.log(c[mySymbol]); // hello 3
32
33
34// part 4
35let s1 = Symbol('hello');
36let s2 = Symbol('world');
37let obj = {
38 a: 1,
39 b: 2,
40 [s1]: 'this is s1',
41 [s2]: 'this is s2',
42};
43console.log(obj); // { a: 1, b: 2, [Symbol(hello)]: 'this is s1', [Symbol(world)]: 'this is s2' }
44for(p in obj) {
45 console.log(p); // a
46} // b
47console.log(Object.keys(obj)); // [ 'a', 'b' ]
48console.log(Object.getOwnPropertyNames(obj)); // [ 'a', 'b' ]
49console.log(Object.getOwnPropertySymbols(obj)); // [ Symbol(hello), Symbol(world) ]
50
51let obj2 = {};
52Object.defineProperty(obj2, s1, { value: 'hello', writable: false, enumerable: false, configurable: false });
53Object.defineProperty(obj2, s2, { value: 'world', writable: true, enumerable: true, configurable: true });
54console.log(obj2); // { [Symbol(world)]: 'world' }
55for(p in obj2) {
56 console.log(p); // nothing output
57}
58console.log(Object.keys(obj2)); // [ ]
59console.log(Object.getOwnPropertyNames(obj2)); // [ ]
60console.log(obj2[s1]); // hello
61console.log(obj2[s2]); // world
62obj2[s1] = 'HELLO';
63obj2[s2] = 'WORLD';
64console.log(obj2[s1]); // hello
65console.log(obj2[s2]); // WORLD
66delete obj2[s1];
67delete obj2[s2];
68console.log(obj2[s1]); // hello
69console.log(obj2[s2]); // undefined
70
71
72// part 5
73let mySymbol = Symbol();
74let yourSymbol = Symbol();
75let obj = {};
76obj[mySymbol] = 'hello';
77obj[yourSymbol] = 'world';
78console.log(obj); // { [Symbol()]: 'hello', [Symbol()]: 'world' }
79
80let extendObj = Object.create(obj);
81console.log(extendObj); // { }
82console.log(extendObj[mySymbol]); // hello
83console.log(extendObj[yourSymbol]); // world
84let exMySymbol = Symbol();
85let exYourSymbol = Symbol();
86extendObj[exMySymbol] = 'HELLO';
87extendObj[exYourSymbol] = 'WORLD';
88console.log(extendObj); // { }
89console.log(extendObj[mySymbol]); // hello
90console.log(extendObj[yourSymbol]); // world
91console.log(extendObj[exMySymbol]); // HELLO
92console.log(extendObj[exYourSymbol]); // WORLD
93
94
95小结：
961 Symbol 用于定义独一无二的属性名 或 常量；
972 Symbol 属性为公共属性；
983 Symbol 属性不会出现在 for...in 、 for...of 循环中；
994 Symbol 属性不会被 Object.keys() 、 Object.getOwnPropertyNames() 返回；
1005 可以使用 Object.getOwnPropertySymbols() 返回指定对象的所有 Symbol 属性；
