고차함수 연습하기 05-08


문제 출처 : Poiema - HOF


특정 요소 삭제

todos에서 삭제할 요소의 id를 인수로 전달하면 해당 요소를 삭제하는 함수를 작성하라.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
// 5. 특정 요소 삭제
let todos = [
{ id: 3, content: 'HTML', completed: false },
{ id: 2, content: 'CSS', completed: true },
{ id: 1, content: 'Javascript', completed: false }
];

function removeTodo(id) {
todos = todos.filter((todo) => (todo.id == id));
}

removeTodo(2);

console.log(todos);
/*
[
{ id: 3, content: 'HTML', completed: false },
{ id: 1, content: 'Javascript', completed: false }
]
*/

특정 요소의 프로퍼티 값 반전

todos에서 대상 요소의 id를 인수로 전달하면 해당 요소의 completed 프로퍼티 값을 반전하는 함수를 작성하라.

단, Object.assign를 사용하도록 한다.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
// 6. 특정 요소의 프로퍼티 값 반전
const todos = [
{ id: 3, content: 'HTML', completed: false },
{ id: 2, content: 'CSS', completed: true },
{ id: 1, content: 'Javascript', completed: false }
];

function toggleCompletedById(id) {
const result = todos.map((todo) => {
if (todo.id == id) todo.completed = !todo.completed;
return todo;
});

Object.assign(todos, result);
}

toggleCompletedById(2);

console.log(todos);
/*
[
{ id: 3, content: 'HTML', completed: false },
{ id: 2, content: 'CSS', completed: false },
{ id: 1, content: 'Javascript', completed: false }
]
*/

모든 요소의 completed 프로퍼티 값을 true로 설정

todos의 모든 요소의 completed 프로퍼티 값을 true로 설정하는 함수를 작성하라.

단, Object.assign를 사용하도록 한다.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
// 7. 모든 요소의 completed 프로퍼티 값을 true로 설정
let todos = [
{ id: 3, content: 'HTML', completed: false },
{ id: 2, content: 'CSS', completed: true },
{ id: 1, content: 'Javascript', completed: false }
];

function toggleCompletedAll() {
todos = todos.map((todo) => {
if (!todo.completed) todo.completed = !todo.completed;
return todo;
});
}

toggleCompletedAll();

console.log(todos);
/*
[
{ id: 3, content: 'HTML', completed: true },
{ id: 2, content: 'CSS', completed: true },
{ id: 1, content: 'Javascript', completed: true }
]
*/

completed 프로퍼티의 값이 true인 요소의 갯수 구하기

todos에서 완료(completed: true)한 할일의 갯수를 구하는 함수를 작성하라.

단, for 문, Array#forEach는 사용하지 않도록 하자.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
// 8. completed 프로퍼티의 값이 true인 요소의 갯수 구하기
const todos = [
{ id: 3, content: 'HTML', completed: false },
{ id: 2, content: 'CSS', completed: true },
{ id: 1, content: 'Javascript', completed: false }
];

function countCompletedTodos() {
return todos.reduce((pre, todo) => {
if (todo.completed === true) pre++;
return pre;
}, 0);
}

console.log(countCompletedTodos()); // 1
Share