728x90
반응형
✔ set
//set 순서가 없는 중복되지 않은 집합
const set = new Set([1,2,3,4,5]);
console.log(set) // Set(5) { 1, 2, 3, 4, 5 }
// 사이즈 확인
console.log(set.size) // 5
// 데이터가 존재하는지 확인
console.log(set.has(2)) //true
console.log(set.has(7)) // false
// 순회
set.forEach((item) => console.log(item))
// == 위 아래 동일한 문장이다.
for(let value of set.values()){
console.log(value)
}
// set에 있는 데이터를 하나씩 넘겨주는 기능으로
//set에 있는 데이터 수만큼 반복 출력하는 것이다.
//추가
set.add(6)
console.log(set)
set.add(6);
console.log(set) // set은 중복값 불가
//삭제
set.delete(6)
console.log(set)
// 전부삭제
set.clear()
console.log(set)
// 오브젝트 세트
const obj1 = {name:'사과', emoji:'😈', price : 1000};
const obj2 = {name:'바나나', emoji:'🍌', price : 2000};
const set2 = new Set([obj1,obj2]);
console.log(set2)
obj1.price = 1500;
set2.add(obj1); // true 수정은 가능하나
console.log(set2) //false set은 동일한 명(주소)은 추가가 안된다.
const obj3 = {name:'사과', emoji:'😈', price : 1000};
set2.add(obj3);
console.log(set2)
✔ map
// map
const map =new Map([
['key1', '🍎'],
['key2', '🍌']
]);
console.log(map)
//사이즈 확인
console.log(map.size);
//존재하는지 확인
console.log(map.has('key1'))
console.log(map.has('key6'))
// 순회
map.forEach((value, key) => console.log(key,value));
// 찾기
console.log(map.get('key1'));
console.log(map.get('key2'));
console.log(map.get('key3'));
obj ={'key1':'🍎', 'key2' : '🍌'};
console.log(obj['key1']) // 🍎
console.log(map['key1']) // undefined
// 추가
map.set('key3', '🍊')
console.log(map)
// 삭제
map.delete('key3')
console.log(map)
// 전부삭제
map.clear();
console.log(map)
문제.
주어진 배열에서 중복을 제거해보자!
const fruits = ['🍎','🍌','🍊' ,'🍌', '🍊', '🍎','🍑']
function removeDuplication(){
return 중복을 제거한 배열
}
cosnole.log(removeDuplication(fruits))
const fruits = ['🍎','🍌','🍊' ,'🍌', '🍊', '🍎','🍑']
function removeDuplication(array){
return [...new Set(array)]
}
console.log(removeDuplication(fruits))
문제.
주어진 두 세트의 공통된 아이템만 담고 있는 세트를 생성해보자
const set1 = new Set([1,2,3,4,5])
const set2 = new Set([1,2,3])
function findIntersection(set1,set2){
return
}
console.log(findIntersection(set1,set2));
const set3 = new Set([1,2,3,4,5])
const set4 = new Set([1,2,3])
function findIntersection(set1,set2){
return new Set([...set3].filter((item) => set2.has(item)))
}//filter 트루인 경우만 반환하고 has를 사용해서 비교하기!
console.log(findIntersection(set3,set4));
옵셔널 체이닝 연산자
- ECMA Script 11
- ?. , ??
- null 또는 undefined을 확인할 때
✔ 연산자
//❗❗ 논리연산자
// &&, ||
const obj1 = {name: '김사과'};
const obj2 = {name : '반하나', lover : '이메론'}
if(obj1 || obj2){ // 값이 있으면 true로 취급하기 때문에 결과적으로 true가 나온다.
console.log('둘다 true!')
} // 비교문일때는 참, 거짓을 확인하고
let result = obj1 && obj2;
console.log(result);
// 대입문일 경우에는 앞이 참이면 뒤의 값을 변수에 넣어준다.
// 그렇기 때문에 결과값은 { name: '반하나', lover: '이메론' }
// &&는 앞이 참이여도 뒤의 값을 확인하기 위해 뒤값이 넘어간다
result = obj1 || obj2;
console.log(result)
// ||는 앞이 참이면 뒤가 무엇이든지 참이기 때문에 obj1이 변수에 들어간다.
function changeLover(obj){
if(!obj.lover){
throw new Error('애인이 없어!');
}
obj.lover = '애인바뀜'
}
function makeNewLover(obj){
if(obj.lover){
throw new Error('애인이 있다!');
}
obj.lover = '새로운 애인 생성'
}
obj1.lover && changeLover(obj1);
console.log(obj1);
obj2.lover && changeLover(obj2);
console.log(obj2);
//❗❗ null 또는 undefined인 경우를 확인할 때
let item = {price: 1000}; //null이나 undefinied를 선언해주고 변수를 줘야한다.
const price = item && item.price;
console.log(price);
//❗ 기본값을 설정
// default parameter : undefined해결
// 0, -0, null, '' 해결하지 못한다.
function print(message){
const text = message || 'hello' // 이런 방식으로 default parameter의 예외상황들을 해결할 수 있다.
console.log(text);
}
print('안녕');
print();//hello
print(undefined);//hello
print(null)//null
print('') // 아무것도 안찍힘
console.log('--------------------------')
let item2 = {price:10000};
const price2 = item?.price; // item && item.price; 동일
console.log(price2)
let banana ={name : '반하나' , lover : {name:'오렌지'}};
function printLoverName(obj){
const loverName = obj ?.lover?.name//obj && lover && lover.name;
console.log(loverName)
}
printLoverName(banana);
let num =0;
console.log(num || '-1'); // -1
console.log(num ?? '-1'); // 0 -> null, undefined 에서만
반응형
'JavaScript' 카테고리의 다른 글
JavaSript Promise Object (0) | 2022.11.15 |
---|---|
JavaScript(주석, 예외처리, 모듈, 가위바위보/ 퀴즈 문제) (0) | 2022.11.14 |
JavaScript(이벤트전파, iterable, generator, spread) (0) | 2022.11.10 |
JavaScript(이벤트 타입/리스너/객체) (0) | 2022.11.10 |
JavaScript (class, extends, wrapper) (0) | 2022.11.09 |