함수는 일급 객체라고 한다. 그래서 함수를 객체처럼 여러가지 방식으로 다룰 수 있다.
일반 객체와 달리 함수는 특별한 능력을 가지고 있다.
일급객체란 다른 객체들에 일반적으로 적용 가능한 연산을 모두 지원하는 객체를 가르킨다.
함수가 일급 객체로 취급되기 때문에, 우리는 함수를 매우 유연하게 사용할 수 있다.
그래서 자바스크립트에서 함수는 매우 중요한 개념이다.
함수는 변수에 할당할 수 있다. 함수는 값으로 취급되기 때문에, 다른 변수와 마찬가지로 변수에 할당할 수 있다. 변수에 할당된 함수는 나중에 사용할 수 있다.
const sayHello = function() {
console.log("Hello");
};
sayHello(); // 'Hello' 출력
함수는 다른 함수에 인자로 전달될 수 있다. 함수가 값으로 취급되기 때문에 다른 함수의 인자로 전달할 수 있다, 이것은 콜백(callback)이나 고차 함수(higher-order-function)를 작성하는 데 사용된다.
콜백 함수, 그리고 고차 함수란?
- 콜백 함수는 어떠한 함수의 매개변수로 쓰이는 함수를 말한다.
- 고차 함수는 함수를 인자로 받거나 함수를 출력으로 반환하는 함수를 말한다. 함수를 다루는 함수라고도 한다. 정리하자면 콜백함수는 고차함수라고도 할 수 있다.
function callFunction(func) {
func();
}
const sayHello = function() {
console.log('Hello');
};
callFunction(sayHello); // "Hello"출력
함수는 다른 함수에서 반환될 수 있다. 함수는 값으로 취급되기 때문에, 다른 함수에서 반환할 수 있다. 이것은 함수 팩토리나 클로저를 작성하는 데 사용된다.
function createAdder(num) {
return function(x) {
return x + num;
}
}
const addFive = creatAdder(5);
console.log(addFive(10)); // 15로 출력
함수는 객체의 프로퍼티로 할당될 수 있다. 객체의 메소드로 함수를 호출할 수 있다.
const person = {
name: 'John',
sayHello: function() {
console.log(`Hello, my name is ${this.name}`);
}
};
person.sayHello(); // "Hello, my name John" 출력
함수는 배열의 요소로 할당될 수 있다. 이것은 함수를 배열에서 사용할 수 있게 한다.
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 출력
함수를 일급 객체로 다룰 수 있다는 것은, 함수를 다양하게 조합할 수 있다는 것을 의미한다.
새로운 함수를 반환하는 함수를 작성하면, 함수를 조합하여 더 복잡한 기능을 구현할 수 있다.
이것을 활용하면 코드를 더욱 간결하게 작성할 수 있으며, 유지 보수도 쉬워진다
function multiplyBy(num) {
return function(x) {
return x * num;
}
}
function add(x, y) {
return x + y;
}
const multiplyByTwo = multiplyBy(2);
const multiplyByThree = multiplyBy(3);
const result = add(multiplyByTwo(5), multiplyByThree(10)); // 40출력
이처럼 함수가 일급 객체로 취급되는 것은 자바스크립트에서 함수를 다양한 방식으로 사용할 수 있게 해준다. 함수를 객체나 배열과 같은 일반적인 자료형과 동일한 방식으로 사용할 수 있기 떄문에, 코드를 더 간결하고 모듈화된 형태로 작성할 수 있다.
Map은 키-값 쌍을 저장하는 객체와 비슷하다. Map은 각 쌍의 키와 값을 저장하며, 객체와 달리 키로 사용할 수 있는 모든 유형을 사용할 수 있다. Map은 키가 정렬된 순서로 저장되기 때문에, 추가한 순서대로 반복할 필요가 없다. Map을 사용하면 다음과 같은 작업을 수행할 수 있다.
- 키-값 쌍 추가 및 검색(set
- 키-값 쌍 삭제(delete)
- 모든 키-값 쌍 제거(clear)
- Map크기 및 존재 여부 확인(size)
Map에는 다음과 같은
new Map()
: 맵을 만든다.map.set(key, value)
:key
를 이용해value
를 저장한다.map.get(key, value)
:key
에 해당하는 값을 반환한다.key
가 존재하지 않으면,undefined
를 반환한다.map.has(key)
:key
가 존재하면true
를 존재하지 않으면false
를 반환한다.map.delete(key)
:key
에 해당하는 값을 삭제한다.map.clear()
: 맵 안의 모든 요소를 제거한다.map.size
: 요소의 개수를 반환한다.
// 새로운 Map을 생성하려면 Map() 생성자를 사용한다.
const myMap = new Map()
// Map에 값을 추가하려면 set() 메소드를 사용한다.
myMap.set('key', 'value');
console.log(myMap.get('key')); // value 출력
Map에서는 keys()
, values()
, entries()
메소드를 사용하여 키, 값, 및 키-값 쌍을 반복할 수 있다.
for...of 반복문
for...of
반복문은 ES6에 추가된 새로운 컬렉션 전용 반복 구문이다.for...of
를 사용하기 위해선 컬렉션 자체가[symbol.iterator]
속성을 가지고 있어야만 한다.
var iterator = [10, 20, 30];
for (var valueof iterable) {
console.log(value); // 10, 20, 30
}
iterator는 반복자 라는 말이다. 요소 하나하나를 반복할 수 있도록 배열 또는 객체와 비슷한 형태로 열거되어 있는 자료구조로 이해한다.
아래 예시 코드에서myMap,key()
으로 사용할 수 있는 이유는myMap.key()
가 반환하는 값이 iterator이기 때문이다.
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); // one, two, three
}
for (const value of myMap.values()) {
console.log(value); // 1, 2, 3
}
for (const entry of myMap.entries()) {
console.log(`${entry[0]}: ${entry[1]}`); // one:1, two:2, three:3
}
Map의 크기를 확인하려면 size속성을 사용한다.
consolt.log(myMap.size); // 3
특정 키가 Map에 존재하는지 여부를 확인하려면 has()메소드를 사용한다.
console.log(myMap.has('two')); // true
Set
은 고유한 값을 저장하는 자료 구조이다. Set
은 값만 저장하며, 키를 저장하지 않는다. Set
은 값이 중복되지 않는 유일한 요소로만 구성된다. Set
을 사용하면 다음과 같은 작업을 수행할 수 있다.
- 값 추가 및 검색
- 값 삭제
- 모든 값 제거
set
크기 및 존재 여부 확인
set
생성 및 사용>// 새로운 `set`을 만드려면`set()` 생성자를 사용한다.
const mySet = new Set();
// 이제 set에 값을 추가하려면 add() 메소드를 사용합니다.
mySet.add('value1')
mySey.add('value2')
// set에서 값을 검색하려면 has() 메소드를 사용한다.
console.log(mySet.has('value1')); // true
set
의 반복>// set에서는 values() 메소드를 사용하여 값을 반복할 수 있다.
const mySet = new Set();
mySet.add('value1');
mySet.add('value2');
mySet.add('value3');
for (const value of mySet.values()) {
console.log(value);
}
// set의 크기를 확인하려면 size의 속성을 사용한다.
console.log(mySet.size); // 3
// 특정 값을 set에서 검색하여 존재하는지 여부를 확인하려면 has() 메소드를 사용한다
console.log(mySet.has('value2')); // true
javascript에서 Map과 Set은 두 가지 다른 유형의 자료 구조이다.
Map => 키-값
set => 고유한 값을 저장.