오늘은 또 다른 JavaScript 배열 메소드인 some() 메소드를 살펴보겠습니다. some() 메소드를 사용하여 배열에 항목이 존재하는지 확인하는 방법을 학습하겠습니다.

언제나 그렇듯이 이 기사의 코드 예제는 JavaScript 언어로 작성되었습니다. 그러므로 올바른 이해를 위해서는 언어에 대한 지식이 필요합니다. 더 이상 고민하지 말고 들어가 보겠습니다.

JavaScript some() 메소드란 무엇입니까?

Javascript some() 메소드는 적어도 하나의 배열 멤버가 주어진 함수에 의해 정의된 테스트를 만족하는지 확인합니다. 지정된 함수가 true를 반환하는 요소를 배열에서 찾으면 true를 반환합니다. 그렇지 않으면 false를 반환합니다. 배열은 변경되지 않습니다.

이 방법을 더 잘 이해하기 위해 이 코드 조각을 검토해 보겠습니다.

 const basket = ["oranges", "apples", "pineapple", "yam"] basket.some(bas => bas.length === 3) // true basket.some(bas => bas.length <= 1) // false

우리는 바구니 배열의 과일 길이 중 하나가 정확하게 3인지 테스트하려고 합니다. 적어도 배열에서 구성원은 이 테스트를 따릅니다. 이 경우에는 "yam"입니다. 우리가 예상한 결과는 사실일 것입니다. 두 번째 조건은 1보다 작거나 같은 과일 길이가 있는지 확인합니다. 분명히 1보다 작거나 같은 길이가 없기 때문에 결과는 false입니다.

JavaScript some() 메서드를 어떻게 사용하나요 ?

자바스크립트 some() 메소드는 사용하기 쉽습니다. 방법을 보여드리겠습니다.

구문이 어떻게 작성되는지 이해하는 것부터 시작해 보겠습니다.

구문은 다음과 같이 단순히 단어 'some'을 괄호 '()'로 묶어 작성됩니다.

some()

이는 메서드이기 때문에 인수를 허용하므로 some() 메서드를 사용하여 배열로 수행할 수 있는 작업에 대해 더 큰 유연성을 제공합니다.

그것들은 다음과 같습니다:

1. 요소
2. 색인
3. 정렬

요소

element 매개변수는 배열에서 처리 중인 현재 요소를 나타냅니다.

색인

인덱스는 배열에서 처리된 현재 요소의 인덱스일 뿐입니다.

정렬

이것은 some() 메소드를 호출하는 배열입니다.

이제 구문을 이해했으므로 전체 메서드가 어떻게 보이는지 살펴보겠습니다.

 some((element, index, array) => { /*... */ })

보시다시피 위의 코드 조각에는 세 가지 매개 변수가 포함되어 있으며, 이는 이 메서드를 구축하는 방법에 대한 명확한 예를 제공합니다.

필요에 따라 특정 특성을 건너뛰도록 선택할 수 있습니다. 인덱스와 유사하게 배열에 대한 추가 세부 정보를 원하는 경우 옵션 중 하나로 제공할 수 있습니다. 모든 기준이 항상 포함될 필요는 없습니다.

JavaScript some() 메서드를 작성하는 세 가지 방법

Javascript를 작성하는 세 가지 일반적인 방법은 다음과 같습니다.

1. 화살표 기능
2. 인라인 콜백 함수
3. 콜백 함수

화살표 기능

화살표 함수는 ES6에서 도입되었으며, 이는 기존 함수가 직면한 몇 가지 문제를 해결하려고 시도합니다. 이 함수는 some() 메소드와 함께 사용할 수도 있습니다:

 some((element, index, array) => { /*... */ })

인라인 콜백 함수

변수에 저장하지 않고 some() 메소드에 콜백 함수를 작성할 수 있는 기능이 있습니다.

 const basket = ["oranges","apples","pineapple","yam"] const result = basket.some(function (element, index, array)) { return element.length >= 7 }) console.log(result)

콜백 함수

이 스타일은 다음과 같이 먼저 함수를 선언하고 변수에 저장한 다음 이를 some() 메서드에 콜백으로 전달하여 작성할 수 있습니다.

 const basket = ["oranges","apples","pineapple","yam"] function callBack(bas){   return bas.length === 7 } const result = basket.some(callBack) console.log(result)

사용 사례

1. 양식 입력 유효성 검사
2. 아이템의 존재 확인
3. 승인 및 액세스 제어

양식 입력을 유효하게 만들기

양식 제출을 처리할 때 some() 함수를 사용하여 특정 요구 사항을 충족하는 입력 필드를 확인할 수 있습니다. 예를 들어 입력 내용에 유효한 이메일 주소가 포함되어 있는지 또는 하나 이상의 필수 필드가 채워졌는지 확인할 수 있습니다.

이것이 어떻게 보일 수 있는지 예를 들어 보겠습니다.

 const formInputs = document.querySelectorAll('input'); const isAnyInputEmpty = Array.from(formInputs).some(input => input.value === ''); if (isAnyInputEmpty) {   console.log('Please fill in all required fields.'); } else {  console.log('Form submitted successfully.'); }

코드 샘플에서는 사용자가 빈 필드를 제출하지 않는지 확인합니다. 공백으로 남겨두면 즉시 알려드리고 싶습니다. 그리고 최소한 관련 데이터를 제출하여 요구 사항을 충족하면 제출을 처리하고 싶습니다.

항목의 존재 확인

웹 애플리케이션에 제품 카트나 데이터 구조가 있는 경우 some()을 사용하여 특정 제품이 존재하는지 확인할 수 있습니다. 이는 항목의 존재 여부에 따라 특정 작업을 수행하려는 경우 특히 유용합니다. 이를 더 잘 설명하는 이 코드 샘플을 살펴보겠습니다.

 const shoppingCart = ['shoes', 'T-shirt', 'trouser']; const itemPresent = shoppingCart.some(item => item === 'trouser'); if (itemPresent){ console.log('Product exists in the cart.') } else { console.log('Product does not exist in the cart.') }

장바구니에 '바지'가 있는지 확인합니다. 장바구니에 있는지 확인하면 콘솔에 로그인합니다.

승인 및 액세스 제어

사용자 인증 및 권한 부여 시스템을 구현할 때 some()을 사용하여 사용자가 최소한 하나의 필수 권한을 가지고 있는지 또는 지정된 역할에 속하는지 확인할 수 있습니다. 이를 통해 당사는 특정 기능이나 리소스에 대한 액세스를 제어할 수 있습니다.

 const userRoles = ['admin', 'editor']; const permissions = ['admin', 'moderator']; const hasRequiredRole = permissions.some(role => userRoles.includes(role)); if (hasRequiredRole){ console.log('Access granted.') } else { console.log('Access denied.'); }

코드 샘플에서는 사용자 역할에 따라 권한을 부여하기 위해 include() 및 some() 메서드 조합을 사용했습니다. 사용자의 역할이 필요한 권한과 일치하면 액세스 권한을 부여합니다. 그렇지 않으면 액세스가 거부됩니다.

테이크아웃

마지막으로 조건 테스트에는 javascript some() 메서드가 사용됩니다. 원래 배열은 변경되지 않습니다. 요소, 인덱스, 배열'이라는 세 가지 매개변수를 허용합니다. 여기서 요소 매개변수는 배열에서 처리 중인 현재 요소를 나타내고 index 매개변수는 배열에서 처리된 현재 요소의 "인덱스"입니다.

JavaScript의 배열 메소드, 특히 some() 메소드에 대한 리뷰를 읽어주셔서 감사합니다. 설명을 듣고 어떤 생각이 드셨나요? 한번 시도해 보시겠습니까?

아래 댓글로 여러분의 생각을 알려주시고, 향후 기사를 보려면 HackerNoon에서 저를 팔로우해 주세요.