자바스크립트 배열(array)

자료구조

비슷한종류의 데이타들을 묶어서 저장하는것

object 와 자료구조의 차이점

배열

  • index는 0 부터 시작됨

  • 삽입, 삭제가 편리함

//1. Delcaration 배열 선언 방법
const arr1 = new Array();
const arr2 = [1, 2]; // 흔하게 쓰이는 방법

Index position

// 2. Index position
const fruits = ['🍒', '🍎'];
console.log(fruits); //🍒, 🍎
console.log(fruits.length); // 2
// key 라는 string을 이용해서 key에 상환하는 값을 받아올 수 있음 
// 배열은 인덱스 번호를 적어주면 그값을 상환할 수 있음
console.log(fruits['0']) // 🍒
console.log(fruits['1']) // 🍎
// 제일 마지막 index를 받아오는 방법
console.log(fruits[fruits.length - 1]); // 🍎  0 부터 시작하기때문에 -1 을 해주면 마지막 인자를 출력함

Looping over an array

// 3. Looping over an array 
// print all fruits 과일(🍒,🍎) 모두 출력 하기 

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

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

// c. forEach
fruits.forEach((fruit) => console.log(fruit)); // 🍒,🍎
//forEach 는 array에 들어있는 값(value)마다 callback함수를 실행한다.
// forEach (callbackfn: value , index, array ) -> 보통은 array는 받아오지 않음

Addition, deletion, copy(추가, 빼기, 복사 방법)


// push: add an itemto the end(뒤에 추가)
fruits.push('🥝', '🍍'); 
console.log(fruits); // 🍒,🍎,🥝,🍍


// pop: remove an item from the end (뒤에 빼기)
fruits.pop(); // 🍒,🍎,🥝
fruits.pop(); // 🍒,🍎
console.log(fruits); 

// unshift: add an item to the benigging (앞에 추가)
fruits.unshift('🍇', '🍏'); 
console.log(fruits); // 🍇, 🍏,🍒,🍎

// shift: remove an item to the benigging (앞에 빼기)
fruits.shift(); // 🍏,🍒,🍎
fruits.shift(); // 🍒,🍎
console.log(fruits);

// note!! shift, unshfit are slower than popm push
// shift, unshfit (앞에 추가,빼기)는 push,pop(뒤에 추가,빼기)보다 훨씬 느림
// 뒤에서 추가,빼기 하는것은 기존의 배열의 아이템들을 건드리지 않고 뒤에 빈공간에 생성하고, 없애고 하기때문
// 앞에서 데이터를 넣기위해는 3번째 빈데이터에 넣고 1번데이터를 2번으로 넣고 그다음에 새로운것을 넣어야함 빼기는 반대로 
// pop,push를 사용하는것이 좋다. 

// splice:remove an item by index position
// 선택한 index만 지우는법 
fruits.push('🍊', '🍑', '🍈');
console.log(fruits);  // 🍒, 🍎 ,🍊, 🍑,🍈
// 지우는 갯수를 설정해주지 않으면 지정한 인덱스부터 모든인덱스들을 지워져 버림 
// fruits.splice(index 번호, 지우는갯수);
fruits.splice(1, 1);
console.log(fruits); // 🍒 ,🍊, 🍑,🍈
fruits.splice(1, 1, '🍇', '🍍', '🥝');  // 🍒 ,🍇, 🍍, 🥝, 🍑,🍈 
// 해당 인덱스(🍊)가 지워지고 그자리에  '🍇', '🍍', '🥝' 추가된다.
console.log(fruits);

//combine two arrays
const fruits2 = ['🍋', '🥭'];
//concat을 호출하는 배열에 새로호출하는 array items 합친다.
const newFruits = fruits.concat(fruits2);
console.log(newFruits); // 🍒 ,🍇, 🍍, 🥝, 🍑,🍈 ,🍋, 🥭

Searching / includes

// indexOf: find the index
console.clear();
console.log(fruits); // 🍒 ,🍇, 🍍, 🥝, 🍑,🍈 ,🍋, 🥭
console.log(fruits.indexOf('🍇')); // 1
console.log(fruits.indexOf('🍍')); // 3
console.log(fruits.indexOf('🍊')); // 배열안에 존재하지 않는 값은 -1로 입력이됨 

// includes
console.log(fruits.includes('🍍')); //true
console.log(fruits.includes('🍊')); //false

lastIndexOf

// IndexOf는 제일 첫번째 아이템을 리턴하고 출력하게됨
// lastIndexOf는 반대로 제일마지막에 있는 값을 출력하게된
console.clear();
fruits.push('🍇'); // 🍒 ,🍇, 🍍, 🥝, 🍑,🍈 ,🍋, 🥭, 🍇
console.log(fruits);
console.log(fruits.indexOf('🍇')); // 1 
console.log(fruits.lastIndexOf('🍇')); // 8

Last updated