배열[Array]
자바스크립트 배열 생성방법
1.const myArray = [];
2.const myArray = new Array();
배열안에는 객체,배열을 넣을 수 있다.
자바스크립트 배열 삭제
myArray.splice(삭제할 인덱스 번호,번호부터 몇 개를 삭제할것인지 기입.)
(이전 인덱스부터 삭제하고 싶다면 -1부터 기입)
Array.push(추가할 값)
배열의 끝번호부터 값을 추가한다
Array.pop()
배열의 [[끝]]에 있는 아이템을 리턴해주고 해당 아이템은 배열에서 삭제
Array.shift()
배열의 첫 아이템 삭제, 그 뒤에 있는 아이템을 앞으로 당김
Array.concat()
const array3 = array3.concat(array1,array2)
두 배열을 합치는 함수
Array.join
배열을 하나의 문자열로 만듭니다.
const array = ['바람', '비', '불'];
const newArray = array.join();
newArray = '바람,비,불'
var myVar2 = a.join(', ');
myVar2에 '바람, 비, 불'을 대입프로젝트를 진행하면서, 배열로 가져온 정보를 화면에 뿌려야했는데, 모든 글씨들이 붙어 나왔다. 글씨들을 떨어트리기 위해서 처음에는 map을 활용하여 item + ', '을 하였으나, 배열 끝의 string까지 콤마가 붙어 골치아팠는데,
join 함수를 통해 매우 간단히 해결할 수 있었다.
Array함수를 얼만큼 아느냐에 따라 코딩시간이 짧아지는 것 같다.
Array.reverse
오른쪽에서 왼쪽으로 (역순으로) 배치해준다.
Array.slice
배열의 일부분을 반환해준다
Array.slice(a,b) : a 아이템 인덱스번호부터 시작해서, b-1 아이템 인덱스까지 추출
Array.forEach(item)
for문을 대체해서 간단히 배열의 각 아이템을 가져올 수 있는 함수.
Array.map
map() 메서드는 배열 내의 모든 요소 각각에 대하여 주어진 함수를 호출한 결과를 모아 새로운 배열을 반환합니다.
작성법
arr.map(callback(currentValue, index, array), thisArg)
배열에서 지정한 데이터가 위치한 인덱스 번호를 리턴한다. 없으면 -1 리턴
Array.indexOf
배열 내 객체에 들어 있는 값의 인덱스를 알고 싶다면 findIndex를 사용한다.
Array.findIndex(item => (Array.name === ' Emerson ');
배열 내 객체들에 키값 name이 Emerson인 객체를 찾아 index번호를 리턴해줌.
Array.find
findindex와 유사하지만 데이터 위치를 리턴하는 것이 아니라, 지정한 데이터가 들어 있는
객체를 리턴함
Array.filter(fn)
배열에서 특정 조건에 맞는 아이템만 추출함 (true값)
Array.from(1번매개변수 :복사할 배열객체 또는 반복가능객체 2번 : mapping할 함수)
Array.call
주어진 this 값 및 각각 전달된 인수와 함께 함수를 호출합니다.
주의: 이 함수 구문은 apply()와 거의 동일하지만, call()은 인수 목록을, 반면에 apply()는 인수 배열 하나를 받는다는 점이 중요한 차이점입니다.
객체 구조 분해 할당 (비구조화 할당) 문법
const data = {
name : "dave",
age : 20
};
const { age, name } = data; // 동일한 프로퍼티명을 써줘야, 해당 프로퍼티에 맞는 값이 대입됨
console.log(name,age) = dave 20
가져오고 싶은 객체의 키값 입력으로 가져올 수 있다.
다른 이름으로 가져오고 싶다면 .
const { name = myName , age = myAge } = data
console.log(myName,myAge);
const data = {
name : "Emerson",
age : 33,
job : "doctor"}
undefined
const { job } = data;
job // "doctor"
--
배열 분해 할당
const data = [1,2,3];
const [item1,item2] = data;
console.log(item1,item2);
item1,item2 라고 해도 해당 번호가 index번호를 의미하는 것은 아니다.
item3,item4로 매개변수를 입력해도 1,2를 가져옴 .
data 배열은 변형되지 않는다
const data = [1,2,3];
const [item1,item2] = data;
data = (3) [1, 2, 3]
function ab(){
return item1 * item2
} // item1,item2가 전역변수, 사용할 수 있는 지역변수라면 빼와서 사용이 가능
ab(item1,item2) 결과값 2
data 결과값 (3) [1, 2, 3][item1,item2] 결과값 (2) [1, 2]
문법 활용 팁
값 치환하기
let a = 1;
let b = 2;
[a, b] = [b, a];
함수 리턴시 여러 데이터 넘겨주기
function getData(){
return [10,20];
}
let[a,b] = getData();
문자열 배열로 만들기
const data = 'dog','cat','turtle;
console.log(data.split(',');
결과값 : (3) ["dog" , "cat" , "turtle"]
구조분해할당 활용 팁
일반 문자열인 const data를 배열로 가져올 수 있다.
const data = "Orange,Apple,Banana,Melon,Kiwi"
newdata = data.split(',');
newdata 결과값 (5) ['Orange', 'Apple', 'Banana', 'Melon', 'Kiwi']
secondData[favorite,good,most] = newdata.split
secondData
Array.fill(value[, start[, end]])
.fill(채울값,시작인덱스,종료인덱스)
