λ³Έλ¬Έ λ°”λ‘œκ°€κΈ°
Language/Javascript

[Javascript]μžλ°”μŠ€ν¬λ¦½νŠΈ λ°°μ—΄ μ™„λ²½ κ°€μ΄λ“œ: λ°°μ—΄ λ©”μ†Œλ“œμ™€ ν™œμš©λ²• 총정리

by YJ Dev 2024. 6. 21.
728x90
λ°˜μ‘ν˜•
SMALL

μžλ°”μŠ€ν¬λ¦½νŠΈμ˜ λ°°μ—΄ ν•¨μˆ˜λŠ” 데이터 처리λ₯Ό 효율적으둜 ν•  수 있게 λ„μ™€μ£ΌλŠ” μ€‘μš”ν•œ λ„κ΅¬μž…λ‹ˆλ‹€. 이번 ν¬μŠ€νŒ…μ—μ„œλŠ” 자주 μ‚¬μš©λ˜λŠ” μžλ°”μŠ€ν¬λ¦½νŠΈ λ°°μ—΄ ν•¨μˆ˜λ“€μ„ μ •λ¦¬ν•˜κ³ , 각각의 ν•¨μˆ˜κ°€ μ–΄λ–€ μƒν™©μ—μ„œ μœ μš©ν•œμ§€μ— λŒ€ν•΄ μ‚΄νŽ΄λ³΄κ² μŠ΅λ‹ˆλ‹€.

μžλ°”μŠ€ν¬λ¦½νŠΈ λ°°μ—΄


μžλ°”μŠ€ν¬λ¦½νŠΈ 배열은 μ°Έμ‘° μžλ£Œν˜•μž…λ‹ˆλ‹€. κΈ°λ³Έ μžλ£Œν˜•(primitive types)κ³Ό μ°Έμ‘° μžλ£Œν˜•(reference types)은 μžλ°”μŠ€ν¬λ¦½νŠΈμ—μ„œ 데이터λ₯Ό λ‹€λ£¨λŠ” 방식에 따라 κ΅¬λΆ„λ©λ‹ˆλ‹€. μžλ°”μŠ€ν¬λ¦½νŠΈ μžλ£Œν˜•μ— λŒ€ν•œ λ‚΄μš©μ€ μ•„λž˜ ν¬μŠ€νŒ…μ„ μ°Έκ³ ν•΄ μ£Όμ„Έμš”πŸ˜

""

[μžλ°”μŠ€ν¬λ¦½νŠΈ]초보자λ₯Ό μœ„ν•œ μžλ°”μŠ€ν¬λ¦½νŠΈ μžλ£Œν˜• κ°€μ΄λ“œ

μžλ°”μŠ€ν¬λ¦½νŠΈ μžλ£Œν˜•μ„ μ΄ν•΄ν•˜λŠ” 것은 μžλ°”μŠ€ν¬λ¦½νŠΈ ν”„λ‘œκ·Έλž˜λ°μ˜ 기초이자 ν•„μˆ˜μž…λ‹ˆλ‹€. 이 κΈ€μ—μ„œλŠ” μžλ°”μŠ€ν¬λ¦½νŠΈμ˜ λ‹€μ–‘ν•œ μžλ£Œν˜•μ„ κΈ°μ΄ˆλΆ€ν„° μ‹¬ν™”κΉŒμ§€ μžμ„Ένžˆ λ‹€λ£Ήλ‹ˆλ‹€.≣ λͺ©μ°¨μžλ£Œν˜•μ˜

creativevista.tistory.com


01. JavaScript λ°°μ—΄μ΄λž€?πŸ€”

λ°°μ—΄μ˜ μ •μ˜μ™€ κΈ°λ³Έ κ°œλ…

JavaScriptμ—μ„œ 배열은 같은 νƒ€μž… λ˜λŠ” λ‹€λ₯Έ νƒ€μž…μ˜ μ—¬λŸ¬ 데이터λ₯Ό ν•œ 곳에 λͺ¨μ•„λ‘” κ΅¬μ‘°μž…λ‹ˆλ‹€. 배열은 일련의 데이터λ₯Ό μˆœμ„œλŒ€λ‘œ λ‚˜μ—΄ν•˜κ³ , 인덱슀λ₯Ό 톡해 각 μš”μ†Œμ— μ ‘κ·Όν•  수 있게 ν•΄ μ€λ‹ˆλ‹€. 배열은 λ‹€λ₯Έ ν”„λ‘œκ·Έλž˜λ° μ–Έμ–΄μ—μ„œλ„ ν”νžˆ μ‚¬μš©λ˜λŠ” 데이터 ꡬ쑰둜, JavaScriptμ—μ„œλŠ” 특히 많이 ν™œμš©λ©λ‹ˆλ‹€.

배열을 μ‚¬μš©ν•˜λŠ” 이유

배열을 μ‚¬μš©ν•˜λ©΄ μ—¬λŸ¬ 개의 λ³€μˆ˜λ₯Ό μ‚¬μš©ν•˜μ§€ μ•Šκ³ λ„ 데이터λ₯Ό κ΄€λ¦¬ν•˜κ³  μ‘°μž‘ν•  수 μžˆμŠ΅λ‹ˆλ‹€. 배열은 데이터λ₯Ό 효율적으둜 μ €μž₯ν•˜κ³  μ ‘κ·Όν•  수 있게 ν•΄μ£Όλ©°, λ‹€μ–‘ν•œ λ©”μ„œλ“œλ₯Ό 톡해 데이터λ₯Ό μ‰½κ²Œ μ‘°μž‘ν•  수 μžˆμŠ΅λ‹ˆλ‹€.

JavaScript λ°°μ—΄μ˜ νŠΉμ§•

  • 동적 크기: JavaScript 배열은 크기가 κ³ μ •λ˜μ–΄ μžˆμ§€ μ•Šκ³ , ν•„μš”μ— 따라 λ™μ μœΌλ‘œ 크기가 λ³€ν•©λ‹ˆλ‹€.
  • λ‹€μ–‘ν•œ νƒ€μž… ν—ˆμš©: JavaScript 배열은 숫자, λ¬Έμžμ—΄, 객체 λ“± λ‹€μ–‘ν•œ νƒ€μž…μ˜ μš”μ†Œλ₯Ό ν•¨κ»˜ μ €μž₯ν•  수 μžˆμŠ΅λ‹ˆλ‹€.
  • λ°°μ—΄ λ©”μ†Œλ“œ: 배열은 λ‹€μ–‘ν•œ λ‚΄μž₯ λ©”μ„œλ“œλ₯Ό μ œκ³΅ν•˜μ—¬ 데이터λ₯Ό μ‰½κ²Œ μ‘°μž‘ν•  수 μžˆμŠ΅λ‹ˆλ‹€.

02. λ°°μ—΄ 생성 λ°©λ²•πŸŽ¨

λ°°μ—΄ λ¦¬ν„°λŸ΄μ„ μ‚¬μš©ν•œ 생성

κ°€μž₯ κ°„λ‹¨ν•œ λ°°μ—΄ 생성 방법은 λ°°μ—΄ λ¦¬ν„°λŸ΄μ„ μ‚¬μš©ν•˜λŠ” κ²ƒμž…λ‹ˆλ‹€. λŒ€κ΄„ν˜Έ []λ₯Ό μ‚¬μš©ν•˜μ—¬ 배열을 μƒμ„±ν•˜κ³ , 각 μš”μ†ŒλŠ” μ‰Όν‘œλ‘œ κ΅¬λΆ„ν•©λ‹ˆλ‹€.

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

Array 객체λ₯Ό μ‚¬μš©ν•œ 생성

Array 객체λ₯Ό μ‚¬μš©ν•˜μ—¬ 배열을 생성할 μˆ˜λ„ μžˆμŠ΅λ‹ˆλ‹€. 이 방법은 λ°°μ—΄μ˜ 초기 크기λ₯Ό μ„€μ •ν•  수 μžˆμŠ΅λ‹ˆλ‹€.

let numbers = new Array(3); // 길이가 3인 빈 λ°°μ—΄ 생성
let moreFruits = new Array('Mango', 'Peach', 'Pineapple');

Array.of()와 Array.from() λ©”μ„œλ“œ

  • Array.of() λ©”μ†Œλ“œλŠ” μ „λ‹¬λœ 인수λ₯Ό μš”μ†Œλ‘œ κ°–λŠ” 배열을 μƒμ„±ν•©λ‹ˆλ‹€.
let arrayOfNumbers = Array.of(1, 2, 3);
  • Array.from() λ©”μ†Œλ“œλŠ” μœ μ‚¬ λ°°μ—΄ κ°μ²΄λ‚˜ 반볡 κ°€λŠ₯ν•œ 객체λ₯Ό λ°°μ—΄λ‘œ λ³€ν™˜ν•©λ‹ˆλ‹€.
let arrayFromString = Array.from('hello'); // ['h', 'e', 'l', 'l', 'o']

03. λ°°μ—΄ μš”μ†Œ μ ‘κ·Ό 및 μ‘°μž‘πŸ› οΈ

λ°°μ—΄ μš”μ†Œ μ ‘κ·Ό 방법 (인덱슀 μ‚¬μš©)

λ°°μ—΄μ˜ 각 μš”μ†ŒλŠ” 0λΆ€ν„° μ‹œμž‘ν•˜λŠ” 인덱슀둜 μ ‘κ·Όν•  수 μžˆμŠ΅λ‹ˆλ‹€.

let fruits = ['Apple', 'Banana', 'Cherry'];
console.log(fruits[0]); // 'Apple'
console.log(fruits[1]); // 'Banana'

λ°°μ—΄ μš”μ†Œ μΆ”κ°€ 및 μ‚­μ œ

push(): λ§ˆμ§€λ§‰ μš”μ†Œ μΆ”κ°€

  • push(): ν•¨μˆ˜λŠ” λ°°μ—΄μ˜ λ§ˆμ§€λ§‰μ— μƒˆλ‘œμš΄ μš”μ†Œλ₯Ό μΆ”κ°€ν•©λ‹ˆλ‹€. 데이터λ₯Ό 순차적으둜 μΆ”κ°€ν•  λ•Œ μœ μš©ν•©λ‹ˆλ‹€.
let fruits = ['Apple', 'Banana', 'Cherry'];
fruits.push('Mango'); // ['Apple', 'Banana', 'Cherry', 'Mango']

pop(): λ§ˆμ§€λ§‰ μš”μ†Œ μ‚­μ œ

  • pop(): ν•¨μˆ˜λŠ” λ°°μ—΄μ˜ λ§ˆμ§€λ§‰ μš”μ†Œλ₯Ό μ œκ±°ν•©λ‹ˆλ‹€. μ΅œκ·Όμ— μΆ”κ°€λœ 데이터λ₯Ό μ‚­μ œν•  λ•Œ μœ μš©ν•©λ‹ˆλ‹€.
let fruits = ['Apple', 'Banana', 'Cherry'];
fruits.pop(); // ['Apple', 'Banana']

unshift(): 첫 번째 μš”μ†Œ μΆ”κ°€

  • unshift(): ν•¨μˆ˜λŠ” λ°°μ—΄μ˜ 첫 λ²ˆμ§Έμ— μƒˆλ‘œμš΄ μš”μ†Œλ₯Ό μΆ”κ°€ν•©λ‹ˆλ‹€. μƒˆλ‘œμš΄ 데이터λ₯Ό μ΅œμš°μ„ μœΌλ‘œ μΆ”κ°€ν•  λ•Œ μœ μš©ν•©λ‹ˆλ‹€.
let fruits = ['Apple', 'Banana', 'Cherry'];
fruits.unshift('Strawberry'); // ['Strawberry', 'Apple', 'Banana', 'Cherry']

shift(): 첫 번째 μš”μ†Œ μ‚­μ œ

  • shift(): ν•¨μˆ˜λŠ” λ°°μ—΄μ˜ 첫 번째 μš”μ†Œλ₯Ό μ œκ±°ν•©λ‹ˆλ‹€. κ°€μž₯ 였래된 데이터λ₯Ό μ œκ±°ν•  λ•Œ μœ μš©ν•©λ‹ˆλ‹€.
let fruits = ['Apple', 'Banana', 'Cherry'];
fruits.shift(); // ['Banana', 'Cherry']

λ°°μ—΄ μš”μ†Œ μˆ˜μ •

λ°°μ—΄μ˜ μš”μ†Œλ₯Ό μˆ˜μ •ν•˜λ €λ©΄ ν•΄λ‹Ή 인덱슀λ₯Ό μ‚¬μš©ν•©λ‹ˆλ‹€.

let fruits = ['Apple', 'Banana', 'Cherry'];
fruits[1] = 'Blueberry'; // ['Apple', 'Blueberry', 'Cherry']

λ°°μ—΄ 볡사 및 ν™•μž₯ (...)

Spread Operator(...)λ₯Ό μ‚¬μš©ν•˜μ—¬ 배열을 μ‰½κ²Œ λ³΅μ‚¬ν•˜κ³  ν™•μž₯ν•  수 μžˆμŠ΅λ‹ˆλ‹€. κΈ°μ‘΄ 배열을 λ³€κ²½ν•˜μ§€ μ•Šκ³  μƒˆλ‘œμš΄ 배열을 λ§Œλ“€ λ•Œ μœ μš©ν•©λ‹ˆλ‹€.

let fruits = ['사과', 'λ°”λ‚˜λ‚˜', '체리'];
let copiedFruits = [...fruits];
console.log(copiedFruits); // ['사과', 'λ°”λ‚˜λ‚˜', '체리']

04. 자주 μ‚¬μš©ν•˜λŠ” λ°°μ—΄ λ©”μ„œλ“œπŸ“š

forEach(): λ°°μ—΄ 순회

forEach() λ©”μ†Œλ“œλŠ” λ°°μ—΄μ˜ 각 μš”μ†Œμ— λŒ€ν•΄ 주어진 ν•¨μˆ˜λ₯Ό μ‹€ν–‰ν•©λ‹ˆλ‹€.

let fruits = ['Apple', 'Banana', 'Cherry'];
fruits.forEach(function(fruit) {
  console.log(fruit);
});

map(): λ°°μ—΄ μš”μ†Œ λ³€ν™˜

map() λ©”μ†Œλ“œλŠ” λ°°μ—΄μ˜ 각 μš”μ†Œμ— λŒ€ν•΄ 주어진 ν•¨μˆ˜λ₯Ό μ‹€ν–‰ν•˜κ³ , κ·Έ κ²°κ³Όλ₯Ό λͺ¨μ•„ μƒˆλ‘œμš΄ 배열을 λ°˜ν™˜ν•©λ‹ˆλ‹€.

let fruits = ["체리", "사과", "λ°”λ‚˜λ‚˜"];
let mappedFruits = fruits.map(fruit => `fruit: ${fruit}`);
console.log(mappedFruits); // ["fruit: 체리", "fruit: 사과", "fruit: λ°”λ‚˜λ‚˜"]

filter(): 쑰건에 λ§žλŠ” μš”μ†Œ 필터링

filter() λ©”μ†Œλ“œλŠ” λ°°μ—΄μ˜ 각 μš”μ†Œμ— λŒ€ν•΄ 주어진 쑰건을 λ§Œμ‘±ν•˜λŠ” μš”μ†Œλ§Œ λͺ¨μ•„ μƒˆλ‘œμš΄ 배열을 λ°˜ν™˜ν•©λ‹ˆλ‹€.

let words = ["apple", "banana", "cherry", "date", "fig", "grape"];
let longWords = words.filter(word => word.length >= 5);
console.log(longWords); // ["apple", "banana", "cherry", "grape"]

reduce(): λ°°μ—΄ κ°’ λˆ„μ 

reduce() λ©”μ†Œλ“œλŠ” λ°°μ—΄μ˜ 각 μš”μ†Œμ— λŒ€ν•΄ 주어진 ν•¨μˆ˜λ₯Ό μ‹€ν–‰ν•˜κ³ , κ·Έ κ²°κ³Όλ₯Ό ν•˜λ‚˜μ˜ κ°’μœΌλ‘œ λˆ„μ ν•©λ‹ˆλ‹€.

let numbers = [1, 2, 3, 4, 5];
let sum = numbers.reduce((acc, curr) => acc + curr, 0);
console.log(sum); // 15

find()와 findIndex(): 쑰건에 λ§žλŠ” μš”μ†Œ μ°ΎκΈ°

  • find() λ©”μ†Œλ“œλŠ” 쑰건을 λ§Œμ‘±ν•˜λŠ” 첫 번째 μš”μ†Œλ₯Ό λ°˜ν™˜ν•©λ‹ˆλ‹€.
let fruits = ['Apple', 'Banana', 'Cherry'];
let cherry = fruits.find(function(fruit) {
  return fruit === 'Cherry';
}); // 'Cherry'
  • findIndex() λ©”μ†Œλ“œλŠ” 쑰건을 λ§Œμ‘±ν•˜λŠ” 첫 번째 μš”μ†Œμ˜ 인덱슀λ₯Ό λ°˜ν™˜ν•©λ‹ˆλ‹€.
let fruits = ['Apple', 'Banana', 'Cherry'];
let cherryIndex = fruits.findIndex(function(fruit) {
  return fruit === 'Cherry';
}); // 2

05. κ³ κΈ‰ λ°°μ—΄ λ©”μ„œλ“œμ™€ ν™œμš©λ²•πŸš€

some()κ³Ό every(): 쑰건 검사

  • some() λ©”μ†Œλ“œλŠ” λ°°μ—΄μ˜ 일뢀 μš”μ†Œκ°€ 쑰건을 λ§Œμ‘±ν•˜λŠ”μ§€ κ²€μ‚¬ν•©λ‹ˆλ‹€.
let fruits = ['Apple', 'Banana', 'Cherry'];
let hasShortFruit = fruits.some(function(fruit) {
  return fruit.length < 5;
}); // false
  • every() λ©”μ†Œλ“œλŠ” λ°°μ—΄μ˜ λͺ¨λ“  μš”μ†Œκ°€ 쑰건을 λ§Œμ‘±ν•˜λŠ”μ§€ κ²€μ‚¬ν•©λ‹ˆλ‹€.
let fruits = ['Apple', 'Banana', 'Cherry'];
let allLongFruits = fruits.every(function(fruit) {
  return fruit.length > 5;
}); // false

sort(): λ°°μ—΄ μ •λ ¬

  • sort() λ©”μ†Œλ“œλŠ” 배열을 μ •λ ¬ν•©λ‹ˆλ‹€. 기본적으둜 μ‚¬μ „μˆœμœΌλ‘œ μ •λ ¬λ˜λ©°, μ›ν•˜λŠ” μ •λ ¬ μˆœμ„œλ₯Ό 비ꡐ ν•¨μˆ˜λ₯Ό 톡해 지정할 수 μžˆμŠ΅λ‹ˆλ‹€.
let fruits = ['Apple', 'Banana', 'Cherry'];
fruits.sort(); // ['Apple', 'Banana', 'Cherry']
    • μ‚¬μš©μž μ •μ˜ μ •λ ¬ 비ꡐ ν•¨μˆ˜ 예제

μ‚¬μš©μž μ •μ˜ μ •λ ¬ 비ꡐ ν•¨μˆ˜λŠ” JavaScript의 sort() λ©”μ„œλ“œμ—μ„œ μ‚¬μš©λ˜μ–΄ λ°°μ—΄ μš”μ†Œλ₯Ό μ›ν•˜λŠ” λ°©μ‹μœΌλ‘œ μ •λ ¬ν•˜λŠ” 데 μ€‘μš”ν•œ 역할을 ν•©λ‹ˆλ‹€. 이 ν•¨μˆ˜λŠ” 두 개의 인자(a와 b)λ₯Ό λ°›μ•„μ„œ λ‹€μŒ μ„Έ 가지 경우 쀑 ν•˜λ‚˜μ— 따라 λ™μž‘ν•΄μ•Ό ν•©λ‹ˆλ‹€.

  1. 음수 λ°˜ν™˜: aλ₯Ό b보닀 μ•žμ— μœ„μΉ˜μ‹œν‚€κ³  싢을 λ•Œ.
  2. μ–‘μˆ˜ λ°˜ν™˜: aλ₯Ό b보닀 뒀에 μœ„μΉ˜μ‹œν‚€κ³  싢을 λ•Œ.
  3. λ°˜ν™˜: a와 b의 μˆœμ„œλ₯Ό λ³€ν™”μ‹œν‚€μ§€ μ•Šκ³  κ·ΈλŒ€λ‘œ 두고 싢을 λ•Œ.

μ΄λŸ¬ν•œ 비ꡐ ν•¨μˆ˜λ₯Ό μ •μ˜ν•˜λ©΄ sort() λ©”μ†Œλ“œκ°€ 이 ν•¨μˆ˜λ₯Ό μ‚¬μš©ν•˜μ—¬ 배열을 μ •λ ¬ν•˜κ²Œ λ©λ‹ˆλ‹€.

예제: 숫자 λ°°μ—΄μ˜ μ˜€λ¦„μ°¨μˆœ μ •λ ¬

let numbers = [3, 1, 4, 1, 5, 9, 2, 6, 5, 3, 5];

numbers.sort(function(a, b) {
  if (a < b) {
    return -1; // aλ₯Ό b보닀 μ•žμ— μœ„μΉ˜μ‹œν‚΄
  }
  if (a > b) {
    return 1; // aλ₯Ό b보닀 뒀에 μœ„μΉ˜μ‹œν‚΄
  }
  return 0; // μˆœμ„œλ₯Ό λ³€ν™”μ‹œν‚€μ§€ μ•ŠμŒ
});

console.log(numbers); // [1, 1, 2, 3, 3, 4, 5, 5, 5, 6, 9]

μœ„μ˜ μ½”λ“œμ—μ„œ sort() λ©”μ†Œλ“œλŠ” 비ꡐ ν•¨μˆ˜λ₯Ό 톡해 numbers 배열을 μ˜€λ¦„μ°¨μˆœμœΌλ‘œ μ •λ ¬ν•©λ‹ˆλ‹€. aκ°€ b보닀 μž‘μ„ λ•ŒλŠ” -1을 λ°˜ν™˜ν•˜μ—¬ aλ₯Ό b보닀 μ•žμ— μœ„μΉ˜μ‹œν‚€κ³ , aκ°€ b보닀 클 λ•ŒλŠ” 1을 λ°˜ν™˜ν•˜μ—¬ aλ₯Ό b보닀 뒀에 μœ„μΉ˜μ‹œν‚΅λ‹ˆλ‹€. 같을 κ²½μš°μ—λŠ” 0을 λ°˜ν™˜ν•˜μ—¬ μˆœμ„œλ₯Ό λ³€ν™”μ‹œν‚€μ§€ μ•ŠμŠ΅λ‹ˆλ‹€.

예제: 숫자 λ°°μ—΄μ˜ λ‚΄λ¦Όμ°¨μˆœ μ •λ ¬

numbers.sort(function(a, b) {
  if (a > b) {
    return -1; // aλ₯Ό b보닀 μ•žμ— μœ„μΉ˜μ‹œν‚΄ (λ‚΄λ¦Όμ°¨μˆœ)
  }
  if (a < b) {
    return 1; // aλ₯Ό b보닀 뒀에 μœ„μΉ˜μ‹œν‚΄ (λ‚΄λ¦Όμ°¨μˆœ)
  }
  return 0; // μˆœμ„œλ₯Ό λ³€ν™”μ‹œν‚€μ§€ μ•ŠμŒ
});

console.log(numbers); // [9, 6, 5, 5, 5, 4, 3, 3, 2, 1, 1]

μœ„μ˜ μ½”λ“œμ—μ„œλŠ” 같은 배열을 λ‚΄λ¦Όμ°¨μˆœμœΌλ‘œ μ •λ ¬ν•˜λ„λ‘ 비ꡐ ν•¨μˆ˜λ₯Ό μˆ˜μ •ν–ˆμŠ΅λ‹ˆλ‹€. aκ°€ b보닀 클 λ•Œ -1을 λ°˜ν™˜ν•˜μ—¬ aλ₯Ό b보닀 μ•žμ— μœ„μΉ˜μ‹œν‚€κ³ , aκ°€ b보닀 μž‘μ„ λ•Œ 1을 λ°˜ν™˜ν•˜μ—¬ aλ₯Ό b보닀 뒀에 μœ„μΉ˜μ‹œν‚΅λ‹ˆλ‹€. λ§ˆμ°¬κ°€μ§€λ‘œ 같을 κ²½μš°μ—λŠ” 0을 λ°˜ν™˜ν•˜μ—¬ μˆœμ„œλ₯Ό λ³€ν™”μ‹œν‚€μ§€ μ•ŠμŠ΅λ‹ˆλ‹€.


reverse(): λ°°μ—΄ μ •λ ¬

  • reverse() λ©”μ†Œλ“œλŠ” λ°°μ—΄μ˜ μš”μ†Œ μˆœμ„œλ₯Ό λ°˜λŒ€λ‘œ λ’€μ§‘μŠ΅λ‹ˆλ‹€.
let fruits = ['Apple', 'Banana', 'Cherry'];
fruits.reverse(); // ['Cherry', 'Banana', 'Apple']

concat(): λ°°μ—΄ ν•©μΉ˜κΈ°

  • concat() λ©”μ†Œλ“œλŠ” 두 개 μ΄μƒμ˜ 배열을 합쳐 μƒˆλ‘œμš΄ 배열을 λ§Œλ“­λ‹ˆλ‹€.
let fruits = ['Apple', 'Banana'];
let moreFruits = ['Cherry', 'Mango'];
let allFruits = fruits.concat(moreFruits); // ['Apple', 'Banana', 'Cherry', 'Mango']

slice()와 splice(): λ°°μ—΄ λΆ€λΆ„ μΆ”μΆœ 및 λ³€κ²½

  • slice() λ©”μ†Œλ“œλŠ” λ°°μ—΄μ˜ 일뢀λ₯Ό μΆ”μΆœν•˜μ—¬ μƒˆλ‘œμš΄ 배열을 λ§Œλ“­λ‹ˆλ‹€.
let fruits = ['Apple', 'Banana', 'Cherry', 'Mango'];
let someFruits = fruits.slice(1, 3); // ['Banana', 'Cherry']
  • splice() λ©”μ†Œλ“œλŠ” λ°°μ—΄μ˜ 일뢀λ₯Ό μ‚­μ œν•˜κ±°λ‚˜ κ΅μ²΄ν•©λ‹ˆλ‹€.
let fruits = ['Apple', 'Banana', 'Cherry'];
fruits.splice(1, 1, 'Blueberry'); // ['Apple', 'Blueberry', 'Cherry']

06. λ°°μ—΄κ³Ό κ΄€λ ¨λœ μœ μš©ν•œ νŒπŸ“

닀차원 λ°°μ—΄ 닀루기

JavaScriptμ—μ„œλŠ” λ°°μ—΄ μ•ˆμ— 배열을 ν¬ν•¨μ‹œμΌœ 닀차원 배열을 λ§Œλ“€ 수 μžˆμŠ΅λ‹ˆλ‹€.

let matrix = [
  [1, 2, 3],
  [4, 5, 6],
  [7, 8, 9]
];
console.log(matrix[1][2]); // 6

배열을 λ¬Έμžμ—΄λ‘œ λ³€ν™˜ (join, toString)

  • join() λ©”μ†Œλ“œλŠ” λ°°μ—΄μ˜ λͺ¨λ“  μš”μ†Œλ₯Ό λ¬Έμžμ—΄λ‘œ κ²°ν•©ν•©λ‹ˆλ‹€.
let fruits = ['Apple', 'Banana', 'Cherry'];
let fruitString = fruits.join(', '); // 'Apple, Banana, Cherry'
  • toString() λ©”μ†Œλ“œλŠ” 배열을 λ¬Έμžμ—΄λ‘œ λ³€ν™˜ν•©λ‹ˆλ‹€.
let fruits = ['Apple', 'Banana', 'Cherry'];
let arrayString = fruits.toString(); // 'Apple,Banana,Cherry'

μ„±λŠ₯ μ΅œμ ν™”λ₯Ό μœ„ν•œ 팁

  • λ°°μ—΄ 크기λ₯Ό μ˜ˆμΈ‘ν•  수 μžˆλ‹€λ©΄ 초기 크기λ₯Ό μ„€μ •ν•˜μ—¬ μ„±λŠ₯을 μ΅œμ ν™”ν•  수 μžˆμŠ΅λ‹ˆλ‹€.
  • for 루프λ₯Ό μ‚¬μš©ν•  λ•ŒλŠ” length ν”„λ‘œνΌν‹°λ₯Ό 미리 μ €μž₯ν•΄ 두면 μ„±λŠ₯이 ν–₯μƒλ©λ‹ˆλ‹€.

예λ₯Ό λ“€μ–΄, JavaScriptμ—μ„œ 배열을 μˆœνšŒν•  λ•Œ for 루프λ₯Ό μ‚¬μš©ν•˜λŠ” 경우, length ν”„λ‘œνΌν‹°λ₯Ό 미리 μ €μž₯ν•΄ 두면 λ°˜λ³΅ν•  λ•Œ μ„±λŠ₯이 ν–₯상될 수 μžˆμŠ΅λ‹ˆλ‹€. μ΄λŠ” 맀 λ°˜λ³΅λ§ˆλ‹€ λ°°μ—΄μ˜ 길이λ₯Ό λ‹€μ‹œ κ³„μ‚°ν•˜λŠ” λΉ„μš©μ„ 쀄이기 λ•Œλ¬Έμž…λ‹ˆλ‹€.

λ‹€μŒμ€ for 루프λ₯Ό μ‚¬μš©ν•˜μ—¬ 배열을 μˆœνšŒν•  λ•Œ length ν”„λ‘œνΌν‹°λ₯Ό 미리 μ €μž₯ν•˜λŠ” μ˜ˆμ œμž…λ‹ˆλ‹€.

let fruits = ['사과', 'λ°”λ‚˜λ‚˜', '체리'];

// λ°°μ—΄μ˜ 길이λ₯Ό 미리 μ €μž₯
let len = fruits.length;

// 일반적인 for 루프 μ‚¬μš©
for (let i = 0; i < len; i++) {
  console.log(fruits[i]);
}

이 μ˜ˆμ œμ—μ„œλŠ” fruits.lengthλ₯Ό len λ³€μˆ˜μ— μ €μž₯ν•œ ν›„ for λ£¨ν”„μ—μ„œ 이 λ³€μˆ˜λ₯Ό μ‚¬μš©ν•˜μ—¬ 배열을 μˆœνšŒν•©λ‹ˆλ‹€. μ΄λ ‡κ²Œ ν•˜λ©΄ 맀 λ°˜λ³΅λ§ˆλ‹€ λ°°μ—΄μ˜ 길이λ₯Ό κ³„μ‚°ν•˜λŠ” λΉ„μš©μ„ ν”Όν•  수 μžˆμ–΄μ„œ μ„±λŠ₯이 κ°œμ„ λ  수 μžˆμŠ΅λ‹ˆλ‹€.


07. 핡심 λ‚΄μš©πŸ‘€

μžλ°”μŠ€ν¬λ¦½νŠΈ λ°°μ—΄
μžλ°”μŠ€ν¬λ¦½νŠΈ λ°°μ—΄
μžλ°”μŠ€ν¬λ¦½νŠΈ λ°°μ—΄

728x90
λ°˜μ‘ν˜•