ES6 현재 : 템플릿 문자열

es6 템플릿 리터럴 : JavaScript 문자열에 대한 현대적인 접근

키 하이라이트 :

ES6 (ECMAScript 2015)은 현대 웹 개발에 중요한 기능을 소개하여 JavaScript를 크게 향상시킵니다. 템플릿 리터럴, 백티크 (`)를 구분 제로 사용하여 JavaScript의 문자열 처리를 혁신합니다. 그들은 임베디드 표현식과 멀티 린 줄을 가능하게합니다.

태그 함수는 템플릿 리터럴로 선정 될 수있어 결과 문자열의 사용자 정의 처리 (예 : URL 인코딩)가 허용됩니다. 최신 브라우저에서 널리 지원되는 반면 ES6은 이전 브라우저의 경우 ES5로 변환 할 수 있습니다. 기능 감지는 호환성을 보장합니다 (이 기사는 Microsoft Web Development 시리즈의 일부입니다. Sitepoint를 지원해 주신 파트너에게 감사합니다.) es6는 JavaScript의 현재와 미래입니다. 이 시리즈는 가장 유용한 기능을 탐구합니다. 내 코딩 스타일은 일관되게 문자열에 단일 따옴표를 사용하여 HTML 문자열 구성에서 장점을 제공합니다.

탈출 문자를 피하면 가독성이 향상됩니다. HTML은 유연하지만 우선 순위를 정하는 사람이 읽을 수있는 코드가 중요합니다. DHTML의 복잡성에 대한 과거의 경험을 통해 클리너 솔루션에 감사했습니다. 표현 치환 및 향상된 가독성 :

단일 따옴표에 대한 선호도는 내 PHP 배경에서 비롯되어 가변 대체를 방지하여 성능을 향상시킵니다. JavaScript는 이전 에이 기능이 부족하여 문자열 연결이 필요했습니다
• 이것은 더 긴 줄로 번거롭게되고 종종 일렬 오류로 이어집니다. JavaScript의 네이티브 멀티 라인 문자열 부족이 더욱 복잡해집니다
템플릿 리터럴 : 솔루션 : es6 템플릿 리터럴은 이러한 문제를 해결합니다. 백 티크 (`)는 표현식 대체 및 다층 문자열을 허용합니다 :
구성은 JavaScript 표현식을 처리하여 계산 및 객체 속성 액세스를 가능하게합니다.
• 멀티 린 문자열은 이제 쉽지 않습니다
• 태그가 지정된 템플릿 :

템플릿 리터럴은 함수로 "태그"될 수 있으며 사용자 정의 문자열 조작을 가능하게합니다.

이 함수는 문자열을 인수로 수신하여 URL 인코딩과 같은 작업을 허용합니다. 태그 함수 내에서 문자열 부품에 액세스하는 : 태그 함수는 문자열 부분과 임베디드 표현식을 별도의 인수로 수신합니다.

속성은 이스케이프 시퀀스를 포함하여 원시 줄 부분을 제공합니다. 브라우저 호환성 및 기능 감지 :

대부분의 최신 브라우저는 템플릿 리터럴을 지원하지만 이전 브라우저에는 ES6 변환 (예 : 바벨 사용)이 필요합니다. 기능 감지는 호환성을 보장합니다

추가 읽기 및 자원 :

(간결성을 위해 생략되었지만 원본 텍스트는 템플릿 리터럴의 다양한 기사에 대한 링크가 포함되어 있습니다.)

// Single quotes simplify HTML attribute quoting
var buttonText = 'Save'; 

Microsoft Web Development Series : (도구 및 학습 자료를 포함한 Microsoft의 웹 개발 리소스에 대한 자세한 내용은 원본 텍스트에 포함되었지만 Brevity를 위해 여기에 생략되었습니다.) 자주 묻는 질문 :

(원본 텍스트에는 템플릿 리터럴에 포괄적 인 FAQ 섹션이 포함되어 있으며 길이 제약으로 인해 여기에 생략됩니다.)

위 내용은 ES6 현재 : 템플릿 문자열의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!