목록에서 하나의 숫자로

JavaScript 감소 방법

소개

JavaScript reduce 메소드는 배열 내부의 값을 단일 값으로 "축소"할 수 있는 es6에 도입된 고차 함수 중 하나입니다. 오늘은 이를 코드에서 구현하는 방법을 살펴보겠습니다.

시작하기

.reduce() 메서드는 모든 배열에서 호출할 수 있는 고차 함수입니다. 아래를 참조하세요.

const arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
arr.reduce();

다른 모든 배열 방법.reduce()과 마찬가지로 전체 배열을 반복합니다. 여기서 차이점은 .reduce()가 함수에 두 개의 매개변수가 있다는 것입니다. 하나는 함수이고 다른 하나는 우리가 호출하는 누산기의 초기 값입니다. 이것은 루프가 반복될 때마다 증가합니다.

const arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
arr.reduce(() => {}, 0);

reduce 내부의 함수는 자체적으로 두 개의 매개변수를 사용합니다. 하나는 누산기이고 다른 하나는 배열의 현재 위치 값입니다. 아래 참조:

const arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
arr.reduce((acc, curr) => {}, 0);

각 반복에서 누산기를 업데이트하려면 함수 내부에 return it을 추가해야 합니다. 우리는 이 기능을 변수에 할당할 수 있으며, 이 변수는 어떤 용도로든 사용할 수 있습니다.

감소 사용: 예

1에서 10까지의 배열이 있고 총계를 결정하기 위해 배열의 모든 요소를 ​​추가해야 한다고 가정해 보겠습니다. 이 작업을 수행하기 위해 reduce 메서드를 사용할 수 있습니다. 배열에서 reduce 메서드를 호출하고 누산기를 설정할 수 있습니다. 및 현재 매개변수와 초기값 0도 전달합니다.

const arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
arr.reduce((acc, curr) => {
  return acc + cur;
}, 0);

reduce 사용: 또 다른 예

우리가 생성한 클래스 개체(다른 게시물에 대한 링크)를 살펴보고 클래스의 평균을 계산하기 위해 노력했다고 가정해 보겠습니다. 이를 수행하기 위해 while 루프 또는 for 루프를 작성하거나 reduce 메서드를 사용할 수 있습니다.

다음은 각 개체가 클래스의 학생을 나타내는 개체 배열입니다.

const students = [
  {
    Name: "John",
    Grade: 90,
  },
  {
    Name: "Sarah",
    Grade: 95,
  },
  {
    Name: "Jane",
    Grade: 80,
  },
  {
    Name: "Julie",
    Grade: 79,
  },
];

축소 방법 사용:

const students = [
  {
    Name: "John",
    Grade: 90,
  },
  {
    Name: "Sarah",
    Grade: 95,
  },
  {
    Name: "Jane",
    Grade: 80,
  },
  {
    Name: "Julie",
    Grade: 79,
  },
];

const TotalMarks = students.reduce((acc, curr) => acc + cur, 0);
const averageMark = TotalMakrs / students.length;
console.log(averageMark);

이제 이것이 완료되었으므로 자체 루프를 작성하지 않고 배열을 단일 값으로 줄이는 방법이 있습니다!

당신을 위한 질문

이제 이것을 알고, 여기 당신을 위한 질문이 있습니다. 감소 방법을 다른 방법으로 구현할 수 있습니까?


우리가 만들고 있는 앱에서 기능을 구현하는 방법을 보려면 YouTube 채널을 확인하십시오!