본문 바로가기
Javascript

소문자 / 대문자 / 공백

by 코딩대원 2022. 8. 17.

문자열 객체

대/소문자와 공백에 관련된 메서드에 대해 알아보는 시간을 가지도록 하겠습니다.


01. toUpperCase() / toLowerCase()

toUpperCase() : 문자열을 대문자로 변경하고, ToLowerCase()는 문자열을 소문자로 변경합니다.

번호 기본값 메서드 리턴값
1 javascript toUpperCase() JAVASCRIPT
2 JAVASCRIPT toLowerCase() javascript

{
    // 02
    {
        const str1 = "javascript";
        const currentStr1 = str1.toUpperCase();
        
        document.querySelector(".sample02_N1").innerHTML = "1";
        document.querySelector(".sample02_Q1").innerHTML = "javascript";
        document.querySelector(".sample02_M1").innerHTML = "toUpperCase()";
        document.querySelector(".sample02_P1").innerHTML = currentStr1;
        
        const str2 = "JAVASCRIPT";
        const currentStr2 = str1.toLowerCase();
        
        document.querySelector(".sample02_N2").innerHTML = "2";
        document.querySelector(".sample02_Q2").innerHTML = "JAVASCRIPT";
        document.querySelector(".sample02_M2").innerHTML = "toLowerCase()";
        document.querySelector(".sample02_P2").innerHTML = currentStr2;
    }
}

02. trim() / trimStart() / trimEnd()

문자열의 앞/뒤 공백을 제거합니다.

번호 기본값 메서드 리턴값
1 javascript trim() javascript
2 javascript trimStart() javascript
3 javascript trimEnd() javascript

{
// 03
{
    const str1 = "      javascript      ";
    const currentStr1 = str1.trim();
    
    document.querySelector(".sample03_N1").innerHTML = "1";
    document.querySelector(".sample03_Q1").innerHTML = str1;
    document.querySelector(".sample03_M1").innerHTML = "trim()";
    document.querySelector(".sample03_P1").innerHTML = currentStr1;
    
    const str2 = "      javascript      ";
    const currentStr2 = str2.trimStart();
    
    document.querySelector(".sample03_N2").innerHTML = "2";
    document.querySelector(".sample03_Q2").innerHTML = str2;
    document.querySelector(".sample03_M2").innerHTML = "trimStart()";
    document.querySelector(".sample03_P2").innerHTML = currentStr2;
    
    const str3 = "      javascript      ";
    const currentStr3 = str3.trimEnd();
   
    document.querySelector(".sample03_N3").innerHTML = "3";
    document.querySelector(".sample03_Q3").innerHTML = str3;
    document.querySelector(".sample03_M3").innerHTML = "trimEnd()";
    document.querySelector(".sample03_P3").innerHTML = currentStr3;
}
}

'Javascript' 카테고리의 다른 글

replace() / replaceAll()  (2) 2022.08.17
split()  (2) 2022.08.17
문자열 결합 / 템플릿 문자열  (2) 2022.08.17
indexOf() / lastIndexOf()  (2) 2022.08.17
문자열 객체 slice() / substring() / substr()  (5) 2022.08.17

댓글


HTML
CSS

JAVASCRIPT

자세히 보기