JavaScript 2주차 정리

하정현·2023년 10월 13일

JS

목록 보기

2/9

Destructuring

기본적으로 배열의 경우
let [value1, value2] =[1, "new"]
let arr = ["value1", "value2" ,"value3", "value4"];
let [a, b, c, d = 4] = arr;

객체인 경우

let user = {
name : "abc",
age : 30
};

let {name, age} = user

이런식으로 분해, 할당을 할수 있다.

Spread Operator

기본적으로 destructuring과 함께 많이 사용되는 ES6문법중 하나이다.
ex)
배열 arr를 전개
let arr = [1, 2, 3];
console.log(...arr);

newArr = [...arr ,4];
console.log(newArr);

//이런식으로 새로운 배열에 기존배열도 활용 할 수 있다.

객체에도 적용 가능하다.

let user = {
name: 'nbc',
age: 30
}

let user2 = {...user}

console.log(user);
console.log(user2);

또 나머지 매개변수로도 활용 가능하다.

// 나머지 매개변수(rest parameter)
function exampleFunc (a, b, c, ...args) {
console.log(a, b, c)
console.log(args);
}

Template Literal

``백틱을 활용하면 기본적으로 문자열 "" 기능과
자바스크립트 문법을 ${}통해 사용가능 하고 멀티라인 지원된다.

일급객체함수

자바 스크립트의 함수는 일급 객체 함수(First-Class Objec)이다.
"일급객체(First-class Object)란 다른 객체들에 일반적으로 적용 가능한 연산을 모두 지원하는 객체를 가리킨다." [위키백과]

Map

map함수는 key와 value로 구성되어있고,
키가 정렬된 순서로 저장 되기 때문에
어떠한 데이터타입도 들어올 수 있다.
기능으론 검색, 삭제, 제거 여부를 확인할 수 있다.

ex)

const myMap = new Map();
myMap.set('one', 1);
myMap.set('two', 2);
myMap.set('three', 3);

//map에 key들 검색
console.log(myMap.keys());

for (const key of myMap.keys()) {
console.log(key);
}

//map에 value들 검색
console.log(myMap.values());
for (const values of myMap.values()) {
console.log(values);
}

//map에 key와 value 모두 검색
console.log(myMap.entries());
for (const entries of myMap.entries()) {
console.log(entries);
}

//map의 크기(길이), .has를 통해 boolean 반환.
console.log(myMap.size);
console.log(myMap.has('two'));

Set

Set의 특징은 고유한 값을 저장하는 자료구조이다.
여기서 값만을 저장하고, 키를 저장하지는 않는다.
값이 중복되지 않는 유일한 요소로만 구성된다.

const mySet = new Set();
//set은 add를 통해 요소들을 추가한다.
mySet.add('value1');
mySet.add('value2');
mySet.add('value4');
mySet.add('value5');
mySet.add('value8');

//마찬가지로 .has()와 .size도 가능하다.
console.log(mySet.size);
console.log(mySet.has("value1"));
console.log(mySet.has("value3"));
console.log(mySet.has("value2"));

for(const value of mySet.values()){
console.log(value);
}