[JAVASCRIPT LEVEL1] 8. 특수문자

유지원·2021년 5월 28일
0

JAVASCRIPT LEVEL1

목록 보기
8/19

이 포스팅은 '러닝 자바스크립트'를 보며 공부한 내용입니다.

자주 사용되는 특수문자

역슬래시는 따옴표를 이스케이프할 때 뿐만 아니라,
줄바꿈 문자처럼 화면에 표시되지 않는 일부 특수문자나 임의의 유니코드 문자를 나타낼 때도 사용.

라틴-1 문자셋은 유니코드의 부분집합.
\xXX는 유니코드 코드 포인트 \u00XX와 동일.
16진수에는 소문자와 대문자를 모두 사용 가능.

유니코드 문자 코드를 이스케이프하지 않고 에디터에서 직접 입력할 수도 있습니다.


템플릿 문자열

변수나 상수를 문자열 안에 쓰는 방법.

  • ES6 이전 ➜ (외부 라이브러리를 사용하지 않으면) 문자열 병합concatenation.
  • ES6 이후 ➜ 문자열 템플릿template ( 문자열 채우기interpolation ) 사용.

문자열 템플릿.

  • 문자열의 정해진 위치에 값을 채워 넣는 방법.
  • 큰따옴표나 작은따옴표를 쓰지 않고 백틱backtick을 사용.
let currentTemp = 19.5;
// 00b0는 온도를 나타내는 유니코드 코드 포인트.
const message = "The current temperature is " + currentTemp + "\u00b0C";

↑: 문자열 병합, ↓:문자열 템플릿을 사용.

let currentTemp = 19.5;
const message = `The current temperature is ${currentTemp}\u00b0C`;

✔️ 문자열 템플릿 안에서는 달러 기호가 특수문자가 됩니다.
✔️ 달러 기호 다음에 중괄호로 감싼 값을 쓰면 그 값이 문자열에 삽입됩니다.
✔️ 문자열 템플릿 안에 달러 기호를 써야 한다면 역슬래시로 이스케이프하면 됩니다.


여러 줄 문자열

이 기능은 자바스크립트 콘솔에서는 동작하지 않으므로 시험해 보려면 자바스크르비트 파일을 만들어야 합니다.

const multiline = "line1\"
line2";

위의 코드에는 muliline 문자열에 줄바꿈 문자가 들어가지 않습니다. ( 결과: line1line2 )
✔️ 첫 행 마지막의 역슬래시는 줄바꿈 문자를 이스케이프하기는 하지만, 문자열에 줄바꿈 문자를 삽입하지는 않습니다.

줄바꿈 문자가 들어가게 하려면 아래와 같이 써야 합니다.

const multiline = "line1\n\
line2";

const multiline = `line1
line2`;

위 코드의 결과에는 줄바꿈 문자가 들어 있습니다.
하지만 어느 쪽이든, 다음 줄 앞에 있는 들여쓰기가 결과 문자열에 포함됩니다.

ex) 아래 코드의 결과 문자열에는 분명 줄바꿈 문자가 들어가지만, 원하지 않는 공백이 line2와 line3 앞에 들어갑니다.

const multiline = `line1
line2
line3`;

따라서 ✔️ 여러 줄 문자열을 권하지 않습니다.
➜ 여러 줄 문자열을 쓰려면 코드를 읽기 쉽게 만드는 들여쓰기를 포기하거나, 결과 문자열에 원하지 않는 공백이 들어가거나 둘 중 하나.


소스 코드에서 문자열을 여러 행에 나눠 써야 할 때 보통 문자열 병합을 사용.
➜ 코드를 읽기 쉽게 쓸 수 있고, 결과 문자열도 원하는 형태로 만들어집니다.

const multiline = "line1\n" + 
	"line2\n" +
    	"line3";

문자열 병합을 사용할 때는 따옴표와 백틱을 섞어 써도 괜찮습니다.

const multiline = 'Current temperature:\n' +
	`\t${currentTemp}\u00b0C\n` +
    	"Don't worry...the heat is on!";

숫자와 문자열

숫자를 따옴표 안에 넣으면 그건 숫자가 아니라 문자열입니다.
하지만 ✔️ 자바스크립트는 필요하다면 숫자가 들어 있는 문자열을 자동으로 숫자로 바꿉니다.

const result1 = 3 + '30'; // 3이 문자열로 바뀝니다. 결과: 문자열 '330'.
const result2 = 3 * '30'; // '30'이 숫자로 바뀝니다. 결과: 숫자 90.
profile
👋 https://github.com/ujw0712

0개의 댓글