JavaScript ES6数据类型

JavaScript 是一种弱类型或者说动态语言。这意味着你不用提前声明变量的类型，在程序运行过程中，类型会被自动确定。这也意味着你可以使用同一个变量保存不同类型的数据：

//例如可以声明一个变量：
var a = 1;
a = 'leilei'
a = true

这种形式在JavaScript语法中不会报错，但是会有潜在的一些问题，因此微软推出的JavaScript的超集TypeScript就解决了这个问题；在声明一个变量之前首先声明他的类型；(示例为ts代码)

//声明变量的类型及初始值：
var [变量名] : [类型] = 值;
var uname:string = "leilei";

数据类型
ECMAScript标准定义了8中数据类型：

• 7种原始类型
  • Boolean
  • Null
  • Undefined
  • Number
  • BigInt
  • String
  • Symbol
• Object

---

原始值( primitive values )
除 Object 以外的所有类型都是不可变的（值本身无法被改变）。例如，与 C 语言不同，JavaScript 中字符串是不可变的（译注：如，JavaScript 中对字符串的操作一定返回了一个新字符串，原始字符串并没有被改变）。我们称这些类型的值为“原始值”。

布尔类型
布尔表示一个逻辑实体，可以有两个值：true 和 false。

Null 类型
Null 类型只有一个值：null。

Undefined 类型
一个没有被赋值的变量会有个默认值 undefined。

Null 和 Undefined 区别（面试问到过）

console.log(null==undefined)//true
console.log(null===undefined)//false

null： object类型，代表“空值”，代表一个空对象指针，
undefined： undefined类型，

null和 undefined都表示“值的空缺”，可以认为undefined是表示系统级的、出乎意料的或类似错误的值的空缺，

null是表示程序级的、正常的或在意料之中的值的空缺。

undefined是访问一个未初始化的变量时返回的值，而null是访问一个尚未存在的对象时所返回的值。

因此，可以把undefined看作是空的变量，而null看作是空的对象。

场景：
null
（1） 作为函数的参数，表示该函数的参数不是对象。
（2） 作为对象原型链的终点。
undefined
（1）变量被声明了，但没有赋值时，就等于undefined。
（2）调用函数时，应该提供的参数没有提供，该参数等于undefined。
（3）对象没有赋值的属性，该属性的值为undefined。
（4）函数没有返回值时或者return后面什么也没有，返回undefined。

数字类型
JavaScript 只有一种数字类型。它并没有为整数给出一种特定的类型，只要在双精度浮点数的取值范围内在JavaScript中数字就是安全的。超出范围那么JavaScript 数字就不再安全了。具体检测数值是否安全可以参考 MDN
还有一些带符号的值：+Infinity，-Infinity 和 NaN (非数值，Not-a-Number)。

BigInt 类型
BigInt类型是 JavaScript 中的一个基础的数值类型，可以用任意精度表示整数。使用 BigInt，您可以安全地存储和操作大整数，甚至可以超过数字的安全整数限制。BigInt是通过在整数末尾附加 n 或调用构造函数来创建的。

字符串类型
JavaScript 字符串是不可更改的。这意味着字符串一旦被创建，就不能被修改。

符号类型
符号(Symbols)是ECMAScript 第6版新定义的。符号类型是唯一的并且是不可修改的, 并且也可以用来作为Object的key的值(如下). 在某些语言当中也有类似的原子类型(Atoms). 你也可以认为为它们是C里面的枚举类型

symbol类型是一种基本数据类型 （[primitive data type]。
Symbol()函数会返回symbol类型的值，该类型具有静态属性和静态方法。
它的静态属性会暴露几个内建的成员对象；
它的静态方法会暴露全局的symbol注册，且类似于内建对象类，
但作为构造函数来说它并不完整，因为它不支持语法："new Symbol()"。
每个从Symbol()返回的symbol值都是唯一的。一个symbol值能作为对象属性的标识符；这是该数据类型仅有的目的。

Symbol类型详解
创建symbol实例

//可以通过调用Symbol()函数来创建一个Symbol实例：
let symbol1 = Symbol();

//可以在调用Symbol()函数时传入一个可选的字符串参数，相当与给该实例一个描述信息
let symbol2 = Symbol('this is symbol2');

检查类型(使用typeof)

typeof symbol1  // 'symbol'

对比示例

let symbol1 = Symbol();
let symbol2 = Symbol('this is symbol2');
let symbol3 = Symbol();
symbol1  ==  symbol3 //false
symbol1  ===  symbol3 //false
symbol1  == symbol2 //false

使用场景1：常量

//常量
const type1 = 'type1';
const type2 = 'type2';
const type3 = 'type3';

function testType(type){
    switch(type){
         case type1:
           console.log(type)
           break;
        case type2:
           console.log(type)
           break;
        case type3:
           console.log(type)
           break;
        default:
           throw new Error('type error')
    }
}

//可以使用
const type1 = Symbol();
const type2 = Symbol();
const type3 = Symbol();

//来替换以上常量声明，避免命名困难强迫症陷阱,并且完美保证每个常量的值都是唯一。

使用场景2：对象属性名

//我们知道对象的key是保持唯一的，因此有时候可以用对象key的特性来进行数组去重。symbol的特性可以用来做对象的key值。
//特殊的一点是在使用Symbol 类型作为对象的key值时需要使用中括号 [ ] 来讲Symbol类型括起来。 
let obj = {
  name : 'ray',
  age:23  
}
obj.name // 'ray'
obj[age] // 23

const name = Symbol();
const age = Symbol();

let obj = {
   [name]:'ray'
}
obj[age] = 23;

obj[name] //'ray';
obj[age] // 23

//此时我们输出obj
console.log(obj); //{Symbol(): "ray", Symbol(): 23}
//很显然对象key值为Symbol();
//如果我们使用for in 循环去遍历obj的key会得出什么呢？
for(let key in obj){
  console.log(key); // 
}
//此时的输出竟然是空的 ......
//对了，输出确实是空的。因为Symbol类型的key是不能通过Object.keys()或者for...in来枚举的，
//它未被包含在对象自身的属性名集合(property names)之中。
//接着看
var symbol = Symbol();
var obj1 = {
  name:'ray',
  age:24,
  [symbol] : 'symbol'
}
Object.keys(obj1) // ['name','age'];
//那它的[symbol] key值去哪了，怎么访问到呢？？？
obj1[symbol]   // 'symbol'
//放心 可以访问到我们定义好的值，只是不能通过常规的手段去获取而已。
//例如，使用 JSON.stringify() 转换成字符串时 Symbol属性也会被排除；
JSON.stringify(obj1) // "{"name":"ray","age":24}"，此时也是没有Symbol属性的。

//但是有专门的API就是针对Symbol的 例如：
// 使用Object的API
Object.getOwnPropertySymbols(obj1) // [Symbol()]

// 使用新增的反射API
Reflect.ownKeys(obj1) // ['name', 'age',Symbol(symbol)]

总结：在使用Symbol此类型的数据作为对象的key时，无法通过Object.keys()和for in 循环去处理获取对象的Symbol类型key值，使用JSON.stringify()去转换对象为字符串时，也会隐藏掉以Symbol为key的属性名和属性值。但是可以使用Object.getOwnPropertySymbols(obj)与Reflect.ownKeys(obj)来获取以Symbol类型作为对象的key的键的，实际上这也为对象创建了其私有属性。

关于Symbol的使用还有很多，本文Symbol内容部分知识参考大神
一斤代码的《理解和使用ES6中的Symbol》

---

JavaScript 重量级人物来了，他就是对象

对象（Object）

相信对象对每个程序员来说都不陌生，毕竟办公室里除了敲代码就是谈论怎么找对象，然后年级大点的老程序员（其实他还不到30岁）就说“哎呀 对象嘛，哪里有那么难搞，New一个出来就完了嘛”。

咳咳，言归正传，相信每个JavaScript程序员都听说过，在JavaScript中，万物皆对象。我认为对于这句话理解的透彻程度，决定了一个JavaScript程序员的自我修养深度。

先来点MDN的概念，虽然有的看不太懂，但是就是觉得人家说得好，哈哈。

在计算机科学中, 对象是指内存中的可以被标识符引用的一块区域.

在 Javascript 里，对象可以被看作是一组属性的集合。用对象字面量语法来定义一个对象时，会自动初始化一组属性。（也就是说，你定义一个var a = "Hello"，那么a本身就会有a.substring这个方法，以及a.length这个属性，以及其它；如果你定义了一个对象，var a = {}，那么a就会自动有a.hasOwnProperty及a.constructor等属性和方法。）而后，这些属性还可以被增减。属性的值可以是任意类型，包括具有复杂数据结构的对象。属性使用键来标识，它的键值可以是一个字符串或者符号值（Symbol）。

一个 Javascript 对象就是键和值之间的映射.。键是一个字符串（或者 Symbol)Symbol()函数会返回symbol类型的值，该类型具有静态属性和静态方法。它的静态属性会暴露几个内建的成员对象；它的静态方法会暴露全局的symbol注册，且类似于内建对象类，但作为构造函数来说它并不完整，因为它不支持语法："new Symbol()"。 值可以是任意类型的值。 这使得对象非常符合哈希表

函数是一个附带可被调用功能的常规对象。

数组是一种使用整数作为键(integer-key-ed)属性和长度(length)属性之间关联的常规对象。此外，数组对象还继承了 Array.prototype 的一些操作数组的便捷方法。例如, indexOf (搜索数组中的一个值) or push (向数组中添加一个元素)，等等。 这使得数组是表示列表或集合的最优选择。

JSON (JavaScript Object Notation) 是一种轻量级的数据交换格式，来源于 JavaScript 同时也被多种语言所使用。 JSON 用于构建通用的数据结构。

总之，这段话说明了一件事，那就是数字，字符串，函数，数组，JSON等都是对象。

万物皆对象就完事了。

创建对象
1.字面量：

var obj = {
  name:'leilei',
  age:23
}

2.使用new操作符：

var obj = new Object();
obj.name = 'leilei';
obj.age = 23;

3.Object.create():

var obj = {a:1}
var obj1 = Object.create(obj)
console.log(obj1) // 输出{} ????? 下面有原因
console.log(obj1.a) // 输出1

4.构造函数模式

function Person(name,age){
  this.name = name;
  this.age = age;
}
var person1 = new Person('leilei',23);
console.log(person1) // Person {name: "leilei", age: 23}

5.工厂模式

function person(name,age){
  var o = new Object();
  o.name = name;
  o.age = age;
  return o;
}
var person1 = person('leilei',23);
console.log(person1); //{name: "leilei", age: 23}

6.原型模式

function Person(){}
Person.prototype.name = 'leilei';
Person.prototype.age = 23;
var person1 = new Person();
console.log(person1); //Person {}
console.log(person1.name); //'leilei'
person1.sex = 'male';
console.log(person1);// Person {sex: "male"}
person1.name = 'zhaohui';
console.log(person1);// Person {sex: "male", name: "zhaohui"}

7.混合模式（构造函数模式+原型模式）

function Person(name,age){
  this.name = name;
  this.age = age;
}
Person.prototype.sex = 'male';
var person1 = new Person('leilei',23);
console.log(person1); // Person {name: "leilei", age: 23}
console.log(person1.sex)  // 'male'

以上是对象的几种创建方法，里面有很多细节都没有详细的说明，主要是因为本文的重点不在这块，而且在平时工作中我自己个人使用的较少，也是害怕写错了误人，以上写过的代码都是测试过没有问题的。
以下是对于上面的一些补充，以及面试经历过关于这块的问题：
1.对象创建的几种方式
见上几种；
2.对象创建new 和Object.creact()的区别
首先，看看MDN上关于Object.create()方法的说明:

Object.create()方法创建一个新对象，使用现有的对象来提供新创建的对象的proto。 （不理解的话继续往下看）
语法：
Object.create(proto[, propertiesObject])
参数：
proto:新创建对象的原型对象。
propertiesObject：可选。如果没有指定为 undefined，则是要添加到新创建对象的不可枚举（默认）属性（即其自身定义的属性，而不是其原型链上的枚举属性）对象的属性描述符以及相应的属性名称。这些属性对应Object.defineProperties()的第二个参数。
返回值：
一个新对象，带着指定的原型对象和属性。

看代码：

var obj = {a:1}
var o = Object.create(obj);
console.log(o);  // {}  空对象
console.log(o.a);  //  1
console.log(o.__proto__)  // {a: 1}

/*由定义可知，Object.create()使用现有的对象来提供新创建的对象的proto,所以可以看出属性a不是对象o自身的属性，
而是通过其原型链访问到的对象obj的属性，相当于将对象obj放到了对象o的原型上，也可以说o继承了obj,将obj的属性
添加到了其原型下。*/
//因此Object.keys(o) // [];
//使用for in 循环也获取不到key值。

然后再看看他的第二个参数 propertiesObject

Object.create() 用第二个参数来创建非空对象的属性描述符默认是为false的；

什么意思呢？先看代码：

var obj = {a:1}
var o = Object.create(obj,{des:{value:123}})
console.log(o) // {des: 123}
Object.keys(o) // [];
o.des = 456;
console.log(o.des); //123 ，没有变为456
//现在使用Object.getOwnPropertyDescriptors()来看一下
Object.getOwnPropertyDescriptors(o);
输出为：
{
  des:{
    configurable:false, //不可配置
    enumerable:false, //不可枚举
    value:123,
    writable:false //不可写
  }
}

以上可以看出，为什么使用Object.keys(),和for in 循环不能获取Object.create()的第二个参数，以及为什么修改des为456之后再次去获取还是123；
那么如何让它可以枚举，可以写入，可以配置呢？

o2 = Object.create({}, {
  p: {
    value: 2019, 
    writable: true, //可写
    enumerable: true, //可枚举
    configurable: true  //可配置
  } 
});
o2.p = 2020;
console.log(o2) // {p:2020};

总结：Object.create()方法可以创建对象，创建一个新对象，使用现有的对象来提供新创建的对象的proto；（现在理解这句话有点清晰了吧）
由于是在原型上，所以使用Object.keys(),for in 循环获取key值自然是拿不到的。
Object.create()的第二个参数创建非空对象的属性描述符默认是为false的；也就是不可写，不可配置，不可枚举，但是可以通过自己修改来使其可以配置，可以写入，可以枚举。
使用Object.getOwnPropertyDescriptors();方法可以获取Object.create()第二个参数具体属性。

这样大概也就对Object.create()有了一个大概了解，接着再看new Object()与Object.create()的区别：
1.创建对象的方式不同
new Object() 通过构造函数来创建对象, 添加的属性是在自身实例下。
Object.create() es6创建对象的另一种方式，可以理解为继承一个对象, 添加的属性是在原型下。
2.创建对象属性的性质不同
Object.create() 用第二个参数来创建非空对象的属性描述符默认是为false的，
而构造函数或字面量方法创建的对象属性的描述符默认为true。
3.创建空对象时不同
当用构造函数或对象字面量方法创建空对象时，对象时有原型属性的，即有proto;
当用Object.create()方法创建空对象时，对象是没有原型属性的。

new 与 Object.create() 创建空对象

本文Object.create()内容部分知识参考大神liwuwuzhi的文章《Object.create()》

Set

Set 对象允许你存储任何类型的唯一值，无论是原始值或者是对象引用。

const set2 = new Set([{a:1}, '2', 3, [4,5], 6,false]);

set2

语法：
new Set([iterable]);
参数：
iterable
如果传递一个可迭代对象，它的所有元素将不重复地被添加到新的 Set中。如果不指定此参数或其值为null，则新的 Set为空。
返回值：
一个新的Set对象。
简述：
Set对象是值的集合，你可以按照插入的顺序迭代它的元素。 Set中的元素只会出现一次，即 Set 中的元素是唯一的。

属性：
Set.prototype.size:返回Set对象的值的个数。

var set = new Set([1,2,3,4,5]);
set.size // 5

方法：
Set.prototype.add(value);在Set对象尾部添加一个元素。返回该Set对象。

var set = new Set([1,2,3,4,5]);
set.add(6);
set // Set [1,2,3,4,5,6]; 

Set.prototype.clear();移除Set对象内的所有元素。

var set = new Set([1,2,3,4,5]);
set.clear();
set // Set []

Set.prototype.delete(value);移除Set的中与这个值相等的元素，返回Set.prototype.has(value)在这个操作前会返回的值（即如果该元素存在，返回true，否则返回false）。Set.prototype.has(value)在此后会返回false。

var set = new Set([1,2,3,4,5]);
set.delete(1); //true
set // Set [2,3,4,5]

Set.prototype.has(value);返回一个布尔值，表示该值在Set中存在与否。

var set = new Set([1,2,3,4,5]);
set.has(1) // true;
set.has('abc') // false

Set.prototype.values();返回一个新的迭代器对象，该对象包含Set对象中的按插入顺序排列的所有元素的值.

var set = new Set([1,2,3,4,5]);
set.values() // SetIterator[1,2,3,4,5]

Set.prototype.keys();与values()方法相同，返回一个新的迭代器对象，该对象包含Set对象中的按插入顺序排列的所有元素的值。

var set = new Set([1,2,3,4,5]);
set.keys() // SetIterator[1,2,3,4,5]

操作：

//交集：
let intersection = new Set([...set1].filter(x => set2.has(x)));
//差集：
let difference = new Set([...set1].filter(x => !set2.has(x)));

与数组在相互转换

//Set 转 Array
var set = new Set([1,2,3])
var arr = Array.from(set);
arr // [1,2,3]
//或者 使用扩展运算符
var arr = [...set]

//Array转 Set
var arr = [1,2,3]
var set = new Set(arr);
set // Set [1,2,3]

数组去重

var arr = [1,2,2,4,3,4,5,6,7,5];
var uniqArr = [...new Set(arr)]; 
uniqArr // [1,2,3,4,5,6,7]
//或者使用Array.from()
var uniqArr = Array.from(new Set(arr))

更多Set对象资料请参考MDN......

Map

Map对象保存键值对，并且能够记住的原始插入顺序。任何值（对象或者原始值）都可以作为一个键或一个值。

Map数据结构

语法：
new Map([iterable])
参数：
Iterable 可以是一个数组或者其他 iterable 对象，其元素为键值对(两个元素的数组，例如: [[ 1, 'one' ],[ 2, 'two' ]])。 每个键值对都会添加到新的 Map。null 会被当做 undefined。
描述：
一个Map对象在迭代时会根据对象中元素的插入顺序来进行 — 一个 for...of循环在每次迭代后会返回一个形式为[key，value]的数组。

Objects和maps

• 一个Object的键只能是字符串或者Symbols,但一个Map的键可以是任意值，包括函数，对象，基本类型。
• Map中的键值是有序的，而添加到对象中的键则不是。因此，当对它进行遍历时，Map对象是按插入的顺序返回键值。
• 你可以通过size属性直接获取一个Map的键值对个数，而Object的键值对个数只能手动计算。
• Map可直接进行迭代，而Object的迭代需要先获取它的键数组，然后再进行迭代。
• Object都有自己的原型，原型链上的键名有可能和你自己在对象上的设置的键名产生冲突。
• Map 在涉及频繁增删键值对的场景下会有些性能优势。

属性：
Map.length:属性的length的值为0；
想要计算一个Map中的条目数量，使用Map.prototype.size.
Map 实例
所有的Map对象实例都会继承Map.prototype。
实例属性：
Map.prototype.size:返回Map对象的键/值对的数量。

var map = new Map([[1,2],[3,4]])
map.size // 2

方法：
Map.prototype.clear();移除Map对象的所有键/值对。

var map = new Map([[1,2],[3,4]])
map.clear();

Map.prototype.delete(key);如果Map对象中存在该元素，则移除它并返回true,否则如果钙元素不存在则返回false,

var map = new Map([[1,1],[2,2]])
map.delete(1); // true
map // Map(1){2=>2}

Map.prototype.entries() 返回一个新的Iterator对象，它按插入顺序包含了Map对象中每个元素的[key,value]数组。

var map = new Map([[1,1],[2,2]]);
var map2 = map.entries();
map2 // MapIterator{1=>1, 2=>2}

Map.prototype.get(key)返回键对应的值，如果不存在，则返回undefined;

var map = new Map([[1,1],[2,2]]);
map.get(1) // 1

Map.prototype.has(key);返回一个布尔值，表示Map实例是否包含键对应的值。

var map = new Map([[1,1],[2,2]]);
map.has(1) // true
map.has(4) // false

Map.prototype.keys() 返回一个新的Iterator对象，它按插入顺序包含了Map对象中每个元素的键。

var map = new Map([[1,1],[2,2]]);
map.keys() // MapIterator {1, 2 } 

Map.prototype.values();返回一个新得Iterator对象，它按插入顺序包含了Map对象中每个元素的值。

var map = new Map([['键1','值1'],['键2','值2']]);
map.values() // MapIterator {"值1", "值2"}

Map.prototype.set(key,value) ;设置Map对象中键的值。返回该Map对象。

let myMap = new Map();
let keyObj = {};
let ketFunc = function(){};
let keyString = 'string';

myMap.set(keyObj ,'Obj值');
myMap.set(ketFunc ,'Func值');
myMap.set(keyString,'Str值');

myMap.size // 3
myMap // Map(3) {{…} => "Obj值", ƒ => "Func值", "string" => "Str值"}

Map与数组的关系

var kvArray = [['key1','value1'],['key2','value2']]
//数组转换为Map对象
let myMap = new Map(kvArray);
myMap.get('key1'); // 'value1'

//Map对象转换为数组
var myArr = Array.from(myMap);
myArr // [['key1','value1'],['key2','value2']]
//或者使用展开运算符
var myArr = [...myMap]

//也可以得到键，或者值的数组
console.log(Array.from(myMap.keys())); // 输出 ["key1", "key2"]

复制或合并Maps

//复制
let original = new Map([
  [1, 'one']
]);
let clone = new Map(original);
console.log(clone.get(1)); // one
console.log(original === clone); // false. 浅比较 不为同一个对象的引用
//合并 会保持键的唯一性
let first = new Map([
  [1, 'one'],
  [2, 'two'],
  [3, 'three'],
]);
let second = new Map([
  [1, 'uno'],
  [2, 'dos']
]);
// 合并两个Map对象时，如果有重复的键值，则后面的会覆盖前面的。
// 展开运算符本质上是将Map对象转换成数组。
let merged = new Map([...first, ...second]);
console.log(merged.get(1)); // uno
console.log(merged.get(2)); // dos
console.log(merged.get(3)); // three

更多Map对象资料请参考MDN