JavaScript 문법 - 2

박재민·2024년 1월 2일
0

TIL

목록 보기
6/49

JavaScript 배열


배열 (List)

기본 구조

let fruits = ["사과", "바나나", "오렌지"]

// 크기 지정
console.log(fruits.length) // 5

// 요소 접근
console.log(fruits[0]) // 사과
console.log(fruits[1]) // 바나나
console.log(fruits[2]) // 오렌지

배열 메소드

push

- 배열의 마지막에 요소 추가
let fruits = ["사과", "바나나"]
console.log(fruits) // [ '사과', '바나나' ]

fruits.push("오렌지")
console.log(fruits) // [ '사과', '바나나', '오렌지' ]

pop

- 배열의 마지막 요소 삭제
let fruits = ["사과", "바나나"]
console.log(fruits) // [ '사과', '바나나' ]

fruits.pop()
console.log(fruits) // [ '사과' ]

shift

- 배열의 첫번째 요소를 삭제
let fruits = ["사과", "바나나", "키위"]
console.log(fruits) // [ "사과", "바나나", "키위" ]

fruits.shift()
console.log(fruits) // [ "바나나", "키위" ]

unshift

- 배열 맨 앞에 어떤 걸 추가
let fruits = ["사과", "바나나", "키위"]
console.log(fruits) // [ "사과", "바나나", "키위" ]

fruits.unshift("포도")
console.log(fruits) // [ "포도", "사과", "바나나", "키위" ]

splice

- n번째 요소부터 시작해서 n개를 삭제하고 그 자리에 a를 넣음
let fruits = ["사과", "바나나", "키위"]
fruits.splice(1, 1, "포도")

console.log(fruits) // [ '사과', '포도', '키위' ]

slice

- n번째 요소 부터 n번째 요소 까지 새로운 배열
let fruits = ["사과", "바나나", "키위"]
let slicedFruits = [fruits.slice(1, 3)]

console.log(slicedFruits) // [ '바나나', '키위' ]

forEach

- 각 요소들을 순회하게 함
- 매개변수 자리에 함수를 넣는 것 : 콜백 함수
let numbers = [4, 1, 5, 4, 2 ]

numbers.forEach(function (item) {
  console.log("item 입니다 =>" + item)
})

// item 입니다 =>4
// item 입니다 =>1
// item 입니다 =>5
// item 입니다 =>4
// item 입니다 =>2

map

- 기존에 있었던 배열을 가공해서 새로운 배열을 생성
- 항상 원본 배열의 길이만큼 리턴된다.
- map 함수에 들어가는 function 은 반드시 return 문을 가져야함
let numbers = [4, 1, 5, 4, 2 ]

let Newnumbers = numbers.map(function (item) {

  return item * 2
})

console.log(Newnumbers) // [ 8, 2, 10, 8, 4 ]

filter

- 기존에 있었던 배열에서 조건에 해당하는 것만 새로운 배열을 생성해서 리턴함
let filterednumbers = numbers.filter(function (item) {
  
  return item > 3
})

console.log(filterednumbers) // [ 4, 5, 4 ]

find

- return문을 통해서 조건에 맞는것만 새로운 배열을 생성해서 리턴
- 조건에 맞는 첫번째만 반환함
let result = numbers.find(function(item) {
  return item > 3
})

console.log(result) // 4

0개의 댓글