前端工程师吃饭的家伙——javaScript基础①变量和类型

本文部分内容来源：https://mp.weixin.qq.com/s/A8YyeM2N2MP23gEMzVLesw，https://www.cnblogs.com/cider/p/11875832.html

知识体系的自检清单：

一、JavaScript基础

变量和类型

1. JavaScript规定了几种语言类型

　　七种类型：boolean string number undefined null symbol object

　　其中可以分为两大类：基本数据类型（Boolean String Number Undefined Null Symbol）和引用类型（Object：Object Array Function RegExp Date null）

　　注意： null 是值类型，但是是一个空的对象引用，typeof null => object

　　　　　symbol是ES6引入的一种新的原始数据，表示独一无二且不可改变的值。通过 Symbol 函数调用生成，由于生成的 symbol 值为原始类型，所以 Symbol 函数不能使用 new 调用，更多了解https://zhuanlan.zhihu.com/p/22652486

　　　　　值类型不是由内置函数new出来的，尽管他们有对应的引用类型

　　　　　值类型复制的是值，直接保存在栈中，引用类型复制的是栈里面指向堆中对象的地址，真正的对象保存在堆内存中

2. JavaScript对象的底层数据结构是什么

　　数据在内存中的存储结构，也就是物理结构，分为两种：顺序存储结构和链式存储结构。

　　JavaScript数据结构：es5自带的：array、object；es6自带的：set map、weakset weakmap （强引用、弱引用，Set 和 Map 数据结构）；es未有的：dictionary list linkedlist doublelinkedlist quene hash stack。在JavaScript中不管多么复杂的数据和代码，都可以组织成object形式的对象

　　V8里面所有的数据类型的根父类都是Object，Object派生HeapObject，提供存储基本功能，往下的JSReceiver用于原型查找，再往下的JSObject就是JS里面的Object，Array/Function/Date等继承于JSObject。FixedArray是实际存储数据的地方。再谈js对象数据结构底层实现原理-object array map set

3. Symbol类型在实际开发中的应用、可手动实现一个简单的 Symbol

　　Symbol调用方式，只能是Symbol()，且会生成唯一值，typeof symbol1 => symbol，console.log(symbol1) => Symbol()，作为属性名的时候要用中括号

　　使用Symbol.for(key)可以为字符串和 Symbol 提供一对一的关系，此时只要key相同，变量就对应同一个symbol

　　消除魔法字符串（与代码形成强耦合的字符串）https://www.jianshu.com/p/71a35da05102

 1 const shapeType = {
 2   triangle: Symbol(),
 3   rectangular: Symbol()
 4 };
 5 
 6 function getArea(shape, options) {
 7   let area = 0;
 8   switch (shape) {
 9     case shapeType.triangle:
10       area = .5 * options.width * options.height;
11       break;
12     case shapeType.rectangular:
13       area = options.width * options.height;
14       break;
15   }
16   return area;
17 }
18 
19 getArea(shapeType.triangle, { width: 100, height: 100 });

　　用作私有变量 https://my.oschina.net/u/2903254/blog/818796

 1 let Square = (function() {
 2  
 3     const _width = Symbol('width');
 4  
 5     class Square {
 6         constructor( width0 ) {
 7             this[_width] = width0;
 8         }
 9         getWidth() {
10             return this[_width];
11         }
12     }
13  
14     return Square;  
15  
16 } )();