배열

배열

여러개의 데이터를 하나의 변수로 활용하기 위한 프로그래밍 기법으로, 배열을 이용한다는 것은 객체를 선언하고 그 객체에 여러 개의 데이터를 담아 이용하겠다는 의미이다.

배열 선언 방법

• []표기법
  

• Array 생성자
  

데이터 개수 파악

let array = [10, 20];
console.log(array.length) // 2

배열 데이터 획득 - forEach

array.forEach((data, index) => {
  console.log(`array[${index}] = ${data}`)

배열 데이터 추가

array.push(30);
console.log(array) // 10, 20, 30

배열의 함수들

함수	설명	추가	사용법
concat()	두 배열을 합쳐 하나의 배열을 만드는 함수		let array3 = array1.concat(array2)
join()	배열 데이터를 구분자로 연결해 문자열로 만드는 함수		let result = array.join('-')
push()	배열에 데이터를 추가	맨 뒤에 추가	array.push(30, 40)
unshift()	배열에 데이터를 추가	맨 앞에 추가	array.unshifht(30, 40)
pop()	배열의 데이터를 제거	맨 뒤의 데이터 제거	array.pop()
shift()	배열의 데이터를 제거	맨 앞의 데이터 제거	array.shift()
splice()	지정된 위치의 데이터 획득		array.splice(2, 0, "hello", "world")
slice()	특정 위치의 데이터 획득		array.slice(1, 4)
forEach()	배열의 데이터 개수만큼 함수 반복 실행	⭐️⭐️⭐️⭐️⭐️
filter()	조건에 만족하는 배열 데이터만 추출	⭐️⭐️⭐️⭐️⭐️
every()	배열의 데이터가 특정 조건에 모두 만족하는 지 판단
map()	배열의 데이터로 함수를 실행, 반환 값을 모아서 배열로 만드는 함수	⭐️⭐️⭐️⭐️⭐️
sort()	배열의 데이터를 정렬하는 함수		array.sort()

🎯 splice

중간 특정 위치에 데이터를 추가하거나, 제거 혹은 교체해야하는 경우에 사용하는 함수이다.

데이터 추가

array.splice('데이터 추가되는 위치', '교체하는 데이터 개수', '추가하는 데이터(여러개 가능)')

데이터 교체

데이터 삭제

🎯 slice

배열의 데이터를 획득할 때 사용한다.
인덱스 사이의 데이터 여러개를 한번에 획득할 수 있으며, 획득한 데이터를 배열로 반환한다.

• 매개변수를 1개만 지정하면 - 그 인덱스 위치의 데이터부터 오른쪽의 모든 데이터가 획득
  

🎯 filter

배열의 데이터 중 조건에 맞는 데이터만 추출하고자 할 때 사용한다.
배열의 개수 만큼 순차적으로 매개변수에 지정된 한함수가 호출된다.

매개변수의 함수에서 true를 반환하는 데이터만 추출해서 결과를 반환한다. (배열로)

🎯 every

배열의 데이터가 특정 조건에 모두 만족하는 데이터인지를 판단하기 위해서 사용된다.

배열의 데이터가 순차적으로 함수로 전달되며 결과는 true/false가 반환된다.
모두 true면 최종 값이 true이며, 하나라도 false를 반환하면 false이다.

🎯 map

배열의 데이터로 특정 로직을 실행하고, 그 결과를 다시 모아서 반환할 때 사용한다.

❗️ 배열의 데이터 개수 = 최종 반환되는 데이터 개수

🎯 sort

❗️ 정렬하기 전에 배열 내의 값을 내부적으로 문자열로 변환해야한다!!
❌ 숫자로 이뤄진 배열을 정렬하면 엉뚱한 결과를 얻을 수 있다.

sort 함수에 대하여

Date 함수

시간/날짜 데이터를 이용할 때 여러 연산이 가능하게 해주는 함수이다.
new를 이용하여 생성한다.

let date = new Date();

함수 종류

함수	설명
getFullYear()	년도를 반환
getMonth()	월을 반환 ( 0이 1월!! )
getDate()	일을 반환
getDay()	요일을 반환 ( 0이 일요일!! )
getHours()	시간을 반환
getMinutes()	분을 반환
getSeconds()	초를 반환
getTime()	타임 스탬프 값을 반환

타임 스탬프

💡 타임 스탬프
어떤 특정 순간의 시간/날짜를 표현하는 데이터
➡️ UTC 기준 1970년 1월 1일 자정부터 경과된 밀리초 값

일반적으로 사람들은 2000년 1월 1일 00분 00초 라고 이야기하지만 소프트웨어 적으로는 년/월/일/시/분/초를 따로 데이터적으로 유지하기 불편하며 어떤 날짜가 빠른지 계산하기 불편하다.

이때 일관된 하나의 데이터로 표현하여 둘 이상의 시각을 비교하거나 기간을 계산하는데 사용되는 것이 타임스탬프이다.

두 시간 비교하기 - 타임 스탬프 값 비교

Date 객체를 비교하여 어느 객체의 시간이 더 이전 시간인지 판단하는 경우가 있다.

if(regDate.getTime() < eventStartDate.getTime()) { }

Math 함수

함수	설명
Math.PI	원주율 값을 가지는 프로퍼티
Math.abs()	절댓값 반환
Math.cell()	올림 값 반환
Math.floor()	내림 값 반환
Math.round()	반올림 값 반환
Math.max()	최대값 반환
Math.min()	최소값 반환
Math.pow()	제곱근 반환
Math.random()	난수 반환 (0, 1 사이 실수)