블로그 하기전 읽고 지나가버려서 다시 복습, 정의정리할겸 작성함.
배열
여러 값을 순서대로 저장할 수 있는 객체 타입으로,
각 값에는 0부터 시작하는 인덱스가 할당됨.
배열을 사용하면 여러 데이터를 하나의 변수에 그룹화하여 관리할 수 있음
배열선언
리터럴 방식: 가장 간단하고 일반적인 배열 생성 방법.
기본문법
let fruits = ["사과", "오렌지", "자두"];
new Array() 생성자: 이 방법은 new 키워드와 함께 Array 객체를 생성.
기본문법
let fruits = new Array('사과', '바나나', '체리');
- 배열은 인덱스라는 숫자가 0부터 시작해서 차례대로 매겨져있음. 숫자는 배열내 순서를 말함.
let fruits = ["사과", "오렌지", "자두"];
console.log( fruits[0] ); // 사과
console.log( fruits[1] ); // 오렌지
console.log( fruits[2] ); // 자두
fruits[0] = "바나나"; //fruits변수 0번 인덱스 사과 대신 바나나를 대입함.
console.log( fruits[0] ); // 바나나
fruits[3] = "레몬"; //fruits변수 3번 인덱스는 없는 상태.
//여기에 요소를 새롭개 추가할수도 있음
console.log( fruits[3] ); // 레몬
console.log(fruits.length); // 4. length를 사용하면 요소 갯수도 알수 있음.
console.log(fruits); // 바나나, 오렌지, 자두, 레몬
- 배열 요소의 자료형에는 제약이 없음.
let arr = ['사과',
{
name: '이보라',
age: 30
},
true,
function(){
console.log('안녕하세요.');
}
];
console.log(arr[1].name); // 이보라. 인덱스가 1인 요소(이 예시에선 객체)의 name 프로퍼티를 출력.
arr[3](); // 안녕하세요. 인덱스가 3인 요소(이 예시에선 함수)를 실행.다차원 배열
배열은 배열의 요소가 될 수 있음.
이러한 구조는 주로 행렬이나 데이터 테이블을 표현할 때 사용
let matrix = [
[1, 2, 3],
[4, 5, 6],
[7, 8, 9]
];
console.log(matrix[0][1]); // 2
console.log(matrix[1][0]); // 4
console.log(matrix[2][2]); // 9
matrix[0][0] = 10; // 첫번째행 0번인덱스, 첫번째열 0번인덱스 배열요소 수정
console.log(matrix[0][0]); // 10pop·push와 shift·unshift
배열을 직접 수정하는 메서드들
pop·push >> 배열 뒷부분 관련. 단순히 뒷부분 추가제거라서 빠르고 효율적임.
shift·unshift >> 배열 앞부분 관련. 기존배열 인덱스 값들이 변경됨
배열에 요소가 많은 경우 요소들 이동하는시간이 길어지고 메모리관련 연산도 많아짐.
pop()
배열의 마지막 요소를 제거하고, 그 요소를 반환. 배열이 비어있으면 undefined를 반환
let fruits = ["사과", "오렌지", "배"];
console.log(fruits.pop()); // 배열에서 "배"를 제거후 그 요소를 콘솔창에 띄움
console.log(fruits); // 사과,오렌지push()
배열의 끝에 하나 이상의 요소를 추가하고, 변경된 배열의 길이를 반환
let fruits = ["사과", "오렌지"];
fruits.push("배");
console.log( fruits ); // 사과,오렌지,배shift()
배열의 첫 번째 요소를 제거하고, 그 요소를 반환. 배열이 비어있으면 undefined를 반환.
이 작업은 배열의 모든 요소가 한 칸씩 앞으로 이동
let fruits = ["사과", "오렌지", "배"];
console.log(fruits.shift()); // 배열에서 "사과"를 제거하고 제거된 요소를 콘솔창에 띄움.
console.log(fruits); // 오렌지,배unshift()
배열의 시작 부분에 하나 이상의 요소를 추가하고, 변경된 배열의 길이를 반환
let fruits = ["오렌지", "배"];
fruits.unshift('사과');
console.log( fruits ); // 사과,오렌지,배- push와 unshift(배열에 값을 더하는 경우)는 여러 요소를 한번에 추가할수도 있음
let fruits = ["사과"];
fruits.push("오렌지", "배");
fruits.unshift("파인애플", "레몬");
console.log( fruits );// ["파인애플", "레몬", "사과", "오렌지", "배"]배열의 내부 동작 원리
배열은 특별한 종류의 객체. arr[0]처럼 대괄호를 사용해 접근하는 방식은 객체 문법
다만 배열은 키가 숫자임.
객체 기본 기능 이외에도 순서가 있는 컬렉션을 제어하게 해주는
특별한 메서드 length 프로퍼티도 제공.
- 배열은 객채와 마찬가지로 참조를 통한 복사를 함.
let fruits = ["바나나"]
let arr = fruits; // 참조를 복사함(두 변수가 같은 객체를 참조)
//변수fruits 값이 저장되있는 주소를 arr도 참조한다는 이야기.
alert( arr === fruits ); // true
arr.push("배"); // 참조를 이용해 배열을 수정.
alert( fruits ); // 바나나,배.
//arr과 fruits는 같은 곳을 가르키고 있음 . arr을 통해 그 가르키는 곳에 '배'를 집어넣으면
//같은 곳을 참조하고 있는 fruits도 '배'를 집어넣은 그값을 똑같이 봄.- 배열은 순서가 있는 자료를 저장하는 용도로 만들어진 특수한 자료구조.
임의의 키를 사용해야 한다면 배열보단 일반 객체 {}를 쓰는게 맞음.
반복문
배열을 순회 할때 쓰는 반복문 for, for..of
for..in은 쓸수는 있지만 가능하면 사용 하지말것
- for문
let arr = ["사과", "오렌지", "배"];
for (let i = 0; i < arr.length; i++) {
//매개변수 i는 기본값0이고, arr배열의 길이보다 작을때까지 반복함. 반복후 i는 1증가
console.log(arr[i]);//사과,오렌지,배
}- for..of문
let fruits = ["사과", "오렌지", "자두"];
// 배열 요소를 대상으로 반복 작업을 수행합니다.
for (let fruit of fruits) {
//매개변수 fruit에 배열fruits 요소길이만큼 반복하는데, 각 반복할때마다 값을 fruit에 할당.
console.log(fruit);//사과,오렌지,자두
}length’ 프로퍼티
배열 내 요소의 개수. 정확히 표현하면 배열내 가장 큰 인덱스에 1을 더한값.
- 읽기 : 배열의 현재 크기를 얻을 수 있음.
let fruits = ["사과", "바나나", "체리"];
console.log(fruits.length); // 3을 출력- 쓰기 : length 프로퍼티에 값을 할당함으로써 배열의 크기를 동적으로 변경할 수 있음.
배열을 짧게 만들 경우, 초과하는 요소들은 제거됨.
let fruits = ["사과", "바나나", "체리"];
fruits.length = 2; // 배열의 길이를 2로 설정
console.log(fruits); // ["사과", "바나나"]를 출력
fruits.length = 0; // 배열의 길이를 0로 설정 .배열이 비워짐
console.log(fruits); // [] 빈배열
- 배열에 요소 추가 : 배열의 끝에 새로운 요소를 추가할 수 있음.
let fruits = ["사과", "바나나"];
fruits[fruits.length] = "체리"; // "체리"를 배열의 끝에 추가
console.log(fruits); // ["사과", "바나나", "체리"]를 출력갑자기 생각난 push(). 똑같은 기능을 하지만
사용의 편리성,가독성, 여러요소를 한번에 추가할수 있는능력때문에 push를 쓰는게 더 권장됨.
- 빈 공간 생성 : length 프로퍼티 값이 실제 요소의 개수보다 크게 설정되면,
배열에는 빈 슬롯이 생성.
let fruits = ["사과"];
fruits.length = 3; // 배열 길이를 3으로 설정
console.log(fruits); // ["사과", <2 empty slots>]을 출력
fruits[11] = "배"; //11번째 인덱스에 배를 할당
console.log(fruits.length) //12일반적으로 좋은 방법이 아니며, 가능한 피하는 것이 좋음. 단 이런경우때문에
'배열내 가장 큰 인덱스에 1을 더한값' 이라는 정의가 내려짐.
toString
배열엔 toString 메서드가 구현되어 있음.
호출하면 배열의 모든 요소가 쉼표로 구분된 하나의 문자열로 변환됨.
console.log( [] + 1 ); // "1"
//빈 배열 []는 toString 메서드에 의해 빈 문자열 ""로 변환되고,
//이후 "" + 1 = "1"
console.log( [1] + 1 ); // "11"
//배열 [1]은 toString 메서드에 의해 "1"로 변환되고,
//이후 "1" + 1 = "11"
console.log( [1,2] + 1 ); // "1,21"
// 배열 [1,2]는 toString 메서드에 의해 "1,2"로 변환되고,
//이후 "1,2" + 1 = "1,21"이 됨."+" 연산자를 사용할 때, 만약 한쪽 피연산자가 문자열이라면
다른 피연산자도 문자열로 변환하려고 시도함.
이 과정에서 배열은 자동으로 toString 메서드를 통해 문자열로 변환됨.
배열을 다룰 때, 이러한 형 변환은 예상치 못한 결과를 초래할 수 있으므로 주의
