자바스크립트의 배열

 

 

 

 

'배열' 이라는 번역어보다 loop로 이해하니 좀 더 빠르게 숙지할 수 있었다.

 

 


 

 

 

for : 가장 기본적인 loop. 배열의 각 요소에 대해 반복문을 수행한다.

for (let i = 0;   // i 라는 변수를 0으로 초기화. i는 arr의 index. 반복문의 시작점 설정 //
     i < arr.length;  // 반복문의 조건. arr.length는 arr의 요소 개수. // 
     i++) {      // 반복문이 끝날 때마다 i의 값이 1씩 증가. 다음 배열로 이동. //
 console.log(arr[i]);  // arr[i]는 배열 arr의 i번째 요소를 참조. //
}

 

 

forEach : 배열의 각 요소에 지정된 함수를 실행한다. (콜백 함수를 인자로 받는다.)

arr.forEach(function(element)) {
  console.log(element);
});

 

 

map : 배열의 모든 요소에 새로운 배열을 생성한다.

const newArr = arr.map(function(element)) {  // function(element)는 map에 전달되는 콜백함수. //
   return element * 2;  // 콜백함수 내부에서 실행되는 코드. 반환된 값은 새로운 배열로 저장된다. //
});

 

 

some : 배열의 요소 중 하나라도 조건을 만족하면 true를 반환한다.

const hasNegative = arr.some(function(element)) {
	return element < 0;   // 현재 요소 element가 0보다 작으면 true, 아니면 false //
});

 

 

every : 배열의 모든 요소가 조건을 만족하면 true를 반환한다.

const allPositive = arr.every(function(element) {
	return element > 0;
});

 

 

filter : 주어진 함수의 조건을 만족하는 모든 요소를 포함하는 새로운 배열을 반환한다.

const postitiveNumbers = arr.filter(function(element)) {
	return element > 0;
});

 

 

reduce : 배열의 모든 요소에 대해 콜백 함수를 실행하고, 하나의 결과값을 반환한다. (주로 배열의 요소를 합치거나 변형할 때 사용한다)

const sum = arr.reduce(function(accumulator, currentValue)) {
	return accumulator + currentValue;
}, 0);      // 초기값 0부터 시작하도록 설정 //

'개념 정리' 카테고리의 다른 글

반응형 작업과 mediaquery 최소화  (0) 2024.01.21
CSS 애니메이션 최적화  (0) 2024.01.21
CSS 3D 활용  (0) 2024.01.21
Font의 Preload  (0) 2024.01.12
시멘틱 태그와 웹 표준  (0) 2023.12.26

+ Recent posts