首页 > 技术文章 > H5前端技术文章 >

邂逅数据结构&算法(六)集合

更新时间:2018-12-19 | 阅读量(1,033)

> 几乎每种编程语言中, 都有集合结构. > > 几乎比较常见的实现方式时哈希表(后续会学习), 我们这里来实现一个封装的集合类. ### 一. 集合介绍 > 我们先来简单认识一下集合的特点. #### 集合的特点 * 集合通常是由一组无序的, 不能重复的元素构成. * 和数学中的集合名词比较相似, 但是数学中的集合范围更大一些, 也允许集合中的元素重复. * 在计算机中, 集合通常表示的结构中元素是不允许重复的. * 看成一种特殊的数组 * 其实集合你可以将它看成一种特殊的数组. * 特殊之处在于里面的元素没有顺序, 也不能重复. * 没有顺序意味着不能通过下标值进行访问, 不能重复意味着相同的对象在集合中只会存在一份. #### 集合的实现 * 我们要像之前学习其他数据结构一样, 来学习一下集合. * 最主要的学习方式就是封装一个属于自己的集合类, 并且可以通过该类进行集合相关的操作. * 2011年6月份发布的ES5中已经包含了Array类 * 2015年6月份发布的ES6中包含了Set类, 所以其实我们可以不封装, 直接使用它. * 但是这里, 为了明确集合的内部实现机制, 我们这里还是自己来封装一下这个Set类. ### 二. 封装集合 > 像前面封装其他数据类型一样, 我们也来封装一下集合类(Set类) #### 创建集合类 * 我们先来封装一个Set类 ```javascript // 封装集合的构造函数 function Set() { // 使用一个对象来保存集合的元素 this.items = {} // 集合的操作方法 } ``` * 代码解析: * 代码就是封装了一个集合的构造函数. * 在集合中, 添加了一个items属性, 用于保存之后添加到集合中的元素. 因为Object的keys本身就是一个集合. * 后续我们给集合添加对应的操作方法. #### 操作的方法 * 集合有哪些常见的操作方法呢? * `add(value)`:向集合添加一个新的项。 * `remove(value)`:从集合移除一个值。 * `has(value)`:如果值在集合中,返回`true`,否则返回`false`。 * `clear()`:移除集合中的所有项。 * `size()`:返回集合所包含元素的数量。与数组的length属性类似。 * `values()`:返回一个包含集合中所有值的数组。 * 还有一些集合其他相关的操作, 暂时用不太多, 这里暂不封装. * 我们来一个个实现这些方法, 相对都比较简单. * `has(value)`方法 ```javascript // 判断集合中是否有某个元素 Set.prototype.has = function (value) { return this.items.hasOwnProperty(value) } ``` * `add`方法 ```javascript // 向集合中添加元素 Set.prototype.add = function (value) { // 1.判断集合中是否已经包含了该元素 if (this.has(value)) return false // 2.将元素添加到集合中 this.items[value] = value return true } ``` * `remove`方法 ```javascript // 从集合中删除某个元素 Set.prototype.remove = function (value) { // 1.判断集合中是否包含该元素 if (!this.has(value)) return false // 2.包含该元素, 那么将元素删除 delete this.items[value] return true } ``` * `clear`方法 ```javascript // 清空集合中所有的元素 Set.prototype.clear = function () { this.items = {} } ``` * `size`方法 ```javascript // 获取集合的大小 Set.prototype.size = function () { return Object.keys(this.items).length /* 考虑兼容性问题, 使用下面的代码 var count = 0 for (var value in this.items) { if (this.items.hasOwnProperty(value)) { count++ } } return count */ } ``` * `values`方法 ```javascript // 获取集合中所有的值 Set.prototype.values = function () { return Object.keys(this.items) /* 考虑兼容性问题, 使用下面的代码 var keys = [] for (var value in this.items) { keys.push(value) } return keys */ } ``` #### 集合的使用 * 我们来简单使用和测试一下封装的集合类 ```javascript // 测试和使用集合类 var set = new Set() // 添加元素 set.add(1) alert(set.values()) // 1 set.add(1) alert(set.values()) // 1 set.add(100) set.add(200) alert(set.values()) // 1,100,200 // 判断是否包含元素 alert(set.has(100)) // true // 删除元素 set.remove(100) alert(set.values()) // 1, 200 // 获取集合的大小 alert(set.size()) // 2 set.clear() alert(set.size()) // 0 ``` ### 三. 完整代码 > 最后, 我们还是给出集合的完整代码 * 完整代码 ```javascript // 封装集合的构造函数 function Set() { // 使用一个对象来保存集合的元素 this.items = {} // 集合的操作方法 // 判断集合中是否有某个元素 Set.prototype.has = function (value) { return this.items.hasOwnProperty(value) } // 向集合中添加元素 Set.prototype.add = function (value) { // 1.判断集合中是否已经包含了该元素 if (this.has(value)) return false // 2.将元素添加到集合中 this.items[value] = value return true } // 从集合中删除某个元素 Set.prototype.remove = function (value) { // 1.判断集合中是否包含该元素 if (!this.has(value)) return false // 2.包含该元素, 那么将元素删除 delete this.items[value] return true } // 清空集合中所有的元素 Set.prototype.clear = function () { this.items = {} } // 获取集合的大小 Set.prototype.size = function () { return Object.keys(this.items).length /* 考虑兼容性问题, 使用下面的代码 var count = 0 for (var value in this.items) { if (this.items.hasOwnProperty(value)) { count++ } } return count */ } // 获取集合中所有的值 Set.prototype.values = function () { return Object.keys(this.items) /* 考虑兼容性问题, 使用下面的代码 var keys = [] for (var value in this.items) { keys.push(value) } return keys */ } } ```
叩丁狼学员采访 叩丁狼学员采访
叩丁狼头条 叩丁狼头条
叩丁狼在线课程 叩丁狼在线课程