zoukankan      html  css  js  c++  java
  • JavaScript基础对象---Map

    一、创建Map对象

    Map 对象保存键值对。任何值(对象或者原始值) 都可以作为一个键或一个值

    1.构造函数

    语法:new Map([iterable])
    参数:

            iterable  可以是一个数组或者其他 iterable 对象,其元素或为键值对,或为两个元素的数组;每个键值对都会添加到新的 Map,null 会被当做 undefined

    
        let arr = [1,2,3];
        let myMap = new Map(arr.entries());
        console.log(myMap.get(0)); // 1
    

    二、Map实例属性

    1.myMap.size 可访问属性返回 Map 对象的元素数量

    size 属性的值是一个整数,表示 Map 对象有多少个键值对。size 是只读属性,它对应的 set 方法是 undefined,即不能改变它的值

    
        let myMap = new Map();
        myMap.set("a", "alpha");
        myMap.set("b", "beta");
        myMap.set("g", "gamma");
        console.log(myMap.size); // 3
    

    三、Map实例方法

    1.set()

    语法:myMap.set(key, value)

    参数:
            key 必填,添加到Map对象的元素的key值
            value 必填,添加到Map对象的元素的value值

    
        let myMap = new Map();
        myMap.set("bar", "foo");
        myMap.set(1, "foobar");
        // 在Map对象中更新一个新元素
        myMap.set("bar", "baz");
    

    2.get()

    语法:myMap.get(key)

    参数:
            key 想要获取的元素的键

    返回值:返回一个Map对象中与指定键相关联的值,如果找不到这个键则返回undefined

    
        let myMap = new Map();
        myMap.set("bar", "foo");
        console.log(myMap.get("bar"));  // "foo"
        console.log(myMap.get("baz"));  // undefined
    

    3.has()

    语法:myMap.has(key)

    参数:
             key 必填,用来检测是否存在指定元素的键值

    返回值:如果指定元素存在于Map中,则返回true。其他情况返回false

    
        let myMap = new Map();
        myMap.set("bar", "foo");
        console.log(myMap.has("bar"));  // returns true
        console.log(myMap.has("baz"));  // returns false
    

    4.delete() 方法用于移除 Map 对象中指定的元素

    语法:myMap.delete(key)

    参数:
            key 必须,从 Map 对象中移除的元素的键(key)

    返回值:如果 Map 对象中存在该元素,则移除它并返回 true;否则如果该元素不存在则返回 false

    
        let myMap = new Map();
        myMap.set("bar", "foo");
        myMap.delete("bar"); // 返回 true。成功地移除元素
        console.log(myMap.size); // 0
    

    5.clear()方法会移除Map对象中的所有元素

    语法:myMap.clear()

    
        let myMap = new Map();
        myMap.set("bar","baz");
        myMap.set(1,"foo");
        console.log(myMap.size); // 2
        myMap.clear();
    

    6.entries()

    语法:myMap.entries()

    返回值:返回一个新的包含[key, value]对的Iterator对象,返回的迭代器的迭代顺序与Map对象的插入顺序相同

    
        let myMap = new Map();
        myMap.set("0", "foo");
        myMap.set(1, "bar");
        myMap.set({}, "baz");
    
        let mapIter = myMap.entries();
        console.log(mapIter.next().value); // ["0", "foo"]
        console.log(mapIter.next().value); // [1, "bar"]
        console.log(mapIter.next().value); // [Object, "baz"]
    

    7.keys() 返回一个新的 Iterator 对象。它包含按照顺序插入Map对象中每个元素的key值

    语法:myMap.keys()

    
        let myMap = new Map();
        myMap.set("0", "foo");
        myMap.set(1, "bar");
        myMap.set({}, "baz");
    
        let mapIter = myMap.keys();
        console.log(mapIter.next().value); // "0"
        console.log(mapIter.next().value); // 1
        console.log(mapIter.next().value); // Object
    

    8.values() 方法返回一个新的Iterator对象。它包含按顺序插入Map对象中每个元素的value值

    语法:myMap.values()

    
        let myMap = new Map();
        myMap.set("0", "foo");
        myMap.set(1, "bar");
        myMap.set({}, "baz");
    
        let mapIter = myMap.values();
        console.log(mapIter.next().value); // "foo"
        console.log(mapIter.next().value); // "bar"
        console.log(mapIter.next().value); // "baz"
    

    9.forEach()

    语法:myMap.forEach(callback[, thisArg])

    参数:
            callback 必要,每个元素所要执行的函数
            thisArg 可选,callback 执行时其 this 的值

    
        let myMap = new Map([["foo", 3], ["bar", {}], ["baz", undefined]]);
        myMap.forEach((value,key,map) => {
            console.log("key =",key,",value =",value); //key = foo ,value = 3
        });
    

    原文地址:https://segmentfault.com/a/1190000016724865

  • 相关阅读:
    面向对象的六大原则
    系统整体框架介绍
    键盘控制div上下左右移动 (转)
    逆向wireshark学习SSL协议算法(转)
    在CentOS下安装配置MySQL(转)
    ps 专题
    用Linux/Unix命令把十六进制转换成十进制(转)
    2014由于在myeclipse5.5.1许可证
    美国地名索引(在美国的英文名市、中国)
    Memcache存储大量数据的问题
  • 原文地址:https://www.cnblogs.com/lalalagq/p/9903819.html
Copyright © 2011-2022 走看看