[JS] split 함수 빈칸 제거 안됨 해결:: non breaking space

javascript logo

 

split 함수를 써서 빈칸을 기준으로 문장을 나누려고 했다.

그런데 문장 일부는 빈칸 기준으로 나뉘어지고, 다른 일부는 빈칸 기준으로 나누어지지 않는 현상을 발견했다.

아래 이미지에서 두 케이스의 다른 점이 보이는가?

첫 번째 줄은 정상적으로 빈칸을 기준으로 문장이 나뉘어진 것을 확인할 수 있는데, 두 번째 줄은 결과 어레이의 첫 번째 값을 보면 'an apple'이 나뉘어지지 않은 것을 확인할 수 있다.

split(' ')이 먹히지 않는 현상

 

두 케이스의 차이점은 문장에 'non breaking space'를 썼다는 것이다.

non breaking space는 윈도우: alt+space, 맥: option+space 를 사용했을 때 만들어지는 공백이다.

또는 html에서  를 썼을 때 만들어지는 공백이다.

흔히 스페이스바만을 눌러서 생성되는 공백과는 다른 것이다.

이때, split(' ')를 사용해서 문장을 나누려고 한다면 non breaking space는 일반 whitespace(공백)에 해당하지 않으므로 나뉘어지지 않는 것이다.

 

이럴땐 정규식을 사용하면 된다.

• \s: whitespace(공백)
• \s+: 한 번 이상 반복되는 whitespace

'an apple is a fruit'.split(/\s+/);

 

정규식(regex) 사용 예시

 

mixedSentence는 non breaking space(alt/option + space)와 일반 whitespace(space)로 이루어진 문장이다.

첫 번째로 split(' ')를 사용했을 때는 모든 공백에 대해서 문장이 나누어지지 않은 것을 확인할 수 있다.

그 반면에 두 번째로 정규식을 활용하여 split(/\s+/)를 사용했을 때는 모든 공백에 대해서 문장이 나누어지는 것을 확인할 수 있다.