[JavaScript] 자주 사용하는 자바스크립트 코드 정리

 

코딩테스트 공부하는 중... 개인적으로 자주 사용하는 코드를 기억하기 위해 정리해본다.🧐

 

---

 

배열 대소관계 비교 : for 사용하기

 

let array = [3, 2, 1];

for(let i = 0; i < array.length; i++){
        for(let j = 0; j < array.length; j++){
            if(array[i] < array[j]){
                [array[i], array[j]] = [array[j], array[i]];
            }
        }
}

console.log(array) // [1, 2, 3]

 

for을 두 번 사용한다. array = [3, 2, 1]라고 했을 때,

 

array[0]과 array[0] 비교

array[0]과 array[1] 비교

array[0]과 array[2] 비교

 

array[1]과 array[0] 비교

array[1]과 array[1] 비교

array[1]과 array[2] 비교

 

array[2]과 array[0] 비교

array[2]과 array[1] 비교

array[2]과 array[2] 비교

 

이렇게 값들을 비교한다. 그리고 [array[i], array[j]] = [array[j], array[i]] 라고 작성해주면 배열 원소들의 순서가 바뀐다. 오름차순으로 하고 싶다면 if(array[i] < array[j]), 내림차순으로 하고 싶다면 if(array[i] > array[j])로 작성한다.

 

 

배열 대소관계 비교 : sort 메소드 사용하기

 

let array = [1, 3, 4, 2];

array = array.sort((a, b) => (a - b)); // 오름차순
console.log(array); // [1, 2, 3, 4]

array = array.sort((a, b) => (b - a)); // 내림차순
console.log(array); // [4, 3, 2, 1]

 

메소드를 사용하여 간단하게 오름차순, 내림차순으로 정렬할 수도 있다.

 

 

2차원 배열 만들기 : for 사용하기

 

const array = [1, 2, 3, 4, 5, 6];
let result = [];
for(let i = 0; i < array.length; i++){
        let arr = [];
        for(let j = i; j < i+1; j++){
            arr.push(array[j])
        }
        result.push(arr);
}
console.log(result); // [[1], [2], [3], [4], [5], [6]]

 

빈 배열을 for 밖에 하나(result), for 안에 하나(arr) 만든다. 그리고 안에 있는 빈 배열(arr) 아래에 또 하나의 for문을 만든다.

 

arr에 값을 넣고 (arr.push)

그 arr를 result에 넣고 (result.push)

다시 arr는 빈 배열이 된다. (let arr = [])

이 과정을 계속 반복하면 2차원 배열이 완성된다.

 

안에 있는 두 번째 for문의 조건을 바꾸면 다양한 2차원 배열을 만들 수 있다.

 

 

배열에서 가장 큰 값 확인

 

const array = [1, 2, 3, 4, 5]
for(let i = 0; i < array.length; i++){
        if(array[i] === Math.max.apply(null, array)){
            console.log(array[i]); // 5
        }
}

 

Math.max.apply(null, 배열이름)이 배열의 최댓값을 찾아주는 메소드인데, for+if문이랑 같이 사용하면 최댓값에 해당하는 원소를 찾을 수 있음🥴

 

 

배열을 문자열로 바꾸기 : join('')

 

let array1 = [1, 2, 3, 4, 5];
array1 = array1.join('');
console.log(array1); // "12345"

let array2 = ["안", "녕"];
array2 = array2.join('');
console.log(array2); // "안녕"

 

숫자도 string으로 바뀌니 주의!

 

 

문자열을 배열로 바꾸기 : split('')

 

let text1 = "hello";
text1 = text1.split('');
console.log(text1); // ["h", "e", "l", "l", "o"]

let text2 = "hello world";
text2 = text2.split(' ');
console.log(text2); // ["hello", "world"]

let text3 = "hello, world";
text3 = text3.split(',');
console.log(text3); // ["hello", "world"]

 

split안에 넣어주는 값이 단위가 된다. split(' ')처럼 띄어쓰기를 넣어주면 띄어쓰기 단위로 자르고, split(',')처럼 콤마를 넣어주면 콤마 단위로 자른다. split('')처럼 안에 아무것도 안 넣으면 글자 하나하나 단위로 자른다.

 

 

배열 중복 제거 (2차원 배열은 안됨)

 

let array = [1, 1, 2, 2, 3, 3];
let newArray = [...new Set(array)];
console.log(newArray); // [1, 2, 3]

 

중복된 원소를 간단히 제거할 수 있다. 그러나 2차원 배열에서는 안 된다.

 

 

2차원 배열에서 중복 제거하기

 

let array = [[1,1], [1,1], [2,2], [3,3]];

for(let i = 0; i < array.length; i++){
    array[i] = array[i].join('');
}

console.log(array); // ["11", "11", "22", "33"]

let newArrary = [...new Set(array)]

console.log(newArrary); // ["11", "22", "33"]

for(let i = 0; i < newArrary.length; i++){
    newArrary[i] = newArrary[i].split('');
}

console.log(newArray); // [["1","1"], ["2", "2"], ["3", "3"]]

 

join과 split을 이용하여 약간의 꼼수(?)로 2차원 배열의 중복 원소를 없앨 수 있다. join으로 2차원 배열을 string으로 바꾼 다음 new Set으로 중복 원소를 제거하고 다시 split으로 배열로 바꾸는 방법이다. 이때, 타입이 string으로 바뀌니까 주의해서 사용할 것! (숫자의 경우 parseInt나 Number로 다시 타입을 돌려놓을 수 있다.)

 

 

글자 바꾸기 replace, replaceAll

 

const text = "zerozero";

const result = text.replace("zero", "0");
console.log(result); // "0zero"

const result2 = text.replaceAll("zero", "0");
console.log(result2); // "00"

 

replace와 replaceAll로 문자열의 특정 글자를 바꿀 수 있다. 그러나 replace는 딱 하나만 바꾸고, replaceAll은 모두 다 바꾼다는 차이가 있다. 코딩테스트 문제 풀 때는 replace보다 replaceAll을 더 많이 쓰는 것 같다.

 

 

N진수 변환

 

const number = 25;

console.log(number.toString(2)); // "11001"
console.log(number.toString(3)); // "221"
console.log(number.toString(8)); // "31"

 

숫자 뒤에 toString(n)를 붙이면 n진수로 변환된다. 대신 string 타입이 되니 주의!

 

 

배열 자르기 : slice, splice

 

1. slice(start index, end index) : 배열의 start부터 end 전까지 배열을 잘라낸다. 원본 배열은 변하지 않는다.

 

const array = [1, 2, 3, 4, 5, 6, 7];

console.log(array.slice(1,5)); // [2, 3, 4, 5]
console.log(array); // [1, 2, 3, 4, 5, 6, 7]

 

array[1]부터 array[5]의 전까지! 즉, array[1]부터 array[4]까지의 배열을 생성한다. 단, 원본 배열은 변하지 않는다.

 

const array = [1, 2, 3, 4, 5, 6, 7];

console.log(array.slice(-3)); // [5, 6, 7]
console.log(array.slice(-4, 6)); // [4, 5, 6]
console.log(array.slice(3, -2)); // [4, 5]

 

음수도 사용할 수 있다.

 

slice(-3) : 뒤에서부터 3번째에 해당하는 원소들 [5, 6, 7]

slice(-4, 6) : 뒤에서부터 4번째, 앞에서부터 6번째에 해당하는 원소들 [4, 5, 6]

slice(3, -2) : 앞에서부터 3번째, 뒤에서부터 2번째에 해당하는 원소들 [4, 5]

 

start부터 end 전까지 라서 조금 헷갈리는데 몇 번 적다보니 이해가 되는 듯🧐

 

 

2. slice(start index, 잘라낼 원소의 개수, 추가할 원소) : 배열의 start부터 잘라낼 원소의 개수 만큼 원소를 삭제한다. 원본 배열을 수정한다.

 

const array = [1, 2, 3, 4, 5, 6, 7];
const newArray = array.splice(2, 3);

console.log(newArray); // [3, 4, 5]
console.log(array); // [1, 2, 6, 7]

 

newArray는 만들어진 배열, array는 수정된 원본 배열이다.

 

const array = [1, 2, 3, 4, 5, 6, 7];
const newArray = array.splice(2, 3, "hello");

console.log(newArray); // [3, 4, 5]
console.log(array); // [1, 2, "hello", 6, 7]

 

배열에 원소를 추가할 수 있다. 새로 만들어지는 배열이 아니라, 원본 배열에 추가된다.

 

 

문자열 자르기 : substring, substr

 

1. substring(start index, end index)

 

const str = "abcdefg"

console.log(str.substring(1, 3)); // "bc"

 

2. substr(start index, 잘라낼 원소의 개수)

 

const str = "abcdefg"

console.log(str.substr(1, 3)); // "bcd"

 

substring, substr 모두 문자열을 자르는 메소드이지만, index로 잘라내는지 개수로 잘라내는지의 차이가 있다.