어레이 | 초보자 | Js의 신비한 주제 | #2

안녕하세요 여러분 👋
모두 잘 지내고 계시길 바랍니다.
이 게시물에서는 JavaScript 배열과 작동 방식에 대해 알아봅니다.

그래서 Arrays 전에는 변수에 데이터를 저장하는 용도로 사용했고, 대규모로 작업하지 않을 때는 좋았습니다. 하지만 30명의 학생이 있는 학급이 있고 30명의 학생 이름을 저장해야 하므로 30개의 서로 다른 변수를 생성하고 유지해야 하는 상황을 생각해 보십시오. 이는 매우 비효율적입니다. 배열을 사용하십시오.

배열

JavaScript에서 배열은 서로 다른 데이터 유형의 여러 값을 저장할 수 있는 컨테이너입니다. 배열은 해당 배열의 요소로 알려진 정렬된 값 목록을 보유합니다. Array의 각 요소에는 나중에 액세스할 수 있는 특정 인덱스가 있습니다.

JavaScript 배열 만들기

배열을 만드는 방법에는 두 가지가 있습니다.

배열 생성자 사용

배열 리터럴 표기법 사용

배열 생성자 사용

배열 생성자는 배열을 생성하는 데 사용됩니다.

let fruits = new Array(2);
console.log(fruits.length); // 2
console.log(fruits[0]);     // undefined

Array 생성자에 하나의 양의 정수 값만 전달하면 길이의 배열이 생성되고 각 요소는 정의되지 않은 값을 갖게 됩니다.
실제로 배열을 생성하기 위해 Array() 생성자를 거의 사용하지 않습니다.

배열 리터럴 표기법 사용

배열 리터럴 형식은 대괄호[]를 사용하여 쉼표로 구분된 요소 목록을 묶습니다.

let arrayName = [element1, element2, element3, ...];

배열 선언 및 초기화

빈 배열 선언:

let emptyArray = []; 

어레이 초기화:

let fruits = ['Apple', 'Banana'];

다른 데이터 유형의 값을 추가할 수도 있습니다.

let values = ['hello', 432, true];

값에 접근하기

배열의 요소에 액세스하려면 대괄호 안에 인덱스를 지정합니다[]. 배열의 첫 번째 요소는 index 0 에서 시작하고 두 번째 요소는 index 1 에서 시작하는 식입니다.

let fruits= ['kivi', 'mango', 'banana']; 
console.log(fruits[0]); // 'kivi'

값 업데이트

요소의 값을 업데이트하려면 다음과 같이 해당 값을 요소에 할당합니다.

let fruits= ['kivi', 'mango', 'banana']; 
fruits[1] = 'watermelon';
console.log(fruits[1]); // 'watermelon'

배열 길이

배열의 길이를 얻기 위해 우리는 .length 속성을 사용합니다. 이 속성은 읽기 전용 속성이므로 상호 작용할 수 없습니다.

let fruits= ['kivi', 'mango', 'banana']; 
console.log(fruits.length); // 3

기본 어레이 작업

요소 추가

끝에 요소를 추가하려면 .push() 메서드를 사용합니다. Array에 추가된 요소 목록을 괄호 안에 추가할 수 있습니다.

let fruits= ['kivi', 'mango', 'banana']; 
fruits.push('watermelon');
console.log(fruits); // ['kivi', 'mango', 'banana', 'watermelon']

시작 부분에 요소를 추가하려면 .unshift() 방법을 사용합니다.

let fruits= ['kivi', 'mango', 'banana']; 
fruits.unshift('watermelon');
console.log(fruits); // ['watermelon', 'kivi', 'mango', 'banana']

요소 제거

끝에서 요소를 제거하려면 .pop() 메서드를 사용합니다. 한 번에 하나의 요소만 제거합니다.

let fruits= ['kivi', 'mango', 'banana']; 
fruits.pop();
console.log(fruits); // ['kivi', 'mango']

처음부터 요소를 제거하려면 .shift() 메서드를 사용합니다.

let fruits= ['kivi', 'mango', 'banana']; 
fruits.shift();
console.log(fruits); // ['mango', 'banana']

요소의 색인을 확인합니다.

배열에서 요소의 위치를 ​​가져오려면 .indexOf() 메서드를 사용합니다.

let fruits= ['kivi', 'mango', 'banana']; 
console.log(fruits.indexOf('mango')); // 1

마무리

이 게시물의 전부입니다. 실수를 발견하거나 더 많은 정보를 공유하고 싶다면 댓글에 남겨주세요.
읽어 주셔서 감사합니다!

모아잠 알리
프론트엔드 개발자