JavaScript의 줄 연속 문자
- JavaScript의 어휘 문법
- JavaScript의 문자열 리터럴
- JavaScript에서 줄 계속
- JavaScript에서 이스케이프 메서드를 사용하여 줄 연속 구현
- JavaScript에서 템플릿 리터럴을 사용하여 줄 연속 구현
- JavaScript에서 HTML 나누기 요소를 사용하여 줄 연속 구현
JavaScript의 어휘 문법은 이 간단한 JavaScript 자습서에서 다룹니다. 또한 다양한 줄 바꿈 기술과 이러한 문자열을 처리할 때 줄 바꿈을 처리하는 방법을 사용하여 문자열을 깊이 있게 다룰 것입니다.
JavaScript의 어휘 문법
컴퓨터 과학에서 어휘 문법은 토큰의 구문을 설명하는 기술 문법입니다. 프로그램은 언어의 언어 구조에 의해 정의된 문자로 구성됩니다.
문자 집합은 모든 서면 언어의 알파벳과 비슷합니다. ECMAScript 스크립트의 소스 텍스트는 왼쪽에서 오른쪽으로 읽히고 토큰, 제어 문자, 줄 종결자, 주석 또는 공백과 같은 일련의 입력 구성 요소로 변환됩니다.
ECMAScript는 문 뒤에 세미콜론을 삽입하기 위한 특정 키워드, 리터럴 및 규칙을 정의합니다.
JavaScript의 문자열 리터럴
문자열 리터럴은 작은따옴표나 큰따옴표로 묶인 0개 이상의 유니코드 코드 포인트 순서입니다. 이스케이프 시퀀스는 유니코드 코드 포인트를 나타낼 수도 있습니다.
다음 닫는 따옴표 코드 포인트를 제외하고 모든 코드 포인트는 문자열 리터럴에서 그대로 나타날 수 있습니다.
U+005C또는\(백슬래시),U+000D또는<CR>,- 및
U+000A또는<LF>.
모든 코드 포인트는 이스케이프 시퀀스로 나타날 수 있습니다.
문자열 리터럴은 ECMAScript 문자열 값으로 해석됩니다. 유니코드 코드 포인트는 이러한 문자열 값이 생성될 때 UTF-16으로 인코딩됩니다.
JavaScript에서 줄 계속
JavaScript에서 문자열 조작은 복잡할 수 있습니다. 문자열 조작은 마스터하기는 쉽지만 구현하기는 어렵고 관련 영역 중 하나는 새 줄을 추가하는 것입니다.
JavaScript로 새 줄을 삽입하는 다른 방법이 있지만 HTML의 단락 또는 구분 태그만큼 간단하지 않습니다.
그럼에도 불구하고 JavaScript에서 새 줄을 삽입하는 가장 일반적인 방법을 살펴보겠습니다.
JavaScript에서 이스케이프 메서드를 사용하여 줄 연속 구현
JavaScript에서 이스케이프 시퀀스는 새 줄을 만드는 체계적인 방법입니다. Windows 및 Linux에서 새 줄의 이스케이프 시퀀스는 \n입니다. 그러나 일부 구형 Mac에서는 \r이 사용됩니다.
이스케이프 시퀀스의 구현은 비교적 간단합니다.
예:
let data = 'Hello World';
let newstring = 'Hello \nWorld';
console.log(data);
console.log(newstring);
출력:
"Hello World"
"Hello
World"
이 link를 사용하여 위 코드 세그먼트의 결과를 볼 수도 있습니다.
16진수 이스케이프 시퀀스
16진수 이스케이프 시퀀스는 \x 문자와 0x0000에서 0x00FF 범위의 코드 단위 또는 포인트를 나타내는 정확히 두 개의 16진수 숫자로 구성됩니다.
예:
'\xA9' // "©"
유니코드 이스케이프 시퀀스
\u 다음의 유니코드 이스케이프 시퀀스는 정확히 네 개의 16진수로 구성됩니다. UTF-16 인코딩에서 코드 단위를 나타냅니다.
코드 단위는 U+0000에서 U+FFFF까지의 코드 포인트와 동일합니다. 코드 포인트에는 문자를 인코딩하는 데 사용되는 두 개의 코드 단위를 반영하는 두 개의 이스케이프 시퀀스가 필요합니다. 서로게이트 쌍은 코드 포인트에서 고유합니다.
예:
'\u00A9' // "©" (U+A9)
유니코드 코드 포인트 이스케이프 시퀀스
유니코드 코드 포인트 이스케이프 시퀀스는 16진수 코드 포인트가 있는 \u{}로 구성됩니다. 16진수 범위는 0에서 0x10FFFF까지여야 합니다.
U+10000에서 U+10FFFF까지의 코드 포인트에는 서로게이트 쌍이 필요하지 않습니다. ECMAScript 2015에서 코드 포인트 이스케이프가 JavaScript(ES6)에 추가되었습니다.
예:
'\u{2F804}' // CJK COMPATIBILITY IDEOGRAPH-2F804 (U+2F804)
// the same figure portrayed as a surrogate twin
'\uD87E\uDC04'
JavaScript에서 템플릿 리터럴을 사용하여 줄 연속 구현
템플릿 리터럴은 복잡해 보일 수 있지만 전문 용어 뒤에 포함된 표현식을 지원하는 문자열 리터럴입니다. 여러 줄 문자열의 사용을 용이하게 합니다.
백틱(``)은 템플릿 리터럴을 둘러싸는 데 사용됩니다.
예:
let data = 'Hello \nWorld';
let newstring = `Hello
World`;
console.log(data);
console.log(newstring);
출력:
"Hello
World"
"Hello
World"
이 link를 사용하여 위 코드 세그먼트의 결과를 볼 수도 있습니다.
이스케이프 메서드와 템플릿 리터럴의 두 상황 모두에서 동일한 출력이 반환됩니다. 그러나 보시다시피 템플릿 리터럴을 사용하면 여러 줄 문자열을 더 쉽게 작성할 수 있습니다.
JavaScript에서 HTML 나누기 요소를 사용하여 줄 연속 구현
JavaScript에서 새 줄을 만드는 또 다른 방법은 문자열에 HTML 줄 바꿈 요소를 포함하는 것입니다.
break 요소는 라인 분할이 중요한 경우에만 사용해야 한다는 점에 유의해야 합니다. 그러나 이 전략은 매우 널리 퍼져 있기 때문에 우리도 살펴볼 것입니다.
예:
<html>
<body>
<p id="newline"></p>
<script>
let data = "Hello" + "<br>" + "World ";
document.getElementById("newline").innerHTML = data;
</script>
</body>
</html>
출력:
.innerText가 아닌 .innerHTML을 사용해야 합니다.이 link를 사용하여 위 코드 세그먼트의 결과를 볼 수도 있습니다.