240513 TIL

이어서 자바스트립트에 대해 공부하였다.

1. 일급 객체로서의 함수

일급 객체란? 일반적으로 적용 가능한 연산을 모두 지원하는 객체

(1) 변수에 함수를 할당할 수 있다.

(2) 함수를 인자로 다른 함수에 전달할 수 있다.

-1 콜백함수 : 매개변수로 쓰이는 함수
-2 고차함수 : 함수를 인자로 받거나 return하는 함수

function callFunction(func) {
  func();
}

const sayHello = function() {
  console.log('Hello!');
};

callFunction(sayHello); // "Hello!" 출력

(3) 함수를 반환

function createAdder(num) {
  return function(x) {
    return x + num;
  }
}
const addFive = createAdder(5);
console.log(addFive(10)); // 15 출력

(4) 객체의 프로퍼티로 함수를 할당

const person = {
  name: 'John',
  sayHello: function() {
    console.log(`Hello, my name is ${this.name}`);
  }
  //화살표 함수는 this를 바인딩하지 않음
  //sayHello: () => { console.log(`Hello, my name is ${this.name}`); }
  //this.name 부분이 undefined로 출력
};

person.sayHello(); // "Hello, my name is John" 

(5) 배열의 요소로 함수를 할당

const myArray = [
  function(a, b) {
    return a + b;
  },
  function(a, b) {
    return a - b;
  }
];

console.log(myArray[0](5, 10)); // 15 출력
console.log(myArray[1](10, 5)); // 5 출력

2. Map

key - value 페어로 구성 (객체와 유사)
key에 어떤 데이터 타입도 다 들어갈 수 있다.
map은 key가 정렬된 순서로 저장
기능 : 검색 / 삭제 / 제거 / 존재 여부 확인

• new Map() – 생성.
• map.set(key, value) – key를 이용해 value를 저장.
• map.get(key) – key에 해당하는 값을 반환. key가 존재하지 않으면 undefined를 반환.

const myMap = new Map();
myMap.set('key', 'value');
console.log(myMap.get('key')); // 'value' 출력

• map.keys(), map.values(), map.entries() - iterator로 for ... of ... 로 활용. map.entries()는 키-값 쌍이 배열 형태로 저장.
• map.has(key) – key가 존재하면 true, 존재하지 않으면 false를 반환.
• map.delete(key) – key에 해당하는 값을 삭제.
• map.clear() – 맵 안의 모든 요소를 제거.
• map.size – 요소의 개수를 반환.

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

for (const key of myMap.keys()) {
  console.log(key);
}
for (const value of myMap.values()) {
  console.log(value);
}
for (const entry of myMap.entries()) {
  console.log(`${entry[0]}: ${entry[1]}`);
}
console.log(myMap.has('two')); // true 출력
console.log(myMap.size); // 3 출력

3. Set

값만 저장.
값이 중복되지 않음. 유일한 요소로만 구성.
기능 : 값 추가 / 검색 / 삭제 / 모든 값 제거 / 크기 / 존재 여부 확인

• new Set() – 생성.
• set.add(value) – 값 추가.
• set.size – 요소의 개수를 반환.
• set.has(value) – value가 존재하면 true, 존재하지 않으면 false를 반환.
• set.values() - iterator로 for ... of ... 로 활용.

const mySet = new Set();
mySet.add('value1');
mySet.add('value2');
mySet.add('value3');

console.log(mySet.size); // 3 출력
console.log(mySet.has('value1')); // true 출력

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