[javascript] 자바스크립트 배열 생성 (array)

참고: https://www.freecodecamp.org/news/how-to-create-an-array-in-javascript/

배열은 정렬된 요소의 목록을 저장하는 데이터 구조입니다. 이 포스트에서는 JavaScript를 사용하여 배열을 생성하는 세 가지 방법을 알아보겠습니다. 또한 split() 메소드를 사용하여 문자열에서 배열을 만드는 방법도 알아보겠습니다.

할당 연산자를 사용하여 자바스크립트 배열을 만드는 방법

자바스크립트로 배열을 만드는 가장 일반적인 방법은 다음과 같이 해당 배열을 변수에 할당하는 것 입니다:

const books = ["The Great Gatsby", "War and Peace", "Hamlet", "Moby Dick"];

배열을 console.log()로 출력해보면 배열의 요소 4 개가 표시되는 것을 볼 수 있습니다.

const books = ["The Great Gatsby", "War and Peace", "Hamlet", "Moby Dick"];

console.log(books);

new 연산자와 Array 생성자를 사용하여 자바스크립트의 배열을 만드는 방법

배열을 생성하는 다른 방법은 new 키워드와 Array 생성자를 사용하는 것 입니다.

다음은 기본 문법입니다:

new Array();

매개변수로 숫자를 전달하면 새로운 배열의 길이가 결정됩니다.

다음의 예제에서는 빈 슬롯으로 길이가 3인 배열을 생성합니다:

new Array(3)

새로 생성된 배열에서 length 속성을 사용하면 숫자 3을 리턴할 것 입니다:

new Array(3).length

하지만 배열의 요소에 접근하면 현재 모든 슬롯이 비어있기 때문에 undefined가 반환됩니다.

new Array(3)[0]

위의 예제를 수정해 여러 매개변수를 전달하면 food 배열을 생성할 수 있습니다:

const myFavoriteFoods = new Array("pizza", "ice cream", "salad");

console.log(myFavoriteFoods);
console.log(myFavoriteFoods.length);
console.log(myFavoriteFoods[1]);

Array.of()를 사용하여 자바스크립트 배열을 만드는 방법

자바스크립트로 배열을 만드는 또 다른 방법은 Array.of() 메소드를 사용하는 것 입니다. 이 메소드는 여려 매개변수를 받아 새 배열 인스턴스를 만듭니다.

다음은 기본 문법입니다:

Array.of();

위의 food 예제를 수정하여 다음과 같이 Array.of() 메소드를 사용하는 예제를 만들 수 있습니다:

const myFavoriteFoods = Array.of("pizza", "ice cream", "salad");

console.log(myFavoriteFoods);
console.log(myFavoriteFoods.length);
console.log(myFavoriteFoods[1]);

이 방법은 Array 생성자를 사용하는 것과 매우 비슷합니다. 하지만 주요 차이점은 Array.of()에 숫자를 전달하면 그 숫자를 포함하는 배열을 리턴한다는 것 입니다. 이에 반해 Array 생성자는 해당 숫자가 의미하는 x 개의 빈 슬롯을 만듭니다.

다음의 예제에서는 숫자 4가 포함된 배열을 리턴합니다:

const myArr = Array.of(4);

console.log(myArr);

여기서 Array 생성자를 사용하도록 이 예제를 변경하면 4 개의 빈 슬롯 배열을 리턴합니다.

const myArr = new Array(4);

console.log(myArr);

split() 메소드를 사용하여 문자열에서 배열을 만드는 방법

다음은 자바스크립트의 split() 메소드 문법입니다:

str.split(optional-separator, optional-limit);

optional-separator는 문자열을 분할할 위치를 지정하는 패턴입니다. optional-limit는 리턴할 배열에 몇 개 까지의 요소를 허용할지를 지정합니다.

다음의 예제에는 "I live sisiblog"라는 문자열이 있습니다. separator 없이 split() 메소드를 사용하는 경우 리턴 값은 전체 문자열의 배열이됩니다.

const str = 'I love sisiblog';

console.log(str.split());

문자열을 개별 문자로 분할되도록 하려면 separator를 추가해야합니다. 여기에 사용할 separator는 빈 문자열입니다.

const str = "I love sisiblog";

console.log(str.split(""));

리턴 값에서 공백이 문자로서 어떻게 처리되는지 확인할 수 있습니다.

문자열을 개별 단어로 분할하도록 변경하고 싶으면 separator를 공백이 있는 빈 문자열로 하면 됩니다.

const str = "I love sisiblog";

console.log(str.split(" "));

정리

이 포스트에서는 할당 연산자, Array 생성자, Array.of() 메소드를 사용하여 배열을 만드는 방법을 알아봤습니다.

자바스크립트에서 배열을 만드는 가장 일반적인 방법은 다음과 같이 해당 배열을 변수에 할당하는 것 입니다:

const books = ["The Great Gatsby", "War and Peace", "Hamlet", "Moby Dick"];

배열을 생성하는 다른 방법은 new 키워드와 Array 생성자를 사용하는 것 입니다:

new Array();

여기에 숫자 매개변수를 전달하면 new Array가 리턴하는 배열의 슬롯 갯수를 비어있는 상태로 지정할 수 있습니다. 또한 여러개의 값을 전달할 수도 있습니다.

new Array("pizza", "ice cream", "salad");

배열을 생성하는 또다른 방법은 Array.of() 메소드를 사용하는 것 입니다. 이 메소드는 매개변수로 숫자나 값들을 받아 이를 포함하는 새로운 배열을 리턴합니다.

Array.of();

또한 split() 메소드를 사용하여 문자열에서 배열을 만들 수 있습니다.

str.split(optional-separator, optional-limit);

관련 글

자바스크립트 console.log 사용 방법 (로그 찍기)

자바스크립트 문자열 배열로 자르기 (split)