대학시절엔 C++로 코딩테스트를 준비하다가, 얼마 전에 javascript로 변경했다.
변경한 이유는 프론트엔드 개발자로서 javascript가 제일 많이 사용할 언어이기도 해서, 공부하려고 한 이유도 있고,
요즘 프론트엔드 개발자 채용때 js로만 코딩테스트를 볼 수 있는 회사도 몇 있다고 해서, js로 다시 시작하게 됐다.
백준 / 프로그래머스 중에 고민했는데, 백준은 javascript로 하기는 좀 어려운 부분이 있다고 들은 적이 있기도 하고, 보통 프로그래머스에서 코딩테스트가 진행된다고 하여, 프로그래머스로 시작하게 됐다.
예전에 백준을 이용했을 땐, 거기 정해진 단계별로 풀면서 진행했는데
프로그래머스에서는 초반에 어떻게 학습을 진행할지 고민을 좀 했었다.
프로그래머스는 레벨 별로 문제가 나뉘는데, Lv.0 부터 Lv.5 까지 존재한다.
나는 javascript가 아직 익숙하지 않기도 해서, Lv.0 문제들부터 쭉쭉 풀면서 점점 단계를 올리기로 했다.
Lv. 0 문제가 200개가 넘어서, 언제 다 푸냐.. 싶었는데 결국 오늘 다 풀었다!🥳🥳
🎉 짠! 안푼 문제 검색하니 안나오는거 보이십니까~~🎉
그래서, 220문제 가량을 풀면서 자주 쓰이는것이나 잘 몰랐던 것들을 이번에 정리하고 다음 레벨인 Lv.1으로 넘어가려고 한다.
✅ 자주 쓰이는 문법
1️⃣ 배열 관련 문법
✏️ 배열의 인덱스가 0부터 시작하는건 다 아시죠??
arr.indexOf(a)
➡️ 배열 arr 에서 a 의 첫 위치 찾기
let arr = [1, 2, 3, 2, 1];
console.log(arr.indexOf(2)); // 1arr.lastIndexOf(a)
➡️ 배열 arr 에서 a 의 마지막 위치 찾기
let arr = [1, 2, 3, 2, 1];
console.log(arr.lastIndexOf(2)); // 3arr.includes(n)
➡️ n 이 배열 arr 에 있는지 확인
let arr = [1, 2, 3, 2, 1];
console.log(arr.includes(3)); // true
console.log(arr.includes(5)); // falsearr.length
➡️ arr 배열의 길이
let arr = [1, 2, 3, 2, 1];
console.log(arr.length); // 5arr.slice(i, j)
➡️ arr 배열 자르기 (i 부터 j-1 까지)
let arr = [1, 2, 3, 2, 1];
let sliced = arr.slice(1, 4);
console.log(sliced); // [2, 3, 2]arr.map(func)
➡️ arr 배열의 각 요소에 func 함수를 적용한 새 배열 반환
let arr = [1, 2, 3, 2, 1];
let doubled = arr.map(x => x * 2);
console.log(doubled); // [2, 4, 6, 4, 2]arr.filter(v => f)
➡️ arr 배열에서 f 조건에 맞는 요소만 남기기
let arr = [1, 2, 3, 2, 1];
let even = arr.filter(x => x % 2 === 0);
console.log(even); // [2, 2]Spread 연산자 (펼침 연산자)
➡️ ... 이라고 쓰며, 배열이나 객체 안의 값을 "펼쳐서" 복사하거나 전달할 때 사용한다.
📩 배열 복사:
const arr1 = [1, 2, 3];
const arr2 = [...arr1]; // arr1을 복사
console.log(arr2); // [1, 2, 3]🤔 그냥 쓰지 왜 굳이 복사를 하는가??
💡 javascript에서 배열은 참조 타입이다.
👉 배열이나 객체를 변수에 할당하면 값 자체가 아니라 메모리 주소(참조)가 저장된다!
그래서 배열을 복사하지 않고 그냥 다른 변수에 할당하면 같은 메모리 주소를 공유한다.
즉, 하나를 바꾸면 다른 것도 같이 바뀌어버린다!!😱
따라서, 해당 배열을 쓰는게 아니라, 배열 안의 요소들을 쓰고 싶을 때는 배열을 직접 가져오지 말고 복사해서 쓰는게 안전하다!
➕ 배열 합치기:
const fruits = ["🍎", "🍊"];
const moreFruits = ["🍇", ...fruits, "🍉"];
console.log(moreFruits); // ["🍇", "🍎", "🍊", "🍉"]2️⃣ 문자열 관련 문법:
a.toUpperCase()
➡️ 문자열 a를 대문자로 변환
let word = "hello";
console.log(word.toUpperCase()); // "HELLO"x.repeat(y)
➡️ 문자열 x를 y번 반복
console.log("ha".repeat(3)); // "hahaha"str.split("a")
➡️ 문자열 str을 a 기준으로 나누기
❗ 결과는 배열이 된다!! 보통 문자열을 배열로 변환할 때 사용하며, 이 경우 str.split("") 이렇게 쓴다.
let sentence = "hello world";
let words = sentence.split(" ");
console.log(words); // ["hello", "world"]str.replace(/mmm/g, nnn)
➡️ 문자열 str의 mmm 을 nnn으로 치환한다.
let text = "apple apple banana";
console.log(text.replace(/apple/g, "orange")); // "orange orange banana"3️⃣ 숫자 관련:
Number.isInteger(a)
➡️ a가 정수인지 확인 -> 정수이면 true, 정수가 아니면 false 반환
console.log(Number.isInteger(10)); // true
console.log(Number.isInteger(10.5)); // false🌟 소수점 관련
-
1️⃣ Math.trunc(a)
➡️a의 소수점을 제거하고 정수만 남긴다. 부호는 유지된다.console.log(Math.trunc(5.98)); // 5 console.log(Math.trunc(-3.14)); // -3 console.log(Math.trunc(0.99)); // 0 console.log(Math.trunc(-0.99)); // -0 (실제로는 그냥 0) -
2️⃣ Math.round(a)
➡️a의 소수점을 반올림한다. 소수 첫째 자리에서 0.5 이상이면 올리고, 그보다 작으면 내린다!console.log(Math.round(5.49)); // 5 console.log(Math.round(5.5)); // 6 console.log(Math.round(-3.5)); // -4 (음수도 반올림은 절대값 기준으로 진행) console.log(Math.round(-3.14)); // -3 -
3️⃣ Math.ceil(a)
➡️a의 소수점을 무조건 큰 정수로 올린다.❗ 음수도 올림이지만 절대값 기준이 아님! 더 큰 방향으로 올리기!
console.log(Math.ceil(5.01)); // 6 console.log(Math.ceil(5.98)); // 6 console.log(Math.ceil(-3.01)); // -3 (음수지만 큰 쪽으로 "올림") console.log(Math.ceil(-3.99)); // -3 -
4️⃣ Math.floor(a)
➡️a의 소수점을 무조건 작은 정수로 내린다.❗ 음수는 더 작은 방향으로 내리기!
console.log(Math.floor(5.98)); // 5 console.log(Math.floor(5.01)); // 5 console.log(Math.floor(-3.01)); // -4 (음수는 더 작은 방향으로 내림) console.log(Math.floor(-3.99)); // -4
+A
➡️ A의 타입을 숫자로 변환한다. = Number(A)
사실, Number(A) 라고 쓰면 되지만, 이렇게 하면 빠르게 작성이 가능하다.
🌟 true는 1, false는 0으로 변환된다. 빈 문자열 "" 도 false 이므로 0으로 변환한다.
console.log(+true); // 1
console.log(+false); // 0
console.log(+"123"); // 123
console.log(+""); // 03️⃣ 함수 관련:
const f = () => {}
➡️ 화살표로 함수 표현
const add = (a, b) => {a + b};
console.log(add(2, 3)); // 5⚡ 어려웠던 문법
Set 객체
➡️ 중복 없는 유일한 값의 집합
어떤 배열을 중복값이 없는 배열로 만들고 싶다고 하자. 어떻게 해야할까?
이 과정을 거치면 된다.
배열1 -> Set -> 배열2
Set 객체를 거치면 중복된 값들이 하나로 바뀌어 저장될 것이다.
그럼, 배열을 Set으로, Set을 배열로 어떻게 바꿀까? 아래 코드를 보자.
let arr = ["a", "a", "b", "b"];
const set = new Set(arr);
const newArr = [...set];
console.log(newArr); // ["a", "b"]new Set() 으로 Set 객체를 생성한 뒤, 그 안에 배열을 집어넣는다. 이때 중복이 제거된다.
그럼, 다시 Set 객체를 배열로 바꿔야 한다. 이 때는, ... 을 이용할 것이다. (앞에서 설명함)
[...set] 이렇게 적으면 다시 배열이 되는데, 이 배열은 중복값을 가지고 있지 않다!
Set에 값 추가
배열에는 값을 추가할때 보통 .push를 썼다. Set은 배열과 다르게 .add를 사용한다.
let arr = ["a", "a", "b", "b"];
const set = new Set(arr);
set.add("c");
console.log([...set]); // ["a", "b", "c"]
정규표현식 (Regex):
💡 알아두면 매우 편리한 정규표현식! 예전에 다룬 적이 있어, 여기서 설명하진 않겠다.
✏️ 정규표현식 보러가기
// 숫자 1개 이상 찾기
let str = "abc123def456";
let regex = /\d+/g;
let numbers = str.match(regex);
console.log(numbers); // ["123", "456"]아스키 코드 구하기
💡 아스키 코드를 간단히 설명하자면
문자와 숫자를 컴퓨터가 이해할 수 있는 숫자로 변환한 표준 코드 체계 라고 할 수 있다.
어느 문제에서 메모해둔지 모르겠다.. 다음부턴 문제도 적어둬야겠다.
Lv.1 문제에서 찾았다!!! 관련해서 따로 글 올렸으니 한번 읽어보길! ✏️ 보러가기
문자 순서대로 정렬하거나 각 문자에 대한 숫자값? 이 필요할 때 쓰면 좋을 것 같다.
String.fromCharCode(아스키 번호)
아스키 번호에 해당하는 문자를 반환
const p1 = String.fromCharCode(65, 66, 67)
console.log(p1) // "ABC"str.charCodeAt()
문자str의 아스키 번호를 반환
console.log('A'.charCodeAt()) // 65str.codePointAt()
문자str의 아스키 번호를 반환
console.log('A'.charCodeAt()) // 65charCodeAt() 과 codePointAt() 의 기능은 비슷하지만, 차이가 조금 있다.
charCodeAt()은 codePointAt()에 비해 오래된 방식이고 2바이트 문자까지만 처리한다.
💡 즉, 이모지나 특수 문자도 안전하게 처리하려면 codePointAt()을 쓰는 게 좋겠죠?
최대공약수 함수
최대공약수를 구해야 할 때가 있는데, 아래처럼 함수를 만들어서 사용하는게 좋다.
function gcd(a,b){
if(b === 0){
return a;
}
else{
return gcd(b,a%b)
}
}최소공배수 함수
최소공배수도 알아두자.
function lcm(a,b){
return a * b / gcd(a, b);🍎 마무리
여기까지 Lv.0 문제 200개 가량을 풀며 썼던 여러 문법들을 정리해봤다
이제 맘편히 Lv.1 문제로 넘어갈 수 있을 것 같다.
어려운 문제가 있거나 Lv.1 다 풀고 또 정리하러 오겠다.🫠🫠
추가 ) 갑자기 생각난건데 javascript 에서 문자열은 불변 이다!!!
그래서 수정이 필요할 땐
1️⃣ 문자열을 .split("") 으로 배열로 바꾸고,
2️⃣ 수정하고,
3️⃣ 수정한 배열을 다시 .join("") 으로 문자열로 바꾸는
이런 작업이 많았다.
참고하시길 😅
