배열, 문자열 메소드

문자열 메소드

.split('seperator')

문자열을 구분자를 기준으로 분리해서 배열로 나누어주는 메소드입니다

const str = 'I am so';
arr = str.split(' ') // 공백으로 문자를 나누어 배열로 저장합니다
console.log(arr);
// expected output : Array ['I', 'am', 'so']

배열 메소드

.unshift(elements) / .shift()

⚠️ 원본 배열에 영향을 주는 메소드입니다.

• arr.unshift(element) - arr[0]에 element를 추가하고 수정된 배열의 길이를 반환합니다.

const arr = [1, 2, 3];

console.log(arr);
// expected output: Array [4, 5, 1, 2, 3] -> 원본 배열 수정

console.log(arr.unshift(4,5));
// expected output: 5  -> 수정된 배열의 길이 반환

• arr.shift() - arr[0]의 요소를 제거하고 제거된 요소를 반환 합니다.

const arr = [1, 2, 3];

const shiftElement = arr.shift();

console.log(arr);
// expected output: Array [2, 3] -> 원본 배열 수정

console.log(shiftElement);
// expected output: 1  -> 제거된 요소 반환

.push(elements) / .pop()

⚠️ 원본 배열에 영향을 주는 메소드입니다.
위의 unshift 와 shift 처럼 추가 / 삭제하는 메소드입니다
unshift / shift 는 선입선출
push / pop 는 후입후출 개념이라고 생각하시면 간단하게 이해할 수 있습니다

-push(elements) 배열의 마지막 인덱스에 요소를 추가하고 배열의 새로운 길이를 반환합니다.

const animals = ['pigs', 'goats', 'sheep'];

const count = animals.push('cows');
console.log(count);
// expected output: 4 -> 요소가 추가된 배열의 새로운 길이 반환
console.log(animals);
// expected output: Array ["pigs", "goats", "sheep", "cows"] -> 배열에 요소가 추가됨

• .pop() 배열의 마지막 요소를 제거하고 반환합니다

const plants = ['broccoli', 'cauliflower', 'cabbage', 'kale', 'tomato'];

console.log(plants.pop());
// expected output: "tomato" -> 제거된 값 반환

console.log(plants);
// expected output: Array ["broccoli", "cauliflower", "cabbage", "kale"] -> 마지막 요소가 제거된 배열

.concat()

⚠️배열의 원본이 변경되지 않는 메소드입니다.

arr1.concat(arr2) - 배열 arr1과 arr2를 한 배열로 합쳐주는 메소드입니다
arr1.concat(arr2, arr3, arr4, arr5) 와 같이 여러 배열에 사용가능합니다

const array1 = ['a', 'b', 'c'];
const array2 = ['d', 'e', 'f'];
const array3 = array1.concat(array2);

console.log(array3);
// expected output: Array ["a", "b", "c", "d", "e", "f"]

.splice(시작인덱스, 삭제할 요소의 개수, 시작 인덱스에 추가할 요소)

배열의 기존 요소를 삭제 또는 교체하고 새 요소를 추가하여 배열의 내용을 변경합니다.

const months = ['Jan', 'March', 'April', 'June'];
months.splice(1, 0, 'Feb'); 
// inserts at index 1 -> months[1]에 'Feb' 요소를 넣습니다
console.log(months);
// expected output: Array ["Jan", "Feb", "March", "April", "June"]

months.splice(4, 1, 'May');
// replaces 1 element at index 4 -> months[4] 요소를 'May' 요소로 교체합니다
console.log(months);
// expected output: Array ["Jan", "Feb", "March", "April", "May"]

.join('seperator')

배열을 sperator로 나누어진 문자열로 변환해줍니다 아무값도 안 넣을 경우 ',' 를 seperator로 나눕니다

const elements = ['Fire', 'Air', 'Water'];

console.log(elements.join());
// expected output: "Fire,Air,Water"

console.log(elements.join(''));
// expected output: "FireAirWater"

console.log(elements.join('-'));
// expected output: "Fire-Air-Water"

console.log(elements);
// expected output : Array ["Fire", "Air", "Water"]

⭐️.slice(start, end)

⚠️배열의 원본이 변경되지 않는 메소드입니다. (immutable)
배열의 start부터 end 전까지 얕은 복사본을 새로운 배열 객체로 반환합니다
(slice를 통해 만들어진 배열의 복사본은 원본 배열에 아무런 영향을 끼치지 않습니다!)
start 이상 end 미만 으로 기억해두시면 편합니다

const animals = ['ant', 'bison', 'camel', 'duck', 'elephant'];

console.log(animals.slice(2));
// expected output: Array ["camel", "duck", "elephant"]
// 값을 하나만 적을 시에는 start부터 배열의 끝 요소까지 모두 반환합니다

console.log(animals.slice(2, 4));
// expected output: Array ["camel", "duck"]

console.log(animals.slice(1, 5));
// expected output: Array ["bison", "camel", "duck", "elephant"]

console.log(animals.slice(-2));
// expected output: Array ["duck", "elephant"]
// '-' 값이 들어갈 경우 맨 마지막 인덱스부터 반환합니다

console.log(animals.slice(2, -1));
// expected output: Array ["camel", "duck"]

console.log(animals.slice());
// expected output: Array ["ant", "bison", "camel", "duck", "elephant"]
// 원본 배열과 같지만 새로운 복사본 배열을 반환한 값입니다