JavaScript - 예제가 포함된 기본 배열 작업

JavaScript에서 기본 배열 메서드를 사용하는 데 어려움을 겪은 적이 있습니까?

오늘 포스트에서는 어레이에 대한 기본 작업을 최대한 간단하게 설명하려고 합니다. 계속 지켜봐 주시기 바랍니다! 🔥

시작하기 전에 웹 사이트에서 솔루션에 대한 실행 가능한 예제를 확인하는 것이 좋습니다.
JavaScript - basic array operations

다음은 유용할 수 있는 배열에 사용되는 가장 일반적인 6가지 방법을 제시한 것입니다.

map()

filter()

find()

fill()

some()

every()

1. 지도() 메서드

이 예제에서는 map() 메서드를 사용하여 호출 배열의 모든 요소에 제공된 함수를 호출한 결과로 채워진 새 배열을 만들었습니다.

const array1 = ['🟦', '🟦', '🟦', '🟦'];

const array2 = array1.map((item) => '🔵');

console.log('array1: ' + array1);
console.log('array2: ' + array2);

산출:

array1: 🟦,🟦,🟦,🟦
array2: 🔵,🔵,🔵,🔵

2. 필터() 메소드

이 예제에서는 filter() 메서드를 사용하여 제공된 함수에 의해 구현된 테스트를 통과하는 모든 요소로 채워진 새 배열을 만들었습니다.

const array1 = ['🟦', '🔵', '🟦', '🟦'];

const array2 = array1.filter((item) => item == '🟦');

console.log('array1: ' + array1);
console.log('array2: ' + array2);

산출:

array1: 🟦,🔵,🟦,🟦
array2: 🟦,🟦,🟦

3. find() 메소드

이 예제에서는 find() 메서드를 사용하여 제공된 테스트 기능을 만족하는 제공된 배열의 첫 번째 요소를 가져왔습니다.

const array = ['🟦', '🟦', '🔵', '🔵'];

const item = array.find((item) => item == '🔵');

console.log('array: ' + array);
console.log('item: ' + item);

산출:

array: 🟦,🟦,🔵,🔵
item: 🔵

📝 Note:

If there's no value that satisfies the testing function, undefined is returned.

4. fill() 메서드

이 예제에서는 fill() 메서드를 사용하여 배열의 모든 요소를 ​​시작 인덱스1(기본값은 0 )에서 끝 인덱스(기본값array.length )까지 특정 값으로 변경했습니다.

const array = ['🟦', '🟦', '🟦', '🟦'];
console.log('array: ' + array);

array.fill('🔵', 1); // filling since index 1
console.log('array: ' + array);

array.fill('🔵');    // filling since index 0
console.log('array: ' + array);

산출:

array: 🟦,🟦,🟦,🟦
array: 🟦,🔵,🔵,🔵
array: 🔵,🔵,🔵,🔵

5. some() 메소드

이 예에서는 some() 메서드를 사용하여 배열에 있는 하나 이상의 요소가 제공된 함수에 의해 구현된 테스트를 통과하는지 여부를 테스트했습니다. 이 메서드는 배열에서 제공된 함수가 true를 반환하는 요소를 하나 이상 찾은 경우 true를 반환합니다.

const array = ['🟦', '🔵', '🟦', '🔵'];

const result = array.some((item) => item == '🟦');

console.log('array: ' + array);
console.log('result: ' + result);

산출:

array: 🟦,🔵,🟦,🔵
result: true

6. every() 메서드

이 예제에서는 every() 메서드를 사용하여 배열의 모든 요소가 제공된 함수에 의해 구현된 테스트를 통과하는지 여부를 테스트했습니다. 메서드는 true 또는 false 를 반환합니다.

const array = ['🟦', '🟦', '🟦', '🔵'];

const result = array.every((item) => item == '🔵');

console.log('array: ' + array);
console.log('result: ' + result);

산출:

array: 🟦,🟦,🟦,🔵
result: false

다음 예제를 실행할 수 있습니다here.

이 솔루션이 유용하다고 생각되면 댓글 섹션에 알려 주시거나 반응을 남겨주세요 💗🦄💾.
읽어주셔서 감사하고 다음 게시물에서 뵙겠습니다! 😊🔜

우리에게 쓰기! ✉

해결해야 할 문제가 있거나 React 또는 JavaScript 주제와 관련하여 아무도 대답할 수 없는 질문이 있거나 멘토링을 찾고 있는 경우 dirask.com -> Questions에 문의하십시오.