Set、Map集合及其源码

最新推荐文章于 2024-07-02 08:00:00 发布
最新推荐文章于 2024-07-02 08:00:00 发布
阅读量167 收藏
点赞数
分类专栏： js es6
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/wsh20210301/article/details/118113890
版权
js 同时被 2 个专栏收录
20 篇文章 0 订阅
订阅专栏
es6
1 篇文章 0 订阅
订阅专栏

 

Set集合

定义：

是一种数据的存储结构，不同的场景运用不同的集合存储数据。存放的数据必须为可迭代对象。

作用：

用于存放不重复的数据。

原型方法：

方法和属性含义
add(value)添加某个值，返回Set结构本身
delete(value)删除某个值，返回一个布尔值，表示删除是否成功
has(value)返回一个布尔值，表示该值是否为Set的成员
clear()清除所有成员，没有返回值
keys()返回键名的遍历器
values()返回键值的遍历器
entries()返回键值对的遍历器(for in)
forEach()使用回调函数遍历每个成员
size获取成员个数

实例应用

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        let s=new Set([1,2,2,3,3,4,5,5]);
        console.log(s);//[1,2,3,4,5]

        s.add(10)
        s.add(20)
        console.log(s);//[1,2,3,4,5,10,20]
        

        console.log(s.delete(1));//[2,3,4,5,10,20]
        

        console.log( s.has(2));//true
        
        console.log(s.keys());//{2, 3, 4, 5, 10, …}
        console.log(s.values());//{2, 3, 4, 5, 10, …}
        console.log(s.entries());//{2 => 2, 3 => 3, 4 => 4, 5 => 5, 10 => 10, …}

        s.clear()
        console.log(s);//{}
       

    </script>
</body>
</html>

简单练习

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        const arr1 = [12,34,55,33,11,33,5,12]
        const arr2 = [55,34,11,78,10,19,88,88,99,99]
        // 使用set集合完成两个数组的交集、并集和差集

        const cross = [...new Set(arr1)].filter(item => arr2.indexOf(item) >= 0)
        console.log(cross)


        const result = [...new Set([...arr1,...arr2])]
        console.log(result)

        console.log(result.filter(item => cross.indexOf(item) < 0))

    </script>
</body>
</html>

Set源码

class MySet{
    constructor(iterator = []){
        // 传递的内容必须是一个可迭代对象
        if(typeof iterator[Symbol.iterator] !== "function"){
            throw new TypeError(`您所提供的${iterator}不是一个可迭代对象`)
        }
        this._datas = [];
        for(const item of iterator){
            this.add(item)
        }
    }
    get size(){
        return this._datas.length
    }
    add(data){
        if(!this.has(data)){
            this._datas.push(data)
        }
    }
    has(data){
        for(const item of this._datas){
            if(this.isEqual(item,data)){
                return true
            }
        }
        return false
    }
    delete(data){
        for(let i = 0 ;i<this._datas.length;i++){
            const element = this._datas[i];
            if(this.isEqual(element,data)){
                this._datas.splice(i,1)
                return true
            }
        }
    }
    clear(){
        this._datas.length = 0
    }
    *[Symbol.iterator](){
        for(const item of this._datas){
            yield item;
        }
    }
    forEach(callback){
        for(const item of this._datas){
            callback(item,item,this)
        }
    }
    // 判断两个数据是否相等
    isEqual(data1,data2){
        if(data1 == 0 && data2 == 0){
            return true
        }
        return Object.is(data1,data2)
    }
}

map集合

定义：

类似于对象，里面保存的数据是键值对的形式但是“键”的范围不限于字符串，各种类型的值（ 包括对象）都可以当作键和Object的区别是Map的键名可以为值参数必须是数组，数据项也要为数组

作用：

键名不重复,以键值对的形式存储。

原型方法：

方法和属性含义
set(key, value)set方法设置键名key对应的键值为value，然后返回整个 Map 结构。如 果key已经有值，则键值会被更新，否则就新生成该键
delete(value)删除某个值，返回一个布尔值，表示删除是否成功
has(value)返回一个布尔值，表示该值是否为Set的成员
clear()清除所有成员，没有返回值
keys()返回键名的遍历器
values()返回键值的遍历器
entries()返回键值对的遍历器(for in)
forEach()使用回调函数遍历每个成员
size获取成员个数
get(key)get方法读取key对应的键值，如果找不到key，返回undefined

实例应用

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        // 数组中的子数组里面只能有两项，第一项代表键名，第二项代表键值
        const map = new Map([
            ["a", 1],
            [1, 2],
            [true, 3]
        ])
        console.log(map)
        // 添加属性
        map.set("b", 4)
        // 取值
        console.log(map.get(true))
        // 取长度
        console.log(map.size)

        const map = new Map()
        map.set({}, 1)
        map.set({}, 2)
        let obj = {};
        map.set(obj, 1)
        map.set(obj, 2)
        console.log(map.size)


        for (const iterator of map) {
            console.log(iterator)
            console.log(iterator[0], iterator[1]) //一般不会这么写
        }
        //for of 遍历可迭代对象
        for (const [key, value] of map) {
            console.log(key, value)
        }

        console.log(map);
        map.forEach((value, key, map) => {
            console.log(value, key, map)
            // value 值
            // key 键
            // map对象本身
        })
    </script>
</body>

</html>

map源码

class MyMap{
    constructor(iterator = []){
        if(typeof iterator[Symbol.iterator] !== "function"){
            throw TypeError(`您所提供的${iterator}不是一个可迭代对象`)
        }
        this._datas = [];//
        for (const item of iterator) {
            if(typeof item[Symbol.iterator] !== "function"){
                throw TypeError(`您所提供的${item}不是一个可迭代对象`)
            }
            // const key = item[0];
            // const value = item[1];
            const iter = item[Symbol.iterator]();
            const key = iter.next().value;//["a",1]
            const value = iter.next().value;
            this.set(key,value)
        }
    }
    set(key,value){
        const obj = this._getObj(key);
        if(obj){//如果key值相同则覆盖值
            obj.value = value
        }else{
            this._datas.push({
                key,
                value
            })
        }
    }
    get(key){
        const obj = this._getObj(key);
        if(obj){
            return obj.value
        }
        return undefined;
    }
    get size(){
        return this._datas.length;
    }
    delete(key){
        for(let i = 0 ;i<this._datas.length;i++){
            const element = this._datas[i];
            if(this.isEqual(element.key,key)){
                this._datas.splice(i,1)
                return true
            }
        }
        return false;
    }
    clear(){
        this._datas.length = 0
    }
    has(key){
        return this._getObj(key) !== undefined;
    }
    *[Symbol.iterator](){
        for(const item of this._datas){
            yield [item.key,item.value]
        }
    }
    forEach(callback){
        for (const item of this._datas) {
            callback(item.value,item.key,this)
        }
    }
    _getObj(key){
        for(const item of this._datas){
            if(this.isEqual(item.key,key)){
                return item
            }
        }
    }
    isEqual(data1,data2){
        if(data1 === 0 && data2 === 0){
            return true;
        }
        return Object.is(data1,data2)
    }
}

 

小猫爱摸鱼
关注
专栏目录
java集合类源码分析之Set详解
08-29
Java集合类源码分析之Set详解 Java集合类中的Set Interface是用于存储无序、不可重复元素的集合接口。Set Interface继承自Collection Interface，提供了基本的集合操作，如add、remove、contains等。Set Interface...
记录一次发现Webpack源码泄露（js.map泄露）过程
qq_41760817的博客
12-13 7572
记录发现webpack源代码泄露的复现，js.map文件泄露
原生js源码之Array数组map方法
编程界明世隐的博客
12-04 1917
map方法创建一个新数组，其结果是该数组中的每个元素是执行一次提供的函数后的返回值。 语法： var new_array = arr.map(callback(item[, index[, array]])) 说明 arr：原数组 callback：提供的要执行的函数 item：当前元素 index：当前索引 array：原数组 new_array：返回的数组 下面实现代码： Array.prototype.myMap=function(callbac...
js|es6容器对象map讲解(含测试源码)
执念斩长河
05-28 668
本博文源于JavaScript基础，讲解Set对象操作包括创建与对象的属性讲解。 Set对象的创建 Set是一种集合类型，类似于Array数组，不同的是：set不可以重复，set元素散列。可类比成数学中集合。 Set对象的属性 ...
.js.map文件泄露/Springboot信息泄露
最新发布
qq_68163788的博客
07-02 2129
.js.map文件泄露/Springboot信息泄露是一种常见的安全漏洞，可能导致敏感信息泄露。.js.map文件通常用于调试JavaScript代码，包含了源代码和调试信息。如果这些文件未经适当保护而被暴露在公共网络上，攻击者可以通过查看这些文件来获取关键代码、URL和其他敏感信息。 与此同时，Spring Boot是一个流行的Java应用程序框架，但在错误配置的情况下，可能会导致敏感信息的泄露。例如，如果开发人员在应用程序中使用了默认的配置而没有适当地对其进行安全性检查和配置，可能会导致敏感信息。
JS如何实现ES6 Map源码
weixin_34184158的博客
12-06 1584
Map是一个非常棒的实例，它可以支持Object,Array,Function,number....等做为key，以下代码可以帮助大家更好的了解它的原理及特性。 注意：以下为个人Demo，并非严谨测试; //获取一个唯一标识 function getUid(){ return Math.random().toString(36) } 复制代码//在对象中属性是否存在 function ha...
Java集合源码全面分析
09-02
Java集合框架是Java编程语言中不可或缺的一部分，它提供了一系列接口和类，用于高效地存储和操作数据。...同时，掌握集合框架的源码也有助于理解和使用并发包中的线程安全集合，以及Java 8引入的流API等高级特性。
Java 容器类源码详解 Set
08-25
Java 容器类源码详解 Set 是 Java 集合框架中的一种重要的集合类型，直接扩展自 Collection 接口。Set 表示由无重复对象组成的集合，在一个 Set 中，不能有两个引用指向同一个对象，或两个指向 null 的引用。如果...
hibernate map 集合映射
03-16
Map集合映射比较特殊，因为它的键和值都可以是任何对象。键通常映射到数据库的某个字段，而值则映射到另一个对象。以下是一个例子： ```xml <!-- User.hbm.xml --> <map name="properties" table="USER_PROPERTIES...
Map集合 java
04-16
### Map集合在Java中的应用与理解 #### 一、Map集合概述 Map接口是Java集合框架中的一个重要组成部分，它提供了一种将唯一键映射到特定值的方式。Map中的每个元素都包含一个键对象（key）和对应的值对象（value）...
map的js实现
04-15
附件为map.js和测试html页面 博文链接：https://dote.iteye.com/blog/1756636
利用js实现Map
12-25
里面包含两个实例，js实现map的相关功能
用js实现map功能
04-27
* Map对象，实现map功能 * put(key, value) 向map中增加键值对 * 例子: * var map = new Map(); * * map.put("key", "value"); * var val = map.get("key");
js实现map用法
04-11
NULL 博文链接：https://hoochiang.iteye.com/blog/1688307
js原生map实现的方法总结
11-21
js原生方法map实现 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <meta name="author" content="杨欣"> <title>map</title> </head> <body> [removed] Array
js手写原生map
qq_56696697的博客
06-07 311
在 JavaScript 中，Map 是一种集合数据结构，它能够存储键值对。Map 的底层实现通常是依赖于哈希表（Hash Table）或红黑树等高效的数据结构。这里我将简要介绍哈希表作为底层实现的原理。哈希表是一种基于数组的数据结构，它通过哈希函数将键转化为数组的索引。
JS实现集合Set（代码+测试）
weixin_46726346的博客
12-16 320
代码 <script> //定义集合类 function Set() { this.dataStore = []; } //添加方法（不能允许元素重复） Set.prototype.add = function (element) { if (this.dataStore.indexOf(element) < 0) { th
使用Javascript实现简单的Map
苏屿峰的专栏
09-19 1047
最近做的一个项目需要大量地使用到js脚本，于是花了点时间阅读了prototype及extjs等流行js库的一些实现。js作为已经应用了多年的面向过程的客户端脚本语言，近两年随着Ajax技术的应用而再度流行起来，并且在代码实现的复杂度提高了许多，因此需要通过模拟服务端语言的一些面向对象特征，使得js代码的编写更有抽象性、灵活性及可维护性。　　Map的数据结果对于服务端语言来说是再平常不过，但对于js
js中map()的使用详解
前端-尔嵘
10-29 6999
在JavaScript的Array中，它返回一个新的数组，数组中的元素为原始数组调用函数处理后的值。map是数组的方法，有一个参数，参数是一个函数，函数中有3个参数。参数2：index，可选。当前元素在数组中的索引值。参数3：arr可选。当前元素属于的数组对象。那这个作为map参数的函数是怎么被调用的呢。参数1：item必须。map()不会对空数组进行检测。返回一个由原数组每个元素乘以2后返回的新数组。map()不会改变原数组。
Java集合框架深度解析：Map、Set、List源码探秘
"这份PDF文档详细解析了Java编程中常见的集合框架——Map、Set、List的底层实现原理，并结合数据结构的基础知识，特别是树的概念，进行了深入的探讨。文档内容包括Map底层原理分析、LinkedList和ArrayList的原理分析...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值