프로그래머스 공백으로 구분하기 2 JS ( split(" ")의 성질 2가지 )

문제 설명

단어가 공백 한 개 이상으로 구분되어 있는 문자열 my_string이 매개변수로 주어질 때, my_string에 나온 단어를 앞에서부터 순서대로 담은 문자열 배열을 return 하는 solution 함수를 작성해 주세요.

 

 

 

🙋‍♀️ 내 생각

이 문제는 split()메서드에 대한 이해도가 있다면 금방 풀수있는 문제이다.

split()이 구분자를 기준으로 문자열을 나누기 때문에, 구분을 하면서 공백을 제거할수가 있다.

하지만 이 문제를 풀면서 생각보다 split()에 여러가지 성질이 있고, 그래서 활용할때 주의해야겠다는 생각이 들었다.

문제를 해결하다보니 이런 세세한것들을 깨닫고 공부했다.

mdn문서와 일일이 실험하면서 파악한 속성들을 정리한 것이기때문에 정확하지 않은 정보가 포함되어있을 수도 있다.

 

우선 처음에는 단순하게 split(' ')을 통해서 공백값을 제거할 수 있다고 생각했는데, 코드를 그렇게짜면 아래와 같은 결과값이 나온다.

이런문제가 생긴 이유는 크게 2가지라고 생각했다.

 

1️⃣ split()은 seperator를 기준으로 문자열을 자른다.

split은 무엇을 제거하는것이 기본성질이 아니라, 구분자를 기준으로 앞뒤로 자르고 구분자를 삭제한다. 

처음에는 split(' ')을 통해 모든 공백을 제거할 수 있을것이라 생각했지만, 막상 코드를 실행하면 위와 같은 값이 나오는데 그 이유는 아래와 같다

🔫 split(" ")는 연속된 구분자를 한 번만 구분한다

그래서 중간에 오는 ""값이 4개라면, 한번만 구분하여 한개만 삭제하고 나머지3개는 남겨둔다. 

split('')을 통해서 원래 문자열에 몇개의 ""가 포함되어 있는지를 확인해보았다. 이렇게 비교해보면 이해하기가 더 쉽다. 

이렇게보면, 테스트1의 맨앞과 맨뒤를 제외한 중간""값은 4개,2개였던것을 확인할 수 있다.

그러면 왜 split(" ")으로 모든 공백이 제거되지 않았는지가 이해가 된다.  

기존에 4개였던 ""가 3개로(i와 love사이), 2개였던 ""가 1개(love와 you사이)로 바뀐것이다.

 

🤔 주의할점

split(" ")은 연속된 공백 문자열을 하나의 구분자로 간주하지 않고 한번만 구분하지만,

split("a")는 연속된 "a" 문자열을 모두 구분한다.

 

2️⃣ split(" ")은 맨앞과 맨뒤에 있는 구분자는 분할하지 않는다.

그래서 계속 위의 결과값과 같이 맨앞과 맨뒤의 공백은 전혀 영향받지 않고 개수도 똑같이 유지된다.

 

 

 

split()의 속성에 대해 이해하다보니, 해결법이 여러개가 생각나서 이 문제는 여러가지 방법으로 풀어보았다.

 

 

✅ 내 코드

function solution(my_string) {
    return my_string.split(' ').filter(a=> a!=='')
}

split(' ')을 해도 ""이 남는 문제를 해결하기 위해서 filter를 사용하였다. 

a!==''를 통해서 값이 ''인 것들은 걸러주었다.

 

filter(a=>a!=='')대신에 filter(a=>a)로 알맹이가 있는 값만도 남길 수 있다.

 

 

function solution(my_string) {
    return my_string.trim().split(/\s+/)
}

split(" ")이 맨앞과 맨뒤의 구분자는 분할하지 않기때문에 trim()을 이용해서 ""값을 없앴다.

그런 다음, split(/\s+/)를 이용해서 사이에 있는 공백을 제거했다.

 

🔫 split(/\s+/) 과 split(" ")의 차이점

split(" "): 연속된 공백문자가 아니라, 공백 문자 하나(" ")를 구분자로 사용하여 분할

(/\s+/): 연속된 공백문자를 구분자로 인식하여 분할

 

(/\s+/)은 정규표현식 /\s+/를 구분자로 사용한다. 연속된 하나이상의 공백을 나타낸다.

split(" ")과는 다르게 공백문자를 일일이 따로따로 인식하는것이 아니라, 하나의 통으로 인식하기 때문에 연속된 구분자를 한번만 구분하는 split()의 특성에도 불구하고 중간에 있는 모든 공백이 제거될 수 있다.

 

 

function solution(my_string) {
  return my_string.split(/\s+/).filter(a=>a !=="")
}

split(/\s+/)와 filter를 이용해서도 풀 수 있다.

 

 

 

🙋‍♀️ 내 생각

split(" ")이 공백을 한번만 구분한다는 것도 신기했지만, (/\s+/)가 공백을 통으로 인식한다는 것도 신기했다.

이 문제를 풀면서  split(" ")에 대해서 더 자세히 알게되었다. 

문제를 푸는데는 그렇게오래 안걸렸는데 왜 이게 풀린건지, 내가 몰랐던게 무엇인지가 궁금해서 공부하다보니 거기에 시간이 많이 들었다.

split()을 그렇게 어렵게 생각하지는 않았는데, 사용하다보니 생각보다 까다로운면이 있었던것같다. 이번에 문제를 풀면서 이렇게 저렇게하면서 어떤 성질을 지니고 있는지 공부하였다.

앞으로 코드를 짜면서 split(" ")을 사용할 일이 생기면 조금 더 섬세하게 다룰수 있지 않을까 생각한다.