前端常见数据结构和特点

什么是数据结构

数据结构就是关系，没错，就是数据元素相互之间存在的一种或多种特定关系的集合。

• 传统上，我们把数据结构分为逻辑结构和物理结构。
• 逻辑结构：是指数据对象中数据元素之间的相互关系，也是我们今后最需要关注和讨论的问题。
• 物理结构：是指数据的逻辑结构在计算机中的存储形式。

数据元素相互之间存在的一种和多种特定的关系集合 包括二个部分组成逻辑结构，存储结构。

逻辑结构

简单的来说 逻辑结构就是数据之间的关系,逻辑结构大概统一的可以分成两种 一种是线性结构，非线性结构 。

线性结构

是一个有序数据元素的集合。 其中数据元素之间的关系是一对一的关系，即除了第一个和最后一个数据元素之外，其它数据元素都是首尾相接的。

常用的线性结构有: 栈，队列，链表，线性表。

非线性结构

各个数据元素不再保持在一个线性序列中，每个数据元素可能与零个或者多个其他数据元素发生联系。

常见的线性结构有 二维数组，树(二叉树等)等。

存储结构

逻辑结构指的是数据间的关系，而存储结构是逻辑结构用计算机语言的实现。 常见的存储结构有顺序存储、链式存储、索引存储以及散列存储（哈希表）。

时间复杂度

一个算法的时间复杂度反映了程序运行从开始到结束所需要的时间。

把算法中基本操作重复执行的次数（频度）作为算法的时间复杂度。

没有循环语句，记作O(1)，也称为常数阶。

只有一重循环，则算法的基本操作的执行频度与问题规模n呈线性增大关系，记作O（n），也叫线性阶。

常用的还有平方阶O（n2）、立方阶O（n3）、对数阶O(log2n)等。 常见的时间复杂度有：

O(1)< O(log2n)< O（n）< O（n2）< O（ n3 ）< O（ 2n ）

 

1.数组（Array）

数组是最简单、也是使用最广泛的数据结构。数组是可以在内存中连续存储多个元素的结构，在内存中的分配也是连续的，数组中的元素通过数组下标进行访问，数组下标从0开始。

• 数组：查询快，增删慢
• 查询快：数组的地址是连续的，我们通过数组的首地址可以找到数组，通过数组的索引可以快速查找某一个元素
• 增删慢：数组的长度是固定的，我们想要增加/删除一个元素，必须创建一个新的数组，把原数组的数据复制过来

2.栈（Stack）

栈是一种特殊的线性表，仅能在线性表的一端操作，栈顶允许操作，栈底不允许操作。 栈的特点是：先进后出，或者说是后进先出，从栈顶放入元素的操作叫入栈，取出元素叫出栈。

• 栈： 先进后出（入口出口在同一侧）

3.队列（Queue）

队列与栈一样，也是一种线性表，不同的是，队列可以在一端添加元素，在另一端取出元素，也就是：先进先出。从一端放入元素的操作称为入队，取出元素为出队。

• 队列：先进先出（入口出口在两侧，分开的）

4.链表（Linked List）

链表是物理存储单元上非连续的、非顺序的存储结构，数据元素的逻辑顺序是通过链表的指针地址实现，每个元素包含两个结点，一个是存储元素的数据域 (内存空间)，另一个是指向下一个结点地址的指针域。根据指针的指向，链表能形成不同的结构，例如单链表，双向链表，循环链表等。

• 链表：查询慢，增删快
• 查询慢：链表地址不是连续的，每次查询都要从头开始
• 增删快：增加/删除一个元素，对链表的整体结构没有影响，所以增删快

5.散列表(Hash)

散列表，也叫哈希表，是根据关键码和值 (key和value) 直接进行访问的数据结构，通过key和value来映射到集合中的一个位置，这样就可以很快找到集合中的对应元素。

Hash表是一种特殊的数据结构，它同数组、栈、链表等相比较有很明显的区别，它能够快速定位到想要查找的记录，而不是与表中存在的记录的关键字进行比较来进行查找。

哈希表是基于键值对的一种数据存储结构，key值不可以重复，value可以重复，后面添加的重复的key值的时候，会把之前key值对应的value给覆盖掉，JavaScript中的对象具有天然的哈希特性。

6.树（Tree）

树是一种数据结构，它是由n（n>=1）个有限节点组成一个具有层次关系的集合。把它叫做 “树” 是因为它看起来像一棵倒挂的树，也就是说它是根朝上，而叶朝下的。在日常的应用中，我们讨论和用的更多的是树的其中一种结构，就是二叉树。

7.堆（Heap）

堆是一种比较特殊的数据结构，可以被看做一棵树的数组对象，具有以下的性质： 堆中某个节点的值总是不大于或不小于其父节点的值； 堆总是一棵完全二叉树。

8.图（Graph）

图是由结点的有穷集合V和边的集合E组成。其中，为了与树形结构加以区别，在图结构中常常将结点称为顶点，边是顶点的有序偶对，若两个顶点之间存在一条边，就表示这两个顶点具有相邻关系。

 

https://segmentfault.com/a/1190000020011987

常见数据结构的 JavaScript 实现系列

• Stack
• Queue
• List
• Set
• Dictionary
• Hash Table
• Binary Tree
• Graph### 前端与数据结构

数据结构在开发中是一种编程思想的提炼，无关于用何种语言开发或者是哪种端开发。下列将笔者涉猎到的与前端相关的数据结构案例作如下总结：

数据结构	案例
栈	FILO: 其它数据结构的基础，redux/koa2 中间件机制
队列	FIFO：其它数据结构的基础
链表	React 16 中的 Fiber 的优化
集合	对应 JavaScript 中的 Set
字典	对应 JavaScript 中的 Map
哈希表	一种特殊的字典，可以用来存储加密数据
树	DOM TREE / HTML TREE / CSS TREE
图	暂时没遇到，不过里面的 BFS/DFS 蛮常见