배열(Array)
변수의 종류중 하나로, 배열에는 다양한 값을 저장할 수 있다.
배열의 특징
const animals = ["rabbit","turtle","giraffe"];
[] 안에 값을 넣어 선언을 할 수 있으며,
console.log(animals[0]);
animals[0] [] 안에 인덱스를 넣어 해당 부분에 접근할 수 있다.
// rabbit
배열은 참조 값을 저장하기 때문에 다음과 같이 얕은 복사로 할당할 경우에
animals2의 값을 바꾸면 animals의 값도 바뀌는 문제가 생길 수 있다.
const animals2 = animals;
animals2[0] = "cat";
console.log(animals);
// ["cat", "turtle", "giraffe"]
console.log(animals2);
// ["cat", "turtle", "giraffe"]
따라서 전개 연산자(...)를 사용해 깊은 복사를 한다면 이를 해결할 수 있다.
const animals2 = [...animals];
animals2[0] = "cat";
console.log(animals);
// ["rabbit", "turtle", "giraffe"]
console.log(animals2);
// ["cat", "turtle", "giraffe"]
배열의 타입
배열은 typeof를 사용할 경우 "object"라 나온다.
그렇기 때문에 object만을 입력받아야 하는 조건을 만들땐, Array.isArray()를 사용하면 된다.
array 타입이 맞을경우 true, 아니면 false를 반환한다.
console.log(Array.isArray(animals));
// true
자주 사용하는 메소드
forEach 배열 순환
animals.forEach((item,index)=>{
console.log(item,index);
})
// rabbit 0
// turtle 1...
map 배열 순환후 반환
배열 내의 모든 요소 각각에 주어진 함수를 호출, 새로운 배열을 반환한다.
foeEach와 마찬가지로 (item,index,array)를 받아올 수 있다.
const animals = ["rabbit","turtle","giraffe"];
const animals2 = animals.map(item => item);
// ["rabbit","turtle","giraffe"]
push 배열 끝 추가
animals.push("cat");
// ["rabbit","turtle","giraffe","cat"]
pop 배열 끝 제거
animals.pop();
// ["rabbit","turtle","giraffe"]
shift 배열 앞 제거
animals.shift();
// ["turtle","giraffe"]
unshift 배열 앞 추가
animals.unshift("rabbit");
// ["rabbit","turtle","giraffe"]
indexOf 배열 안 인덱스 찾기
animals.indexOf("rabbit");
// 0
splice 인덱스 위치 제거 및 교체
animals.splice(index,number,item1,item2...); // index = 0, number=1;
// ["turtle","giraffe"]
// 여러개 제거하기
animals.splice(1,2);
// ["rabbit"]
// 제거 후 교체
animals.splice(1,1,"cat");
// ["rabbit", "cat", "giraffe"]
slice 배열 복사
const animalsCopy = animals.slice(); // slice(start,end)
// ["rabbit","turtle","giraffe"]
concat 배열 합체
인자로 주어진 배열이나 값들을 기존 배열에 합쳐서 새 배열을 반환한다.
기존 배열을 변경하지 않고 새로운 배열을 반환한다.
const animals = ["rabbit","turtle","giraffe"];
const animals2 = ["cat"];
const animalsConcat = animals.concat(animals2);
// ["rabbit","turtle","giraffe","cat"]
join 배열을 하나의 문자열로
기존 배열을 변경하지 않고 새로운 문자열을 반환한다.
const animals = ["rabbit","turtle","giraffe"];
const animalsJoin = animals.join("-"); // ()안에 구분할 문자를 넣는다. ("") 공백 없이
// "rabbit-turtle-giraffe"
반응형
'공부 > JavaScript' 카테고리의 다른 글
유용한 JS 고차함수 (0) | 2021.07.07 |
---|---|
DOM 조작 (0) | 2021.07.05 |
클로저 함수 (0) | 2021.07.01 |
객체(Object) (0) | 2021.06.29 |
알면 좋은 자바스크립트 최신 문법 (1) | 2021.06.17 |
댓글