본문 바로가기
Language/Javascript

Javascript - 배열 관련 함수

by 밍상 2022. 1. 18.

배열의 길이를 반환하는 함수 .length가 있다.

const arr = ['a', 'b', 'c']

console.log(arr.length) // 3

대상 배열과 주어진 별을 병합해서 새로운 배열을 반환하는 .concat() 함수가 있다.

대상 배열은 변경되지 않습니다.

const arr1 = ['a', 'b', 'c']
const arr2 = ['d', 'e', 'f']
const arr3 = arr1.concat(arr2) // ['a', 'b', 'c', 'd', 'e', 'f']

대상 배열의 모든 요소가 콜백 테스트를 통과하는지 확인하는 함수 .every()가 있다.

const arr = [1, 2, 3, 4]
const isValid = arr.every(item => item < 5)

console.log(isValid) // true

const isValid2 = arr.every(function (item) {
	return item < 4
})

console.log(isValid2) // false

주어진 콜백의 테스트를 통과하는 대상 배열의 모든 요소로 새로운 배열을 반환하는 함수 .filter()가 있다.

모든 요소가 테스트를 통과하지 못하면 빈 배열을 반환합니다.

const arr = [1, 2, 3, 4, 5]
const newArr = arr.filter(function (item) {
	return item < 4
})
console.log(newArr) // [1, 2, 3]

주어진 콜백 테스트를 통과하는 첫 번쨰 요소의 값을 반환하는 함수 .find()가 있다.

const arr = [5, 8, 130, 12, 44]
const foundItem = arr.find(item => item > 10)

console.log(foundItem) // 130

비슷하게 주어진 콜백 테스트를 통과하는 첫 번째 요소의 인덱스를 반환하는 함수 .findIndex()가 있다.

const arr = [5, 8, 130, 12, 44]
const foundIndex = arr.findIndex(item => item > 10)

console.log(foundIndex) // 2

for문을 대신해서 주어진 콜백을 배열 요소 각각에 대해 실행할 수 있는 함수 .forEach()가 있다.

for문은 break를 사용해서 중간에 멈출 수 있지만 forEach는 계속 반복해야 한다.

const arr = ['a', 'b', 'c']

arr.forEach(item => console.log(item))
//'a'
//'b'
//'c'

대상 배열이 특정 요소를 포함하고 있는지 확인하는 함수 .includes() 함수가 있다.

const arr = [1, 2, 3]
console.log(arr.includes(2)) // true

대상 배열의 모든 요소를 구분자를 기준으로 연결해 문자로 반환하는 함수 .join()이 있다.

const arr = ['Apple', 'Banana', 'Cherry']

console.log(arr.join()) // 'Apple,Banana,Cherry'
console.log(arr.join(', ')) // 'Apple, Banana, Cherry'
console.log(arr.join('/')) // 'Apple/Banana/Cherry'

대상 배열의 모든 요소에 대한 콜백의 반환 값을 모아 새로운 배열을 반환하는 함수 .map()이 있다.

원본 배열을 가공해서 새로운 배열을 만들때 자주 사용한다.

const arr = [1, 2, 3, 4]
const newArr = arr.map(item => item * 2)

console.log(newArr) // [2, 4, 6, 8]

대상 배열에서 마지막 요소를 제거하고 그 요소를 반환하는 .pop() 함수가 있다.

대상 배열의 마지막에 하나 이상의 요소를 추가하고, 배열의 새로운 길이를 반환하는 함수 .push()함수가 있다.

const arr = ['Apple', 'Banana', 'Cherry']

console.log(arr.pop()) //'Cherry'

arr.push('Cherry', 'Durian') // 4

console.log(arr) // ['Apple', 'Banana', 'Cherry', 'Durian']

대상 배열의 모든 요소 콜백의 마지막 반환 값을 반환하는 함수 .reduce()가 있다.

콜백의 반환 값을 다음 콜백에서 사용할 수 있다.

const arr = [1, 2, 3, 4]
const sum = arr.reduce(function (acc, cur){
	return acc + cur
}, -2)

console.log(sum) // 8

//arr.reduce(콜백, 초깃값)

대상 배열의 순서를 반전하는 .reverse() 함수가 있다.

대상 배열이 변경되니 유의해야 한다.

const arr = [1, 2, 3]
const reversed = arr.reverse()

console.log(arr) // [3, 2, 1]
console.log(reversed) // [3, 2, 1]

대상 배열에서 첫 번째 요소를 제거하고, 제거된 요소를 반환하는 함수 .shift()가 있다.

const arr = ['a', 'b' , 'c']

console.log(arr.shift(0)) //'a'
console.log(arr) // ['b', 'c']

대상 배열의 일부를 추출해 새로운 배열을 반환하는 함수 .slice()가 있다.

const arr = [0, 1, 2, 3, 4, 5, 6]
const sliced = arr.slice(2, 5) // [2, 3, 4]

대상 배열의 어떤 요소라도 콜백 테스트를 통과하는지 확인하는 함수 .some()이 있다.

const arr = [1, 2, 3, 4]

const isValid = arr.some(item => item > 3)

console.log(isValid) // true

대상 배열에 요소를 추가하거나 삭제하거나 교체하는 함수 .splice()가 있다.

대상 배열이 변경되니 유의해야 한다.

const months = ['Jan', 'March', 'April', 'June']
months.splice(1,0,'Feb')
console.log(months) // ['Jan', 'Feb', 'March', 'April', 'June']

months.splice(4, 1, 'May')
console.log(months) // ['Jan', 'Feb', 'March', 'April', 'May']

//months.splice(추가할 위치, 삭제할 개수, 추가할 값)

새로운 요소를 대상 배열의 맨 앞에 추가하고 새로운 배열의 길이를 반환하는 함수 .unshift() 함수가 있다.

대상 배열이 변경되니 유의해야 한다.

const arr = [1, 2, 3]

console.log(arr.unshift(0)) // 4
console.log(arr) // [0, 1, 2, 3]

'Language > Javascript' 카테고리의 다른 글

Javascript - 객체 관련 함수  (0) 2022.01.19
Javascript - 수학 관련 함수  (0) 2022.01.18
Javascript - ES란?  (0) 2022.01.18
Javascript - 숫자 관련 함수  (0) 2022.01.18
Javascript - 문자 함수  (0) 2022.01.18