# 자바스크립트 배열(array)

### 자료구조

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

### object 와 자료구조의 차이점

![](https://phinf.pstatic.net/memo/20200831_11/1598854754332Q7HfS_PNG/2.png?type=w740)

### 배열

* index는 0 부터 시작됨
* 삽입, 삭제가 편리함

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

###

### Index position

```javascript
// 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

```javascript
// 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(추가, 빼기, 복사 방법)

```javascript

// 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
```


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://leeboa.gitbook.io/study/_/array.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.