함수 조합
시스템 2023. 11. 29. 21:59User 리스트가 아래와 같이 구성되어 있다.
var user = [
{ id: 1, name: "adfdf" },
{ id: 2, name: "iuhuh" },
{ id: 3, name: "dfsf" },
{ id: 4, name: "asdf" },
];
User 리스트에서 필터링을 수행한다고 가정하고 아래의 함수를 구성하여 id과 name을 필터링한다.
function findById(list, id) {
for (let i = 0, len = list.length; i < len; i++) {
if (list[i].id === id) return list[i];
}
}
function findByName(list, name) {
for (let i = 0, len = list.length; i < len; i++) {
if (list[i].name === name) return list[i];
}
}
지금은 두 함수로도 아무 문제가 없다.
하지만 user 객체에 여러 속성이 추가되고 두가지 이상의 속성을 필터링하거나, user 객체가 현재와 달라지는 경우에는 어떻게 대응을 해야 할까?
먼저, 두개 이상의 속성을 조합하여 필터링하는 경우이다.
function findByAgeAndName(list, age, name) {
for (let i = 0, len = list.length; i < len; i++) {
if (list[i].age >= age || list[i].name === name) return list[i];
}
}
var user = [
{ id: 1, name: "adfdf", age: 12 },
{ id: 2, name: "iuhuh", age: 32 },
{ id: 3, name: "dfsf", age: 45 },
{ id: 4, name: "asdf", age: 42 },
];
이와 같이 그때 그때 새로운 함수를 만들어서 쓰기에는 각각의 find 함수에는 for문이 반복적으로 들어가고, 조건문을 통해 반환 조건을 검사하는 로직은 계속 반복되고 있다.
이는 함수를 조합하여 사용하는 방식으로 재사용성을 높이고 코드를 간결하게 유지할 수 있다.
아래의 bmatch1함수는 인자를 받아 함수를 리턴하는 고차합수이다. bmatch1함수를 사용하여 특정 객체로 부터 값을 추출하여, 값을 비교할 수 있다.
function bmatch1(key, val) {
return function (obj) {
return obj[key] === val;
};
}
bmatch1함수를 만듬으로서 find...함수들은 다음과 같이 구성할 수 있다.
console.log(find(user, bmatch1("id", 3)));
console.log(find(user, bmatch1("name", "adfdf")));
그리고 각각의 find...함수에서 반복된, 로직은 아래의 find함수를 구성하여 추상화할 수 있고 이를 조합하여 사용할 수 있다.
function find(list, predicate) {
for (let i = 0, len = list.length; i < len; i++) {
if (predicate(list[i])) return list[i];
}
}
bmatch1함수는 함수를 리턴하고 있고, 이를 잘 활용하면 재사용성이 높은 코드를 작성할 수 있다.
뷰와 로직의 분리: 시작 단계, 문제 인식 (1) | 2024.01.07 |
---|---|
자바스크립트 - 함수 호이스팅을 이용한 코드 정리 (1) | 2023.12.03 |
개발 시 환경 변수 적용 (0) | 2023.11.24 |
시맨틱 웹 (0) | 2023.11.11 |
데이터를 사용한 커뮤니케이션 (0) | 2023.11.11 |