메뉴 건너뛰기

조회 수 1792 추천 수 0 댓글 0
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄 첨부
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄 첨부

문자열 안에서 쌍따옴표, 홑따옴표를 처리하는 방법을 알아보겠습니다.

 

Javascript 안에서 문자열은 쌍따옴표(") 또는 홑따옴표(') 안에 표시합니다.

그렇다면 문자열 안에 따옴표를 표시하려면 어떻게 해야 할까요?

let str = ""안녕하세요?""; // error

위와 같이 따옴표로 감싼 문자열 안에, 그대로 따옴표를 사용하면 에러가 발생합니다.

 

 

문자열 안에서 따옴표를 표시하기 위한 3가지 방법을 소개합니다.

문자열에 표시하려는 따옴표와 다른 따옴표로 문자열 표현하기

 

 

가장 간단한 방법으로

만약 문자열에 '홑따옴표(')'를 표시하고 싶다면,

문자열을 쌍따옴표(")로 감싸서 표시하면 되고,

문자열에 '쌍따옴표(")를 표시하고 싶다면

문자열을 홑따옴표(')로 감싸서 표시하면 됩니다.

 

간단한 방법이지만 몇가지 제약이 있습니다.

만약, 전체 프로젝트에서 문자열은 항상 홑따옴표(')로만 정의하기로 했다면

위 방법으로는 문자열에 홑따옴표(')를 표시할 수 없습니다.

또한, 하나의 문자열 안에 홑따옴표(')와 쌍따옴표(")를 같이 표시해야 한다면 어떻게 해야 할까요?

 

 

escape 문자 사용하기

 

하나의 문자열 안에서 쌍따옴표(")와 홑따옴표(')를 같이 사용해야 할때,

또는 쌍따옴표(")로 감싸진 문자열 안에서 쌍따옴표(")를 표시해야 할때,

또는 홑따옴표(')로 감싸진 문자열 안에서 홑따옴표(')를 표시해야 할때,

 

위와 같이 escape 문자를 사용합니다.

 

escape문자는 문자열에서 특수문자를 표현하기 위한 특별한 방법입니다.

문자열에서 따옴표를 표현하기 위해서, 따옴표 앞에 '\' 문자를 붙여줍니다.

 

 

템플릿 문자열(Template String) 사용하기 (feat ES6)

 

 

마지막으로 템플릿 문자열을 활용하는 방법을 소개합니다.

템플릿 문자열은 ES6 문법입니다.

템플릿 문자열은 기본적으로 상수를 제외한 나머지 문자열을 입력한 그대로 반환합니다.

그래서 따옴표를 입력하면, 입력한 그대로 문자열을 생성합니다.

템플릿 문자열은, 이 외에도 여러가지 기능이 있지만 여기서는 이 정도만 소개합니다.

 

템플릿 문자열은 'back-tick(`)'으로 감싸서 생성합니다.

back-tick은 홑따옴표와 비슷해 보이지만, 홑따옴표와는 다르고, 키보드의 왼쪽 상단, ESC키 아래의 키로 입력합니다.

 

 

 

 


  1. No Image 11Sep
    by
    2016/09/11 Views 6003 

    부드럽게 페이지 이동하기

  2. No Image 22Dec
    by
    2016/12/22 Views 7912 

    복사방지+드래그금지+마우스우클릭 금지

  3. No Image 03Feb
    by
    2015/02/03 Views 5951 

    버튼 삭제

  4. No Image 03Feb
    by
    2015/02/03 Views 6408 

    배열의 리터럴 선언, 또다른 배열 선언 방법!

  5. No Image 16Jan
    by
    2019/01/16 Views 1051 

    배열과 Array객체

  6. No Image 01Mar
    by
    2014/03/01 Views 5911 

    배너 램덤으로 부여주기

  7. No Image 04Jul
    by
    2018/07/04 Views 1849 

    반복문 사용할때 태그 식별하기 data-item

  8. 바닐라 JS, ECMAScript 개념

  9. No Image 27Feb
    by
    2014/02/27 Views 6366 

    미디어플레이어 화면크기 조절방법

  10. 문자열 안에 쌍따옴표, 홑따옴표 표시하는 3가지 방법

  11. No Image 03Feb
    by
    2015/02/03 Views 5729 

    문자열 바꾸기

  12. No Image 01Sep
    by
    2016/09/01 Views 6747 

    모바일 홈페이지로 자동 이동하는 방법....

  13. No Image 27Feb
    by
    2014/02/27 Views 7003 

    마우스를 오버해서 이미지를 확대해서 보기

  14. No Image 03Feb
    by
    2015/02/03 Views 6530 

    마우스로 이미지크기 조절(자바스크립트)

  15. No Image 01Mar
    by
    2014/03/01 Views 6226 

    마우스대면 글자 없어지는 검색창

  16. No Image 12Jan
    by
    2023/01/12 Views 118 

    마우스 오른쪽버튼 , 드래그 선택 차단

  17. No Image 19Jun
    by
    2015/06/19 Views 8577 

    마우스 드래그, 오른쪽 팝업메뉴, 선택 막기 (IE11, 파이어폭스, 크롬 확인)

  18. No Image 16Jan
    by
    2019/01/16 Views 1179 

    랜덤(Random) / 난수 만들기

  19. No Image 29Apr
    by
    2019/04/29 Views 11051 

    랜덤 배너 노출 스크립트

  20. No Image 01Mar
    by
    2014/03/01 Views 12671 

    라디오버튼 선택 체크여부 radio checked

Board Pagination Prev 1 2 3 4 5 6 7 8 9 10 ... 13 Next
/ 13

하단 정보를 입력할 수 있습니다

© k2s0o1d4e0s2i1g5n. All Rights Reserved