split 제대로 알고 사용하기!
프로그래머스 level2의 '수식 최대화'를 풀었다.
문제를 풀면서 처음 셋팅해주어야 하는 게,
주어진 문자열 인자를 수식 단위로 끊어서 저장하려고 했다. ⇣ 아래처럼!!
"100-200*300-500+20" ➡️ [100,'-',200,'*',300,'-',500,'+',20]
그래서 나는 extractOp 함수를 따로 만들어서, 문자열을 돌아가며 배열을 만들어주었다.
function extractOp (expr = "100-200*300-500+20") {
const exArr = [];
let tmp = 0; // 숫자를 담아줄 temp
for (let i = 0; i <= expr.length; i++) {
let num = Number(expr[i]); // 일단 숫자로 만들어준다.
if (!isNaN(num)) tmp = tmp * 10 + Number(expr[i]); // 숫자일 경우 이전숫자*10 + 현재 숫자
else { // 숫자가 아닐 경우(수식일 경우)
exArr.push(tmp, expr[i]); // 만들어 놓은 'temp'와 '수식' 매열에 푸쉬
tmp = 0;
}
}
return exArr.slice(0, -1);
}그런데 스터디를 하면서 이렇게 간단한 메서드로 풀 수 있다는 것을 알게 되었다. (휴지🐧 최고~)
const exp = "100-200*300-500+20".split(/(\*|\+|\-)/)
.map((el) => {
return ['*', '+', '-'].includes(el) ? el : parseInt(el);
});😲 신기해서 split에 대해 더 자세히 찾아보기로 했다.
찾아보니 다양하게 쓸 수 있는 방법이 많았다.
replace나 replceAll 등 문자열을 매개변수로 넣을 수 있는 곳에서 정규식을 쓰면 더 풍부하게 사용이 가능하다.
1️⃣ 원하는 개수만큼 끊기
split에 두번째 매개변수로 limit을 넣을 수 있다.
let str1 = "Hi! My name is jabae!".split(' ');
let str2 = "Hi! My name is jabae!".split(' ', 3);
console.log(str1);
// ['Hi!', 'My', 'name', 'is', 'jabae!']
console.log(str2);
// ['Hi!', 'My', 'name'] 개수가 3개가 제한이 되어 나온다.2️⃣ 구분자도 결과에 포함하기!
정규식을 사용해 구분자도 결과에 포함할 수 있다. () 괄호를 사용하면 된다!
let str1 = "010-1234-1234".split(/\-/); // 일반적인 '-'로 split할 경우
console.log(str1);
// ['010', '1234', '1234']
let str2 = "010-1234-1234".split(/(\-)/); // 괄호 안에 '-'를 구분자로 넣어준다.
console.log(str2);
// ['010', '-', '1234', '-', '1234'] '-'가 포함되어 나온다!3️⃣ 배열을 구분자로 사용한다면...?
let str = "131,131,131,131".split([1, 1]); // [1, 1]이 String([1, 1])이 된다.
console.log(str);
// ['13', '3', '3', '31'] '1,1'이 구분자가 되어 split한다.‼️ 주의! 구분자로 '' 쓸 경우
주어진 문자열을 한 글자씩 배열로 만들고 싶을 경우, split('')을 자주 쓰곤 한다. 그런데 문서를 보니 이렇게 쓰여 있었다.
사실 알고리즘을 풀 때에는 주로 숫자, 영어가 주어지기 때문에 큰 상관이 없다. 그러나 이모지같은 경우는 "UTF-16" 으로 나누게 되어 망가지게 된다.
let str = "jabae🫶".split(''); // 손하트 이모지를 넣어보자
console.log(str);
// ['j', 'a', 'b', 'a', 'e', '\uD83E', '\uDEF6'] 이모지가 2바이트씩 끊겨서 나오게 된다.split은 많이 사용하는 메서드이기 때문에 알아두면 좋을 것 같다.
💪 우리 프로젝트도 게시판이나, 상태메시지 등에 이모지 사용이 가능하니까! 꼭 알아두자!
평소에 익숙하게 쓰던 메서드들도 문서를 읽으면서 새롭게 쓸 수 있는 방법을 찾아보는 것도 재밌는 것 같다.
역시 문서 최고! 알고리즘 최고! 오늘도 또 배웠다. 🧠
참고: https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/String/split
