본문 바로가기
JavaScript/엘리 JavaScript note

Part 8 <Array 개념과 APIs>

by 판순퐁 2021. 12. 26.

비슷한 타입의 object들을 모아놓은 것(바구니)
=> 자료구조

1. 배열 선언 2가지 방법
const arr1 = new Array();
const arr2 = [1,2] =>0번에 1, 1번에 2

2. Index position
const fruits = ['apple','banana'];
console.log(fruits); 
console.log(fruits.length); ->2
console.log(fruits[0]); -> apple

배열의 마지막 데이터에 접근할 때
console.log(fruits[fruits.length - 1]);

3. looping over an array
console.clear();

1) for(let i = 0; i < fruits.length; i++) {
        console.log(fruits[i]);
    }

2) for(let fruit of fruits) {
      console.log(fruit);
    }

3) forEach는 배열 안에 들어있는 value들마다 내가 전달한 함수를 출력함 

fruits.forEach(function (fruit, index, array) {
   console.log(fruit);
});

->
fruits.forEach((fruit) => console.log(fruit));

4. Addition, deletion, copy
배열의 맨 끝에 삽입, 삭제-> push, pop

fruits.push('orange', 'peach');
console.log(fruits);

fruits.pop();
console.log(fruits);

앞에서 삽입,삭제 -> unshift, shift
fruits.unshift('lemon', 'peach');

fruits.shift();

★shift와 unshift는 push와 pop보다 매우 느리다!
웬만하면 사용 노!
-------------------------------------------------------------------------------------------------------------
splice: index를 이용한 제거
array(제거할 인덱스시작 번호, [갯수])

fruits.push('lemon','orange','grape');

fruits(1); -> index1부터 끝까지 지움

fruits(1,1); -> index 1 한개의 데이터만 지움

**사용법 2번째 -> 삽입도 됨
ex) fruits.splice(1,1,'apple','wartermelon');

--------------------------------------------------------------------------------------------------------------
*combine two arrays

const fruits2 = ['자몽','코코넛'];
const newFruits = fruits.concat(fruits2);
console.log(newFruits);


---------------------------------------------------------------------------------------------------------------
5. Searching 검색
//find the index

*indexOf -> index/ 없으면 -1나옴

console.log(fruits.indexOf('apple')); -> 0

*includes -> true/false

console.log(fruits.includes('watermelon');


*lastIndexOf
만약 똑같은 데이터가 있다면 제일 마지막에 있는 똑같은 값의 인덱스가 나옴

'JavaScript > 엘리 JavaScript note' 카테고리의 다른 글

Part9 <배열 함수 10가지>  (0) 2021.12.27
Part 7 <Object>  (0) 2021.12.26
Part 6 <Class vs Object>  (0) 2021.12.26
Part 5 <Functions 함수>  (0) 2021.12.26
Part 4 <연산, 반복문>  (0) 2021.12.25