의 값으로 배열에서 객체 제거

Ui Gabs Eulo Baeyeol Eseo Gaegche Jegeo



데이터를 대량으로 처리하는 동안 업데이트로 인해 일부 항목을 제거해야 하는 요구 사항이 있을 수 있습니다. 예를 들어 특정 속성이나 속성을 기반으로 값을 제거합니다. 그 결과 관련 데이터에 편리하게 액세스하고 원치 않는 항목을 삭제할 수 있습니다. 이러한 상황에서 JavaScript의 값으로 배열에서 객체를 제거하면 즉시 데이터에 액세스하고 메모리를 절약하는 데 매우 유용합니다.

이 기사에서는 JavaScript의 값으로 배열에서 객체를 제거하는 방법에 대해 설명합니다.







JavaScript의 값으로 배열에서 객체를 제거/제거하는 방법은 무엇입니까?

JavaScript에서 해당 값으로 배열에서 객체를 제거하려면 다음 접근 방식을 적용하십시오.



언급된 각 접근 방식을 하나씩 논의해 봅시다!



접근법 1: findIndex() 및 splice() 메서드를 사용하여 JavaScript에서 해당 값으로 배열에서 객체 제거

찾기인덱스() ” 메서드는 원래 배열을 수정하지 않고 요소의 인덱스(위치)를 반환합니다. “ 접착() ” 메서드는 특정 배열 요소를 추가/제거하고 원래 배열에도 영향을 미칩니다. 이러한 방법을 사용하여 제거해야 하는 개체의 인덱스를 찾을 수 있습니다. 그 후, 특정 개체는 지정된 번호를 기준으로 접합됩니다.





통사론

array.findIndex ( 기능 ( currVal, 인덱스, 배열 ) , 값 )



이 구문에서:

  • 기능 ”는 배열의 각 항목에 대해 호출해야 하는 함수를 나타냅니다.
  • 함수 매개변수는 지정된 배열에서 현재 값의 인덱스를 참조합니다.
  • '는 함수에 전달해야 하는 값을 '로 나타냅니다. 이것 '.

배열.스플라이스 ( 인덱스, 숫자, 새 )

위에 주어진 구문에서:

  • 인덱스 ”는 항목을 추가하거나 제거해야 하는 위치를 가리킵니다.
  • 하나에 ”는 항목의 번호를 나타냅니다.
  • 새로운 ”는 대체 요소로 새 요소에 해당합니다.

예시

아래 언급된 코드를 따르자:

< 스크립트 유형 = '텍스트/자바스크립트' >
허락하다 주어진 배열 = [ { 나이: 18 } , { 나이: 이십 } , { 나이: 25 } ] ;
허락하다 removeObject = givenArray.findIndex ( 개체 = > {
반품 개체.나이 === 18 ;
} ) ;
console.log ( '제거할 개체의 인덱스는 다음과 같습니다.' , 객체 제거 ) ;
givenArray.splice ( 제거 객체, 1 ) ;
console.log ( '객체를 값으로 제거한 후의 배열은 다음과 같습니다.' , 주어진배열 ) ;
스크립트 >

위의 코드 조각에서:

  • 명시된 속성을 가진 객체 배열을 선언합니다.
  • 다음 단계에서 ' 찾기인덱스() ” 메서드를 이전 단계에서 선언된 배열과 함께 사용합니다.
  • 이렇게 하면 배열의 각 요소(객체)를 반복하게 됩니다.
  • 결과적으로 속성에 대해 명시된 값(예: 18)과 일치하는 어레이의 특정 객체 인덱스가 표시됩니다.
  • 그 후 ' 접착() ” 방법은 가져온 인덱스를 참조하여 해당 인덱스에 대해 특정 개체를 제거합니다.
  • ' 1 ”는 제거해야 하는 객체의 수를 지정합니다.
  • 마지막으로 결과 개체의 배열을 표시합니다.

산출

위의 출력에서 ​​특정 개체의 인덱스가 표시되고 나중에 제거되는 것을 볼 수 있습니다.

접근법 2: filter() 메서드를 사용하여 JavaScript에서 해당 값으로 배열에서 객체 제거

필터() ” 메서드는 특정 테스트를 통과하는 항목의 새 배열을 만듭니다. 이 메서드는 비교 연산자를 통해 조건에 ​​따라 제거해야 하는 개체를 필터링하는 데 적용할 수 있습니다.

통사론

배열.필터 ( 기능 ( ) , 이것 )

여기:

  • 기능 ”는 필터링을 위해 함수로 리디렉션되는 함수를 가리킵니다.
  • ”는 현재 요소의 값입니다.
  • 이것 ”는 함수에 전달된 값을 나타냅니다.

예시

아래에 언급된 예를 살펴보겠습니다.

< 스크립트 유형 = '텍스트/자바스크립트' >
허락하다 주어진 배열 = [ { 크기: 35 } , { 크기: 40 } , { 크기: 오분의 사 } ] ;
console.log ( '지정된 배열은 다음과 같습니다.' , 주어진배열 )
허락하다 newArray = givenArray.filter ( 개체 = > {
반품 개체 크기 ! == 오분의 사 ;
} ) ;
console.log ( '객체를 값으로 제거한 후의 배열은 다음과 같습니다.' , newArray ) ;
스크립트 >

위의 코드 행에 지정된 대로 다음 단계를 적용합니다.

  • 마찬가지로 객체 배열을 선언하고 표시합니다.
  • 그 후 ' 필터() ” 메소드는 요소(오브젝트)를 참조합니다.
  • 이제 ' 같지 않음(!==) ” 비교 연산자.
  • 마지막으로 필터링된 배열을 표시합니다.

산출

위의 출력은 필터링된 개체의 새 배열이 형성되었음을 나타냅니다.

접근법 3: pop() 메서드를 사용하여 JavaScript에서 해당 값으로 배열에서 객체 제거

팝() ” 메서드는 배열의 마지막 요소를 제거하고 원래 배열에도 영향을 미칩니다. 이 방법은 배열에서 특정 개체를 꺼내고 제거된 개체로 업데이트된 배열을 만드는 데 활용할 수 있습니다.

예시

아래 주어진 예는 논의된 개념을 보여줍니다.

< 스크립트 유형 = '텍스트/자바스크립트' >
허락하다 주어진 배열 = [ { 이름: '괴롭히다' } , { 이름: '데이빗' } ]
허락하다 newArray = givenArray.pop ( 개체 = > {
반품 개체 이름 = '괴롭히다'
} )
console.log ( '객체를 값으로 제거한 후의 배열은 다음과 같습니다.' , newArray ) ;
스크립트 >

위의 코드 조각에서:

  • 마찬가지로 명시된 속성을 가진 객체 배열을 선언합니다.
  • 다음 단계에서 ' 팝() ” 속성에 대해 명시된 값을 가진 특정 객체를 제거하는 방법 “ 이름 '.
  • 결과적으로 결과 배열에는 하나의 객체만 남게 됩니다. newArr '.
  • 마지막으로 업데이트된 객체의 배열, 즉 newArr을 표시합니다.

산출

위의 출력은 원하는 요구 사항이 충족되었음을 나타냅니다.

결론

찾기인덱스() ' 그리고 ' 접착() ” 방법, “ 필터() ” 방법 또는 “ 팝() ” 메서드는 JavaScript의 값으로 배열에서 개체를 제거하는 데 적용할 수 있습니다. 이러한 접근 방식은 인덱싱을 기반으로 특정 개체를 제거하거나 같지 않음(!==) 연산자를 통해 필터링하거나 단순히 조건에 따라 개체를 팝합니다. 이 기사에서는 JavaScript를 사용하여 해당 값으로 배열에서 객체를 제거/제거하는 방법에 대해 설명했습니다.