[javascript] 문자열 결합 / 템플릿 문자열

문자열 : 문자열 결합 / 템플릿 문자열

변수는 데이터를 저장하는 저장소 입니다. 이 저장소에는 숫자, 문자, 함수, 객체 등을 저장할 수 있습니다.

문자열 좌우에서 공백을 제거, trim(),trimStart(),trimEnd()

템플릿 문자열은 간단하게 말해서 내장된 표현식을 허용하는 문자열 리터럴이다. 중괄호를 리터럴이라고 하고 ${} 리터럴 안에 변수를 넣는다.

//01
    const str1 = "자바스크립트";
    const str2 = "제이쿼리";

    document.querySelector(".sample01_N1").innerHTML = "1";
    document.querySelector(".sample01_Q1").innerHTML = "자바스크립트, 제이쿼리";
    document.querySelector(".sample01_M1").innerHTML = "문자열(string) 결합";
    document.querySelector(".sample01_P1").innerHTML = str1 + str2;


//02
    const num1 = 100;
    const num2 = 200;

    document.querySelector(".sample01_N2").innerHTML = "2";
    document.querySelector(".sample01_Q2").innerHTML = "100, 200";
    document.querySelector(".sample01_M2").innerHTML = "숫자(number) 결합";
    document.querySelector(".sample01_P2").innerHTML = num1 + num2;

//03
    const text1 = "모던";
    const text2 = "자바스크립트";
    const text3 = "핵심";

    //나는 모던(modern) 자바스크립트(javascrript) 핵심을 배우고 싶다. 출력해보기

    document.querySelector(".sample01_N3").innerHTML = "3";
    document.querySelector(".sample01_Q3").innerHTML = "모던, 자바스크립트, 핵심";
    document.querySelector(".sample01_M3").innerHTML = "문자열(string) 결합";
    document.querySelector(".sample01_P3").innerHTML = "나는 " + text1 + "(modern)" + text2 + "(javascript)" + text3 + "을 배우고 싶다.";

    
//04
    document.querySelector(".sample01_N4").innerHTML = "4";
    document.querySelector(".sample01_Q4").innerHTML = "모던, 자바스크립트, 핵심";
    document.querySelector(".sample01_M4").innerHTML = "템플릿 문자열";
    document.querySelector(".sample01_P4").innerHTML = `나는 ${text1}(modern) ${text2}(javascrript) ${text3}을 배우고 싶다.`;

결과보기

번호	기본값	메서드	리턴값