ES6 데이터 구조 설정 및 매핑

데이터 구조 설정

배열과 비슷하지만 멤버의 값이 모두 고유하며 중복 값이 ​​없습니다.

const mySet = new Set([1,2,1,2,1,2])
[...mySet] // [1,2]
mySet.size  // 2  数据结构的长度,没有length属性

세트는 데이터 중복 제거 방법으로 이해할 수 있습니다.

집합 인스턴스의 속성 및 메서드

  • Set.prototype.constructor: 생성자, 기본값은 Set 함수입니다.
  • Set.prototype.size: Set 인스턴스의 총 구성원 수를 반환합니다.
  • Set.prototype.add(value): 값을 추가하고 Set 구조 자체를 반환합니다.
  • Set.prototype.delete(value): 값을 삭제하고 삭제 성공 여부를 나타내는 부울 값을 반환합니다.
  • Set.prototype.has(value): 값이 Set의 멤버인지 여부를 나타내는 부울 값을 반환합니다.
  • Set.prototype.clear(): 반환 값 없이 모든 멤버를 지웁니다.
mySet.add(3).add(4).add(2); 
[...mySet] // [1,2,3,4]
mySet.size // 4

mySet.has(1) // true
mySet.has(5) // false

mySet.delete(2,3);
[...mySet] // [1,4]

Array.from 메서드는 Set 구조를 배열로 변환할 수 있습니다.

const myArr = Array.from(mySet); // [1,4]

어레이 중복 제거 방법 캡슐화

function dedupe(arr){
    
    
  return Array.from(new Set(array));
}
dedupe([1,1,1,2,2,3]) // [1,2,3]

Set 구조의 인스턴스에는 멤버를 순회하는 데 사용할 수 있는 네 가지 순회 방법이 있습니다.

  • Set.prototype.keys(): 키 이름의 순회자를 반환합니다.
  • Set.prototype.values(): 키 값의 순회자를 반환합니다.
  • Set.prototype.entries(): 키-값 쌍의 순회자를 반환합니다.
  • Set.prototype.forEach(): 콜백 함수를 사용하여 각 멤버를 순회합니다.

키(), 값(), 항목()

let set = new Set ([4,3,9,6]);

for(let item of set.keys()){
    
    
  console.log(item);
}
// 4, 3, 9, 6

for(let item of set.values()){
    
    
  console.log(item)
}
// 4, 3, 9, 6

for(let item of set.entries()){
    
    
  console.log(item);
}
//[4,4] [3,3] [9,9] [6,6]

forEach() , map() , filter()
forEach() 는 각 멤버에 대해 일종의 작업을 수행하며 반환 값이 없습니다.

set.forEach((val,key)=>{
    
    console.log(key + ':' + val)});
// 4 : 4, 3 : 3, 9 : 9, 6 : 6

배열의 맵과 필터 방식도 Set에 대해 간접적으로 사용할 수 있으며, 데이터의 합집합, 교집합, 차등을 쉽게 구현할 수 있습니다.

let x = new Set ([2, 3, 4]);
let y = new Set ([4, 3, 1]);

let union = new Set([...x,...y]);
[...union]  // [2, 3, 4, 1] 并集

let intersect = new Set([...x].filter(el => y.has(el)));
[...intersect] // [3, 4] 交集

let difference = new Set([...x].filter(el => !y.has(el)));
[...difference] // [2, 1] 差集

지도 데이터 구조

객체와 유사하지만 "키"의 범위는 문자열로 제한되지 않습니다.

let myMap = new Map();
let obj = {
    
    val : 'good'};
let arr = [1, 2, 3];

set() get() has() delete() clear() 크기

myMap.set(obj,'hello').set(arr,'world');
myMap.get(obj); // 'hello'
myMap.delete(obj) // true
myMap.has(obj) // false

myMap.size // 1
myMap.clear()
myMap.size // 0

맵 구조는 기본적으로 3개의 순회 생성기 기능과 1개의 순회 방법을 제공합니다.

  • Map.prototype.keys(): 키 이름의 순회자를 반환합니다.
  • Map.prototype.values(): 키 값에 대한 반복자를 반환합니다.
  • Map.prototype.entries(): 모든 구성원에 대한 순회자를 반환합니다.
  • Map.prototype.forEach(): Map의 모든 구성원을 탐색합니다.
let map = new Map([
  ['ADC', 'Uzi'],
  ['MID', 'Knight'],
  ['TOP', 'The Shy']
]);

for(let key of map.keys()){
    
    
 	console.log(key);
}
// 'ADC', 'MID', 'TOP'

for(let value of map.values()){
    
    
  console.log(value);
}
// 'Uzi', 'Knight', 'The Shy'

for(let item of map.entries()){
    
    
  console.log(item[0],item[1])
}
//  'ADC' : 'Uzi', 'MID' : 'Knight', 'TOP' : 'The Shy'

// 等同于使用 map.entries()
for(let [key,value] of map){
    
    
  console.log(key,value);
}

배열의 맵 방식 및 필터 방식과 결합하여 맵의 순회 및 필터링을 실현할 수 있습니다(Set에서 맵 및 필터 사용과 유사).

다른 데이터 구조를 사용하여
배열을 맵으로 변환

let map = new Map([
  ['ADC', 'Uzi'],
  ['MID', 'Knight'],
  ['TOP', 'The Shy']
]);

어레이에 매핑

스프레드 연산자(…) 사용

[...map] 
// [ ['ADC', 'Uzi'], ['MID', 'Knight'], ['TOP', 'The Shy'] ]

개체에 매핑

function strMapToObject(value){
    
    
  let obj = Object.create(null);
  for(let [key,val] of value){
    
    
    obj[key] = val;
  }
  return obj;
}
strMapToObject(map);
// { ADC: 'Uzi', MID: 'Knight', TOP: 'The Shy' }

매핑할 객체

Object.entries()는 객체를 반복합니다.

let obj = {
    
    x: 1, y: 2};
let toMap = new Map(Object.entries(obj));

// 或者是
function objectToMap(value){
    
    
  let toMap = new Map();
  for (let key of Object.keys(value)){
    
    
    toMap.set(k,obj[k]);
  }
  return toMap;
}
objectToMap(obj); // Map{"x": 1, "y": 2}

JSON에 매핑

function mapToJson(value){
    
    
	return JSON.stringify([...value]);
}
let json = mapToJson(map); // {"ADC": "Uzi", "MID": "Knight", "TOP": "The Shy"}

JSON을 지도로 변환

function jsonToMap(json){
    
    
  return objectToMap(JSON.parse(value));
}
jsonToMap(); // Map {'ADC' => "Uzi", 'MID' => "Knight", 'TOP' => "The Shy"}

추천

출처blog.csdn.net/m0_44973790/article/details/128837799