연습 12
배열과 콜백을 받는 함수 다수를 만듭니다. 콜백은 true 또는 false를 반환합니다. 대다수는 배열을 반복하고 콜백에서 반환되는 대부분의 값이 참인지 확인할 수있을 때까지 각 요소에 대해 콜백을 수행합니다.
참 반환 횟수가 거짓 반환 횟수와 같으면 대다수는 거짓을 반환해야 합니다.
https://dev.to/ryanameri/mastering-hard-parts-of-javascript-callbacks-iii-19g0
const isOdd = function (num) {
return num % 2 === 1;
};
console.log(majority([1, 2, 3, 4, 5, 7, 9, 11], isOdd));
참으로 기록해야 한다
console.log(majority([2, 3, 4, 5], isOdd));
false로 기록해야 합니다.
솔루션 12
function majority(array, callback) {
let trueCount = 0;
let falseCount = 0;
array.forEach((item) => {
callback(item) ? trueCount++ : falseCount++;
});
return trueCount > falseCount ? true : false;
}
두 개의 변수를 사용하고 0으로 초기화하는 한이 연습은 쉬운 편이라는 것을 알았습니다. 또한 간단한 if ... else ... 블록의 가독성에 도움이 되는 terneray 연산자의 사용을 보여줍니다.
연습 13
배열 및 콜백을 허용하는 우선 순위 함수를 만듭니다. 콜백은 true 또는 false를 반환합니다. Prioritize는 배열을 반복하고 각 요소에 대해 콜백을 수행하고 새로운 배열을 반환합니다. 여기서 true의 반환 값을 생성 한 모든 요소가 배열에서 먼저 나오고 나머지 요소는 두 번째가 됩니다.
const startsWithS = function (str) {
return str[0] === "s" || str[0] === "S";
};
console.log(
prioritize(
["curb", "rickandmorty", "seinfeld", "sunny", "friends"],
startsWithS
)
);
[ 'sunny', 'seinfeld', 'curb', 'rickandmorty', 'friends']를 기록해야 합니다.
솔루션 13
function prioritize(array, callback) {
return array.reduce((accum, item) => {
callback(item) ? accum.unshift(item) : accum.push(item);
return accum;
}, []);
}
이것은 두 개의 변수 대신 두 개의 배열, 진실 배열과 거짓 배열을 가지고 있다는 점을 제외하면 실제로 이전 연습과 매우 유사합니다. 이 예제에서는 단일 배열이 반환 될 것으로 예상하므로 이 두 배열을 연결해야 합니다. 저는 약간의 코드와 메모리를 절약하고 단일 배열을 사용하기로 결정했습니다. 그리고 두 개의 다른 배열 메서드 인 unshift()와 push()를 사용하여 배열의 양쪽 끝에 진실과 거짓 값을 넣었습니다. 또한 reduce를 다시 사용하고 있지만 reduce의 누산기로 빈 배열을 제공하고 있음을 주목하십시오.
연습 14
배열과 콜백을 받아들이고 객체를 반환하는 countBy 함수를 만듭니다. countBy는 배열을 반복하고 각 요소에 대해 콜백을 수행합니다. 콜백의 각 반환 값은 객체의 키로 저장됩니다.
각 키와 관련된 값은 특정 반환 값이 반환 된 횟수입니다.
console.log(
countBy([1, 2, 3, 4, 5], function (num) {
if (num % 2 === 0) return "even";
else return "odd";
})
);
{odd : 3, even : 2}를 기록해야 합니다.
솔루션 14
function countBy(array, callback) {
return array.reduce((obj, item) => {
let result = callback(item);
obj[result] ? (obj[result] = obj[result] + 1) : (obj[result] = 1);
return obj;
}, Object.create(null));
}
이제 우리는 이 패턴에 익숙해져야 합니다. 배열을 가져와 단일 객체를 반환하므로 reduce를 찾고 있습니다! 축소 할 누산기로 새 객체를 제공하고, 배열의 항목에 대해 콜백을 실행하고, 반환 값을 기반으로 그에 따라 객체의 값을 설정합니다.
reduce의 힘은 이제 분명해야 합니다.
연습 15
배열과 콜백을 받아들이고 객체를 반환하는 함수 groupBy를 만듭니다. groupBy는 배열을 반복하고 각 요소에 대해 콜백을 수행합니다. 콜백의 각 반환 값은 객체의 키로 저장됩니다. 각 키와 관련된 값은 콜백에 전달 될 때 해당 반환 값을 생성 한 모든 요소로 구성된 배열입니다.
const decimals = [1.3, 2.1, 2.4];
const floored = function (num) {
return Math.floor(num);
};
console.log(groupBy(decimals, floored));
{1 : [1.3], 2 : [2.1, 2.4]}를 기록해야 합니다.
해결책 15
function groupBy(array, callback) {
return array.reduce((obj, item, index, arr) => {
let res = callback(item);
obj[res] = arr.filter((element) => parseInt(element) === parseInt(res));
return obj;
}, Object.create(null));
}
여기서 해결책은 reduce가 콜백과 항목보다 더 많은 것을 취할 수 있다는 것을 알고 있어야 하며, (선택적으로) 배열의 인덱스와 전체 배열도 매개 변수로 취할 수 있습니다.
이것이 전통적인 for 루프에 의해 수행 되었다면 여기에 두 개의 중첩 루프가 필요합니다. 이러한 Array 메서드를 사용하여 첫 번째 루프는 array.reduce ()로 대체되고 두 번째 루프는 arr.filter ()로 대체됩니다. filter ()는 콜백 함수를 취하고 콜백이 true를 반환하는 모든 요소를 반환합니다. 여기서 필터는 배열을 반환하고 새로 생성 된 (누산기) 객체 내부의 값으로 할당합니다.
이 스타일의 선언적 프로그래밍과 Array 메서드 사용에 익숙해지는 데 시간이 걸렸습니다. 일단 익숙해지면 for 루프로 돌아가고 싶지 않을 것입니다. 모든 잠재적 인 off-by-one 오류가 발생합니다. 그러나 때때로 루프는 다음 연습에서 볼 수 있듯이 읽고 구현하기가 더 쉽습니다.
연습 16
객체와 콜백을 받는 함수 goodKeys를 만듭니다. 콜백은 true 또는 false를 반환합니다. goodKeys는 객체를 반복하고 각 값에 대해 콜백을 수행합니다. 그런 다음 goodKeys는 연결된 값이 콜백에서 실제 반환 값을 산출 한 키로 만 구성된 배열을 반환합니다.
const sunny = {
mac: "priest",
dennis: "calculating",
charlie: "birdlaw",
dee: "bird",
frank: "warthog",
};
const startsWithBird = function (str) {
return str.slice(0, 4).toLowerCase() === "bird";
};
console.log(goodKeys(sunny, startsWithBird));
[ 'charlie', 'dee']를 기록해야 합니다.
솔루션 16
function goodKeys(obj, callback) {
const arr = [];
for (let [key, value] of Object.entries(obj)) {
if (callback(value)) arr.push(key);
}
return arr;
}
이 연습에서는 대신 Array 메서드를 사용하는 데 어려움을 겪었습니다. 콜백 함수는 다소 보기 흉하게 보였고 실제로 작업에 적합한 도구가 아닌 것 같았습니다. 독단적 일 필요는 없습니다. 루프가 읽기 쉽고 작업을 충분히 잘 수행한다면 피할 필요가 없습니다!
특히 Object.entries()를 사용하여 객체를 쉽게 반복 가능한 객체로 변환 한 다음 구조 해제 및 for ... of 루프를 사용하여 쉽게 반복 할 수 있습니다.
이 문제를 해결하기 위해 루프 대신 Array 메서드를 사용하는 깔끔한 방법이 있다면 알려주세요!
등록된 댓글이 없습니다.