[JS]06-Array 배열

1. 선언하는 방법

const arr1 = new Array();
const arr2 = [1, 2]; // 좀더 흔하게 쓰이는 방법

 

2. Index positon

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

<출력하는 방법>

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

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

//forEach (제일 간단한 방법)
fruits.forEach((fruit)=> console.log(fruit));

4. Addition, deletion, copy

 

• push / pop

//push: 배열끝에 아이템 추가
fruits.push('peach', 'lemon ');
console.log(fruits);->['apple', 'banana', 'peach', 'lemon ']

//pop: 배열끝의 아이템 1개 제거
fruits.pop(); 
console.log(fruits); -> ['apple', 'banana', 'peach']

 

• unshift / shift

//unshift: 배열 시작부분에 아이템 추가
fruits.unshift('cherry');
console.log(fruits);->['cherry', 'apple', 'banana', 'peach']

//shift: 배열 시작부분의 아이템 1개 제거
fruits.shift();
console.log(fruits); ->['apple', 'banana', 'peach']

 

unshift 와 shift는 pop과 push보다 느리다 그래서 pop과 push사용을 권장.

느린이유: 끝에서 추가삭제는 데이터이동이 없지만, 앞에서의 추가삭제는 데이터이동 후 이루어지기 때문!

예) 인덱스 0번에 있던 사과가 unshift사용으로 체리가 추가되면 사과는 인덱스1로 이동후 체리가 0번으로 오게됨

 

• splice

//splice: 특정인덱스의 아이템을 제거
splice(start: number, deleteCount: number, ...items: T[])


const number = ['zero','one','two','three'];
number.splice(2); //['zero', 'one'] deleteCount를 지정을 안해줘서 인덱스2번부터 끝까지 삭제됨
number.splice(1,2); // ['zero', 'three'] 1번을 기점으로 2개 삭제됨
number.splice(1,1,'하나'); // 삭제된자리에 추가
console.log(number);

 

• concat

//concat: 두개 이상의 배열 연결
const number2 = ['영','일','이','삼'];
const newnumber = number.concat(number2); //['zero', 'one', 'two', 'three', '영', '일', '이', '삼']
console.log(newnumber);

5. indexOf 와 includes

 

• indexOf : 몇번째 인덱스에 있는지 알고 싶을때 쓰임

console.log(number.indexOf('two')); // 2
console.log(number.indexOf('ten')); // 없는 값일때는 -1

 

• lastIndexOf : 동일한 값일 경우 마지막에 있는 인덱스를 보여줌

number.push('zero'); // 인덱스 0번에 있는 값을 또다시 배열끝에 추가한다면?
console.log(number.indexOf('zero')); // 0
console.log(number.lastIndexOf('zero')); // 4

 

• includes: 인덱스에 있는지 없는지 확인하고 싶을때 (true/false)

console.log(number.includes('ten')) // false

 

---

이 글은 유튜브 드림코딩 by 엘리님의 JS 입문강의를 보면서 정리한것 입니다.