Javascript中Set和WeakSet类型的数据结构,Set数据结构学习

By admin in 4858美高梅 on 2019年4月16日

ES6 提供了新的数据结构
Set。它好像于数组,可是成员的值都是唯壹的,未有重新的值。

世家好混元霹雳手Ziksang又来了,给我们讲讲es陆,Set这几个新的数据结构

4858美高梅 1

新禧初三,先给大家拜个年,作者驾驭小编的拜情势错了!!红包将在打到你的支付宝中,请接到!

二〇一七年的对象便是把ecmscript6存有的知识点全弄理解,作者深信之后会基于ecmascript六的新特征分明会出部分更牛B的框架,就好像vue同样用了Object.defineProperty
ecmascript5的新特点来开始展览多少威迫,所以小编很愿意

①.简易介绍

  ES6提供了新的数据结构SetSet对象不是数组,
能够用来保存对象或然基本项目, 全体保留的值都以唯一的,
chrome浏览器>38和FF>13,以及nodeJS,对Set支撑美好,
以下的有的代码,都足以拷贝到调节台直接运转哦;

Set 本身是1个构造函数,用来生成 Set 数据结构。

粗略介绍一下呢

Set基本介绍

Set是ES陆中数据结构中内部三个新的特色,我们看起来往往很像数组,然而他的种种成员都以唯1的,不会设有双重的值

Set也是一个构造函数,用来生成Set那一个数据结构,大家能够看看他实例原型上有那些东西,轻巧看一下

4858美高梅 2

在set原型上放了那般多措施,接下去本身逐一介绍一下呢,记住学习必就要学到根本!!!!

留神自身的每一步代码都以自上而下有着关系的

add方法

let set = new Set()
let array = [1,"ziksang",3,3,true,5,5]
array.forEach(item => {
        set.add(item)
})
console.log(set)
// Set {1, "ziksang", 3, true, 5}

一.先new出set这些构造函数实列,大家存在set变量上
2再声美素佳儿个array那个数组,里面包车型地铁数组成员有各样数据类型和另行的值
3.用Set原型上add方法把用es5中each方法把各类值增加到set成员里
4.打字与印刷出来是三个目标,里面同样体系同样值都会去掉,不过中间的总体布局和类组数对象同样,有着和谐的长度

 for (let i of set) {
         console.log(i);
         console.log(typeof i)
}

上述大家再次用for
of的点子也,一样也是es6的新特点,此时就足以把set对象里每二个值能够打字与印刷出来,里面包车型地铁打字与印刷出的每3个数据类型也一律是我们array数组里定义的数据类型


地点代码通过add方法向Set结构插手成员,结果声明Set结构不会拉长重复的值。
Set函数尚可1个数组(或左近数组的靶子)作为参数,用来早先化。

        function demo(){
            let set = new Set(arguments)
            console.log(set)
        }
        demo(1,2,4,4,5)
        //Set {1, 2, 4, 5}
        let set = new Set([1,2,4,4,5])
        console.log(set)
        //Set {1, 2, 4, 5}

壹.Set函数里大家能够承受参数来作为初叶化跟new
Array[1,2,3,4]属性是壹模同样的
二.率先个自小编在demo函数里让set函数接收了demo里arguments对象作为参数
三.次之个自小编直接在set函数里放入三个数组
4.两都console.log()打字与印刷出来的是一样的,同样不会含有同种类同样的值的积极分子

size方法

size方法是用来推断出,set里成员的个数

var items = new Set([1, 2, 3, 4, 5, 5, 5, 5]);
items.size // 5

1.就算下边作者定义了7个分子数量,不过最后个数唯有五个,因为依然1如既往的不会把重复同系列同样的值算进去,只算多个

数组去重方法
在以前数自身面试的时候外人1直接笔者数组去重怎么着,小编以后只想应对他,看上面

       let array = [1,2,2,3,3,4]
       let set = new Set(array)
       array = [...set]
       console.log(array)
      //[1,2,3,4]

一.扬言3个数组
2.把数组作为set构造函数的早先化成员
3.再把set用[…set]来再一次复制给array//简称拓展运算符…
四.恢宏运算符(…)内部使用for…of循环,所以也足以用来Set结构。

有关类型转变,NaN,object的区分

在往set数据结构中增加值的值,并不会产生类型调换,肆和“四”不相同的数据类型不会发出转移,他的中间是用Same-value equality,也正是跟恒等大多,不过NaN分歧等很奇异

       console.log(NaN === NaN) //false
       const a = NaN;
       const b = NaN;
       const c = "1";
       const d = 1;
       let set = new Set()
       set.add(a)
       set.add(b)
       set.add(c)
       set.add(d)
       console.log(set) //Set {NaN, "1", 1}

一.纵然单单的比对NaN ===
NaN肯定是不等于的,可是在set数据结构中,里面包车型地铁盘算原理是把NaN看成相等的


对此五个对象的话,无是里面是否有值
,可者有啥的值都以不等于的,空对象也不对等

       let set = new Set()
       set.add({})
       set.add({})
       console.log(set)  //Set {Object {}, Object {}}
       console.log(set.size)//2

一.方可看来空对象是不对等的,所以它们被视为几个值。总个数照旧是二个


Set实例的习性和方法,相当于Set构造函数上定义的不2诀要和属性

Set结构的实例有以下属性。
Set.prototype.constructor:构造函数,暗许便是Set函数。
Set.prototype.size:再次来到Set实例的积极分子总量。

Set实例的艺术分为两大类:操作方法(用于操作数据)和遍历方法(用于遍历成员)。上面先介绍七个操作方法。

add(value):增加某些值,重回Set结构自身。
delete(value):删除有些值,再次来到三个布尔值,表示删除是或不是中标。
has(value):重返3个布尔值,表示该值是或不是为Set的成员。
clear():清除全数成员,未有重临值。

Javascript中Set和WeakSet类型的数据结构,Set数据结构学习。size和add作者在头里已经讲过了,再轻便提一下啊

        let set = new Set()
        set.add(3).add(2).add(2).add("ziksang");
        console.log(set)//set{3,2,ziksang}
        console.log(set.has(3)) //true
        console.log(set.delete(2))  //true
        console.log(set)   //set{3,ziksang}
        console.log(set.clear()) //undefined
        console.log(set) //set{}

1.我们new出Set构造函数的实列对象开始展览两个1个add进行增加,不过增多了七个同种类同样值
的2 !最终打字与印刷出来同样的四个会被剔除
二.set.has()是实行对set数据结构中成员是不是留存的判断
三.剔除set数据结构中成员
4set.clear()是进展破除全部成员,set实列也为此成为了3个空对象


今非昔比相比较的例证,看看Object和Set五个数据结构剖断方法分裂

        let obj={
            name : "ziksang",
            age : 22
        }
        let set = new Set(["name",22])
        if(obj.name){
            console.log("在对象里有name这个健值")
        }
        if(set.has("name")){
            console.log("set数据结构中有name这个成员")
        }

2.数组转Set

  创设Set实例的着力方法为:

let set = new Set(); //或者 new Set(null);
console.log(set);

  只怕那样:

let set = new Set([1,2,3,4,4,4,4,4]);
console.log( Array.from(set) ); //输出:[ 1, 2, 3, 4 ]

  能够见到,以上海重机厂复的4,在set在那之中只保留了3个,
所以Set对象能够用来给数组去重;

  Set也能用来保存NaN和undefined, 即使有双重的NaN,
Set会感觉就叁个NaN(实际上NaN!=NaN);

  实例Set现在的对象具备这么些品质和措施

    属性
    Set.prototype
    Set.prototype.size
    方法
    Set.prototype.add()
    Set.prototype.clear()
    Set.prototype.delete()
    Set.prototype.entries()
    Set.prototype.forEach()
    Set.prototype.has()
    Set.prototype.values()
    Set.prototype[@@iterator]()

  Set那种类型的数据结构其实大家得以一贯用数组模拟出去,
纵然不可能和原生的比, 只好模拟以上列表的1些方法属性(
还有局地成效不能够落实的 , Set实例的[Symbol.species]针对本身,
不过chrome中一贯不[Symbol.species]本条家伙儿…. )

const setset = new Set([1, 2, 3, 4, 4]);

setset
>>Set(4) {1, 2, 3, 4}

setset.size  // set长度用size属性
>>4

[...setset] //使用扩展运算符 将set结构变数组结构
>> [1, 2, 3, 4]

提示

1.[阮一峰]用obj[somename]来判定是不是对象里有其一健,打出去是undefined,以上校订了一晃
二.确定set数据结构中是还是不是有有个别成员,用set.has()来剖断


其余再介绍一下另1种数组去重方式

Array.from()是es六数组中新带的叁个办法

        function demo(array){
            return Array.from(new Set(array))
        }
        let result = demo([1,1,2,2,3])
        console.log(result)//1,2,3

Array.from是怎么鬼未来具体讲到es6数组小编给我们讲讲,小编先天只知其一,不知其2,讲不深透的就不给大家讲


遍历操作
Set结构的实例有八个遍历方法,能够用来遍历成员。

keys():再次来到键名的遍历器
values():再次回到键值的遍历器
entries():再次来到键值对的遍历器
forEach():使用回调函数遍历各样成员
内需尤其提出的是,Set的遍历顺序正是插入顺序。这么些特点有时相当有用,比如利用Set保存3个回调函数列表,调用时就能担保依据加多顺序调用。

keys方法、values方法、entries方法重临的都是遍历器对象,因为set未有健名唯有健值
,所以健名和健值能够算得同贰个值 ,keys和values重回的都以同多少个值

       let set  = new Set([1,2,3,4])
       for(item of set.keys()){
           console.log(item) //1,2,3,4
       }
       for(item of set.values()){
           console.log(item) //1,2,3,4
       }
       for(item of set.entries()){
           console.log(item) //[1,1],[2,2],[3,3],[4,4]
           console.log(typeof item)//都是object对象
       }

1.keys,values,entries()重临的皆以遍历器对象
二.entries再次回到的是健值对,因为为健和值都以均等的,所以中间四个也一如既往,可是回到出来是是三个对象,本值
上是三个类数组对象


Set结构的实例默承认遍历,它的暗中同意遍历器生成函数正是它的values方法。第二个张图小编也打字与印刷出prototype原型上的措施和总体性里,里面包车型大巴symbol.iterator里是values()所以也得以一直for
of Set构造函数重回的实例

Set.prototype[Symbol.iterator] === Set.prototype.values
// true

       let set  = new Set([1,2,3,4])
       for(item of set){
           console.log(item) //1,2,3,4
       }

能够见到大家平素遍历SET实例和调用value()重回的遍历器对象是平等的


forEach()

Set结构的实例的forEach方法,用于对各类成员施行某种操作,没有再次来到值。

       let set  = new Set([1,2,3,4])
       set.forEach(function(value,key){
           console.log(value*key) //1,4,9,16
       })

地点代码说明了,对set实例里的健和值互乘,其实value和key都以三个值


数组的map和filter方法也能够用set上

       let set  = new Set([1,2,3])
       set = new Set([...set].map(item => item*2))
       console.log(set) //{2,4,6}
       set2 = new Set([...set].filter(item =>item>3))
       console.log(set2)//{4,6}

给我们解释一下用了那一个重要性办法
1[…set]把set实例进行转成数组再用map方法把线个值乘二给再次来到当作Set函数里的分子
二.filter方法也是同理,只是对数组 的值 进行筛选再重临


从而利用Set能够很轻便地实现并集(Union)、交集(Intersect)和差集(Difference)。
1.并集Union

        let a = new Set([1,2,3,4,5])
        let b = new Set([1,2,3,6,7])
        let set = new Set([...a,...b])
        console.log(set) //1,2,3,4,5,6,7

上边把a,b里遍历出来在放入数组,再用set的特征开始展览去重

2.交集

        let a = new Set([1,2,3,4,5])
        let b = new Set([1,2,3,6,7])
        let intersect = new Set([...a].filter(x => b.has(x)))
        console.log(intersect) //{1,2,3}

上面是把a举办转向成数组用filter进行过滤,过滤的回来结果是b里面有的值

差集

        let a = new Set([1,2,3,4,5])
        let b = new Set([1,2,3,6,7])
        let intersect = new Set([...a].filter(x => !b.has(x)))
        console.log(intersect) //{4,5}

3.选取Set给数组去重

  使用数组模拟八个Set构造器:

4858美高梅 34858美高梅 4

<html>
<head>
    <meta charset="utf-8">
</head>
<body>
<script>
    "use strict";
    class Set {
        //对_set进行去重;
        static refresh () {
            let _this = this;
            let __set = []
            this._set.forEach(function(obj) {
                if( __set.indexOf(obj) === -1 && obj!=undefined) {
                    __set.push(obj);
                }
            });
            _this._set =__set;
            this.size = _this._set.length;
        }
        constructor(arg) {
            this.size = 0;
            this[Symbol.species] = this;
            this._set = Array.isArray(arg)&&arg||[];
            Set.refresh.call(this)
        }
        add (obj) {
            this._set.push(obj);
            Set.refresh.call(this)
            return this;
        }
        clear () {
            this._set.length = 0;
            return this;
        }
        delete (obj) {
            if( this._set.indexOf(obj)!=-1 ) {
                this._set[this._set.indexOf(obj)] = undefined;
            };
            Set.refresh.call(this);
            return this;
        }
        /**
         * @desc
         * @return Entries [[],[],[],[]]
         * */
                entries () {
            let result = [];
            this.forEach(function(key, value) {
                result.push([key,value]);
            });
            return result;
        }
        has () {
            if( this._set.indexOf(obj)!=-1 ) return true;
        }
        keys () {
            return this[Symbol.iterator]();
        }
        values () {
            return this[Symbol.iterator]();
        }
        //直接使用数组的forEach方便啊;
        forEach (fn, context) {
            let _this = this;
            this._set.forEach((value) => fn.call(context||value, value, value, _this) );
        }
        //必须支持生成器的写法;
    *[Symbol.iterator] (){
        let index = 0;
        let val = undefined;
        while(index<this.size) {
        val = this._set[index];
        yield  val;
        index++;
    }
    }
    }
    var set = new Set([0,0]);
    //对Set进行基本的操作;
    set.add(1).add(2).add(3).add({1:1})
    set.delete(1);
    set.add(1);
    //使用Set的forEach方法;
    set.forEach(function(key,value,s){console.log(key,value,s,"this")},{this:"this"})
    //检测生成器是否正常运行;
    for(let s of set) {
        console.log(s)
    }
    //因为这个对象有Symbol.iterator, 所以使用扩展符也是好使的;
    console.log([...set]);
</script>
</body>
</html>

View Code

Set 函数能够承受1个数组(比如上边例子中)(只怕持有 iterable
接口的其它数据结构)作为参数,用来开始化。

位置是把a实行转发成数组用filter实行过滤,过滤的回来结果是b里面未有的值

纵然想在遍历操作中,同步转移原来的Set结构,近日并未直接的艺术,但有两种变通方法。1种是应用原Set结构映射出一个新的组织,然后赋值给原本的Set结构;另一种是接纳Array.from方法。

// 方法一
let set = new Set([1, 2, 3]);
set = new Set([...set].map(val => val * 2));
// set的值是2, 4, 6

// 方法二
let set = new Set([1, 2, 3]);
set = new Set(Array.from(set, val => val * 2));
// set的值是2, 4, 6

先是个法子本质上是把set重新张开赋值,先把本来的set里面包车型客车成为用[…set]化为数组再用map来张开双重操作再回来给set构造函数的成员

第三个点子等本身弄懂了再报告我们

此地笔者超过一半都是按着阮1锋先生的书本来张开解析,讲的好的自笔者就记录下来,再用更白的话跟我们讲,有个别不了演说的模糊
的地点也更明亮的跟大家说清朝楚了,接下去小编会把阮一锋先生
ES6兼有的知识点都给大家搞领会,搞通透到底

四.Set实例的品质和措施

  Set实例的习性:

  size属性:size是指那几个Set的尺寸,和数组的length效果等同的”
  constructor属性: 那些天性指向Set构造函数 ,那么些代码就能够完成 (new
Set).constructor === Set //输出:true

 

const set = new Set(document.querySelectorAll('div'));

4.1支持for…of 和foreach循环

  Set实例的艺术:

  add方法,往set添扩张少;

<script>
    Array.from((new Set([1,2])).add(3)); // 输出:[1, 2, 3]
</script>

  

  clear方法,把set里面包车型客车数码清空;

let set = (new Set([1,2,3,4]));
set.clear();
Array.from(set);

  delete方法,删除set里面包车型大巴内定数量:

let set = (new Set([1,2,3,4]));
set.delete(1);
Array.from(set); //输出:[2, 3, 4]

  entries方法:

let set = (new Set([1,2,3,4]));
Array.from(set.entries());

  forEach方法:set的forEach有三个参数,
首个参数为一个函数,第2个参数是非必须的,假诺传了第二个参数,
那么该函数的左右文this正是大家传的第二个参数:

<script>
let set = (new Set([1,2,3,4]));
set.forEach(function() {
    console.log(arguments);
    console.log(this)
},"1111");
</script>

  输出:

  4858美高梅 5

  has方法, has是判断这么些set是还是不是有钦点的值, 再次来到false只怕true;

<script>
let set = (new Set([1,2,3,4]));
console.log(set.has(1)) //输出:true;
console.log(set.has(5)) //输出:false
</script>

  keys方法和values()方法, 那四个艺术都是重返二个迭代器;

<script>
let set = new Set([1,2,3,4]);
console.log(set.keys());
console.log(set.values());

var keys = set.keys();
for(let key of keys) {
    console.log(key);
};
</script>

  @@iterator()方法, @iterator方法是set私下认可的迭代器;

<script>
let set = new Set([1,2,3,4]);
let setIner = set[Symbol.iterator]();
console.log(setIner.next().value) //输出:1
console.log(setIner.next().value) //输出:2
console.log(setIner.next().value) //输出:3
console.log(setIner.next().value) //输出:4
</script>

  实际上大家能够重写set[Symbol.iterator],然而不会对set的keys和values方法发生影响;

  整个DEMO:

4858美高梅 64858美高梅 7

var mySet = new Set();
//往mySet里面添加数据, 1 , 5
mySet.add(1);
mySet.add(5);
mySet.add("some text");
//添加对象
var o = {a: 1, b: 2};
mySet.add(o);

mySet.has(1); // 返回:true
mySet.has(3); // 返回:false
mySet.has(5);              // 返回:true
mySet.has(Math.sqrt(25));  // 返回:true
mySet.has("Some Text".toLowerCase()); // t返回:rue
mySet.has(o); // 返回:true

mySet.size; // 4

mySet.delete(5); // 从mySet里面删除5
mySet.has(5);    // 输出:false, 5 已经被删除了

mySet.size; // 现在的长度为:3

// 通过 for...or循环获取数据;
// 输出: 1, "some text"
for (let item of mySet) console.log(item);

// 输出: 1, "some text"
for (let item of mySet.keys()) console.log(item);

// 输出: 1, "some text"
for (let item of mySet.values()) console.log(item);

// 输出: 1, "some text", 对于Set来说:key和value是一样的
for (let [key, value] of mySet.entries()) console.log(key);

// 把迭代器转化为数组的第一种方式;
var myArr = [v for (v of mySet)]; // [1, "some text"]
// 把迭代器转化为数组的第二种方式;
var myArr = Array.from(mySet); // [1, "some text"]
// 也可以用next()方法,手动去获取每一个值;

View Code

  Set的实在用途:

  利用set能够一本万利的拓展交集和并集:

  求并集, 大家能够给七个方案照旧更加多:

var union = (setA, setB) => {
    //[...setA]这种方式目前只有babel才支持
    return new Seet([...setA,...setB]);
};
var union = (setA, setB) => {
    return new Set(Array.from(setA).concat(Array.from(setB)));
}

  那种获取交集的点子,和数组求交集大概;

var intersect = (set1, set2) => {
    //return [x for (x of set1) if (set2.has(x))]; 这种写法完全不行嘛....
    var resultSet = new Set();
    for(let set of set1) {
        if(set2.has(set)) {
            resultSet.add(set);
        };
    };
    return resultSet;
};

  以下那种代码更加短,太酷了啊,
这一个点子来自:;

var intersect = (set1, set2) => {
    return new Set([...set1].filter(x => set2.has(x)));
}
console.log(intersect(new Set([1,2,3,4]), new Set([2,3,4,5]))); //输出:Set {2,3,4}

要点:

壹、 set剖断五个值是否一样,使用的是===,并不会转化项目。

二、set中不得不有二个NaN,他感到三个NaN相等。

3、set中七个目的始终不等,就算七个空对象,也是见仁见智的。

肆、日常用来数组去重:

// 去除数组的重复成员
[...new Set(array)]

 

伍.和指标写法的对照

  弱引用的WeakSet

  WeakSet对象是有的对象值的汇集,
并且在那之中的各类对象值都只可以出现二次,WeakSet只好存目的类型的元素,比如:Object,
Array, Function 等等;有了弱引用的WeakSet
就无须忧虑内存泄漏了,要是其余对象不引用该对象,
那几个目的会被垃圾回收机制自动回收;

<script>
    console.log(new WeakSet([{},[],()=>({1:1})]));
</script>

  WeakSet对象的点子唯有多个,而且WeakSet对象未有size属性;
    weakSet.add();
    weakSet.delete();
    weakSet.has();

  如若目的不设有引用,
那么WeakSet对象会把未有引用的对象占用的内部存款和储蓄器回收,
上面那么些demo,你能够跑一下,
然后过一会儿(作者的chrome浏览器10S就看看作用了)再看调整台:

<script>
var ws = new WeakSet()
var obj = {}; ws.add(obj);
ws.add([])
setInterval(()=>{
    console.log(ws);
},1000)
</script>

  weakSet能够用来保存DOM节点, 当节点被剔除,
4858美高梅,weakSet其间的该节点假设不存在其他引用的话, 一段时间内会被内部存款和储蓄器回收;

6.Set转数组

   参考:

  MDN:

  ruanyifeng:

作者:
NONO

出处:http://www.cnblogs.com/diligenceday/
QQ:287101329
微信:18101055830 

7.数组的map 和filter 方法用于set数据结构

捌.直接在遍历操作中退换原先的 Set 结构。

————————————-鸽——鸽—-鸽—————————————-

1.轻巧易行介绍

  • 看似于数组
    //差距:成员的值都是唯壹的,未有再一次!以下代码声明:
  • Set自个儿是1个构造函数,用来生成set数据结构

const s = new Set();

[2, 3, 5, 4, 5, 2, 2].forEach(x => s.add(x));

for (let i of s) {
  console.log(i);
}
// 2 3 5 4

二.数组转Set(接受【数组】or【类似数组的对象】参数)

Set函数还行二个数组(只怕具备iterable接口的别的数据结构作为参数),用来开首化。
输出用[…name],Set数据结构有.size方法,也正是数组的length

4858美高梅 8

image.png

上图展现了参数是数组的图景,上边演示参数是目标的意况:

4858美高梅 9

image.png

三.数组去重

倾心一条
骨子里,利用Set数据结构不能够容许重复值的特征,将数组转成set
在转成数组正是去重了。

4858美高梅 10

image.png

给数组去重的另1种艺术

4858美高梅 11

image.png

  • 向 Set 出席值的时候,不会发出类型转变,所以伍和”五”是八个分化的值。Set
    内部判别五个值是不是区别,使用的算法叫做“Same-value
    equality”,它好像于精确相等运算符(===),首要的界别是NaN等于小编,而标准相等运算符以为NaN不对等笔者。
![](https://upload-images.jianshu.io/upload_images/7999981-09875f49c4b8b84c.png)

他认为NaN等于自身的图证!
  • BUT! 他认为三个指标永恒不等于。。
![](https://upload-images.jianshu.io/upload_images/7999981-21f0948040f959b1.png)

明明是两个相同的空对象

四.Set实例的质量和形式

set结构的实例有以下属性

  • Set.prototype.constructure:构造函数,默许是Set函数。
  • Set.prototype.size:再次来到set实例的积极分子总量

方法:

  • 操作方法
  • 遍历方法
    操作方法:
    — add(value):增添有些值,重回set结构自个儿。
    — delete(value):删除有个别值,再次回到2个bool值,表示是不是中标。
    — has(value):重临叁个布尔值,表示该值是或不是为Set的成员。
    — clear():清除全数成员,未有重返值。
    遍历方法:肆种
    –keys():重返键名
    –values():再次回到键值
    –entries():重回键值对
    –forEach():使用回调函数遍历每1个成员
    须要专门提出的是,Set的遍历顺序正是插入顺序。那几个特点有时非凡有用,比如利用
    Set 保存贰个回调函数列表,调用时就能保障根据增加顺序调用。
    (1)keys(),values(),entries()

keys方法、values方法、entries方法再次来到的都以遍历器对象(详见《Iterator
对象》一章)。由于 Set
结构未有键名,只有键值(只怕说键名和键值是同3个值),所以keys方法和values方法的一坐一起完全1致。

let set = new Set(['red', 'green', 'blue']);

for (let item of set.keys()) {
  console.log(item);
}
// red
// green
// blue

for (let item of set.values()) {
  console.log(item);
}
// red
// green
// blue

for (let item of set.entries()) {
  console.log(item);
}
// ["red", "red"]
// ["green", "green"]
// ["blue", "blue"]

Set 结构的实例暗中认可同遍历,它的暗许遍历器生成函数就是它的values方法。

Set.prototype[Symbol.iterator] === Set.prototype.values
// true

4.1支持for… of和foreach循环

set = new Set([1, 4, 9]);
set.forEach((value, key) => console.log(key + ' : ' + value))
// 1 : 1
// 4 : 4
// 9 : 9

let set = new Set(['red', 'green', 'blue']);

for (let x of set) {
  console.log(x);
}
// red
// green
// blue

五.和对象写法的对照

// 对象的写法
const properties = {
  'width': 1,
  'height': 1
};

if (properties[someName]) {
  // do something
}

// Set的写法
const properties = new Set();

properties.add('width');
properties.add('height');

if (properties.has(someName)) {
  // do something
}

陆.set转为数组

4858美高梅 12

set转数组

数组去重的另1种办法

4858美高梅 13

image.png

柒.数组的map 和filter 方法用于set数据结构

let set = new Set([1, 2, 3]);
set = new Set([...set].map(x => x * 2));
// 返回Set结构:{2, 4, 6}

let set = new Set([1, 2, 3, 4, 5]);
set = new Set([...set].filter(x => (x % 2) == 0));
// 返回Set结构:{2, 4}

于是使用 Set
能够很轻便地贯彻并集(Union)、交集(Intersect)和差集(Difference)。

let a = new Set([1, 2, 3]);
let b = new Set([4, 3, 2]);

// 并集
let union = new Set([...a, ...b]);
// Set {1, 2, 3, 4}

// 交集
let intersect = new Set([...a].filter(x => b.has(x)));
// set {2, 3}

// 差集
let difference = new Set([...a].filter(x => !b.has(x)));
// Set {1}

八直接在遍历操作中退换原先的 Set 结构。

设若想在遍历操作中,同步转移原先的 Set
结构,近年来未有间接的法门,但有二种变通方法。1种是应用原 Set
结构映射出三个新的组织,然后赋值给原本的 Set
结构;另一种是运用Array.from方法。

// 方法一
let set = new Set([1, 2, 3]);
set = new Set([...set].map(val => val * 2));
// set的值是2, 4, 6

// 方法二
let set = new Set([1, 2, 3]);
set = new Set(Array.from(set, val => val * 2));
// set的值是2, 4, 6

9.WeakSet

  • 成员只好是目的
  • 污源回收机制不思考WeakSet的引用
  • ES陆规定不得遍历

发表评论

电子邮件地址不会被公开。 必填项已用*标注

网站地图xml地图
Copyright @ 2010-2019 美高梅手机版4858 版权所有