07 - 어레이 유산소 운동 2일차

click here for demo

오늘 우리는 좀 더 중요한 JavaScript 배열 함수에 대해 작업했습니다.

빨리 살펴 봅시다.

Array.prototype.some()

이 함수는 배열에 있는 항목 중 적어도 하나가 원하는 항목을 충족하는지 확인합니다.

MDN에 따르면

The some() method tests whether at least one element in the array passes the test implemented by the provided function. It returns true if, in the array, it finds an element for which the provided function returns true; otherwise it returns false. It doesn't modify the array.

The some() method executes the callbackFn function once for each element present in the array until it finds the one where callbackFn returns a truthy value (a value that becomes true when converted to a Boolean). If such an element is found, some() immediately returns true. Otherwise, some() returns false. callbackFn is invoked only for indexes of the array with assigned values. It is not invoked for indexes which have been deleted or which have never been assigned values.

프로젝트에서 했던 질문:
적어도 한 사람이 19세 이상입니까?

다음은 우리에게 제공된 기본 배열입니다.

const people = [
  { name: "Wes", year: 1988 },
  { name: "Kait", year: 1986 },
  { name: "Irv", year: 1970 },
  { name: "Lux", year: 2015 },
];

그리고 여기 우리의 해결책이 있습니다

const isAdult = people.some(function (person) {
   const currenYear = new Date().getFullYear();
   if (currenYear - person.year >= 19) {
     return true;
   }
 });
console.log({ isAdult });

ES6 화살표 기능을 사용하면 코드 줄 수를 크게 줄일 수 있습니다. 다음은 화살표 함수와 명시적 반환을 사용하는 솔루션입니다.

const isAdult = people.some(
  (person) => new Date().getFullYear - person.year >= 19
);
console.log({ isAdult });

Note: By using {} inside console.log(), it's going to output the name of the variable as well as the value.

Array.prototype.every()

이 함수는 Array의 모든 단일 요소가 기준을 따르는지 확인합니다.

MDN에 따르면

The every() method tests whether all elements in the array pass the test implemented by the provided function. It returns a Boolean value.

The every method executes the provided callbackFn function once for each element present in the array until it finds the one where callbackFn returns a falsy value. If such an element is found, the every method immediately returns false. Otherwise, if callbackFn returns a truthy value for all elements, every returns true.

프로젝트에서 했던 질문:
모두 19세 이상입니까?

솔루션은 다음과 같습니다.

const allAdult = people.every(
  (person) => new Date().getFullYear - person.year >= 19
);
console.log({ allAdult });

Array.prototype.find()

.find()는 .filter()와 비슷하지만 배열의 하위 집합을 반환하는 대신 찾은 첫 번째 항목을 반환합니다.

MDN에 따르면

The find() method returns the value of the first element in the provided array that satisfies the provided testing function. If no values satisfy the testing function, undefined is returned.

The find method executes the callbackFn function once for each index of the array until the callbackFn returns a truthy value. If so, find immediately returns the value of that element. Otherwise, find returns undefined.

프로젝트에서 했던 질문:
ID가 823423인 댓글 찾기

질문에 제공된 기본 배열은 다음과 같습니다.

const comments = [
  { text: "Love this!", id: 523423 },
  { text: "Super good", id: 823423 },
  { text: "You are the best", id: 2039842 },
  { text: "Ramen is my fav food ever", id: 123523 },
  { text: "Nice Nice Nice!", id: 542328 },
];

솔루션은 다음과 같습니다.

const comment = comments.find(function (comment) {
   if (comment.id === 823423) {
    return true;
  }
 });
console.log(comment);

다음은 ES6 구문을 사용하는 솔루션입니다.

const comment = comments.find((comment) => comment.id === 823423);
console.log(comment);

Array.prototype.findIndex()

배열 내부에 무언가가 있는 인덱스를 찾습니다.

MDN에 따르면

The findIndex() method returns the index of the first element in the array that satisfies the provided testing function. Otherwise, it returns -1, indicating that no element passed the test.

The findIndex() method executes the callbackFn function once for every index in the array until it finds the one where callbackFn returns a truthy value.If such an element is found, findIndex() immediately returns the element's index. If callbackFn never returns a truthy value (or the array's length is 0), findIndex() returns -1.

프로젝트에서 했던 질문:
이 ID의 댓글을 찾아 ID가 823423인 댓글을 삭제합니다.

다음은 .findIndex()의 사용입니다.

const index = comments.findIndex((comment) => comment.id === 823423);
console.log(index);

이제 댓글을 삭제하려면 두 가지 방법이 있습니다.

먼저 .splice() 사용

comments.splice(index, 1);

두 번째로 .slice() 및 ES6 확산 연산자를 사용하여 업데이트된 주석의 새 배열을 만듭니다.

const newArray = [...comments.slice(0, index), ...comments.slice(index + 1)];

이것으로 오늘의 프로젝트가 완료되었습니다.

GitHub 저장소:

cenacrharsh / JS-30-DAY-7

javascript30의 Day-6 블로그

자바스크립트-30일-6

KUMAR HARSH ・ 6월 6일 ・ 5분 읽기

#javascript #css #html #webdev

javascript30의 Day-5 블로그

JavaScript-30-Day-5

KUMAR HARSH ・ 6월 5일 ・ 6분 읽기

#html #css #javascript #github

javascript30의 Day-4 블로그

자바스크립트-30일-4

KUMAR HARSH ・ 6월 4일 ・ 6분 읽기

#javascript #github #webdev #html

개발자 프로필


.ltag__user__id__641726 .follow-action-button {
배경색: #000000 !중요;
색상: #000000 !중요;
테두리 색상: #000000 !중요;
}

KUMAR HARSH 팔로우

The best way to learn is to teach.Programmer by Passion and Developer for Fun, and I love sharing my journey with everyone.



javascript30에서 도전할 수도 있습니다.

공유해주셔서 감사합니다WesBos. 😊💖

댓글을 달아 의견을 알려주세요.

감사합니다!