JAVASCRIPT

자바스크립트 문자열 메서드에 대해 알아봅시다!

김도현2 2023. 4. 22. 22:21
반응형

자바스크립트 문자열 메서드에 대해 알아봅시다! 

at(), charAt(), charCodeAt(), charPointAt(), concat(), localeCompare(), normalize(), padEnd(), padStart(), repeat()

 

 

 

 

01. at( )

"문자열".at(검색값)
  • 메서드는 지정한 숫자(index)를 받아, 문자열에서 해당 되는 인덱스의 요소를 반환합니다.
  • 대소문자를 구별을 안합니다.
{
    "javascript reference".at(0);   //j
    "javascript reference".at(1);   //a
    "javascript reference".at(2);   //v
    "javascript reference".at(-1);  //e
    "javascript reference".at(-2);  //e
    "javascript reference".at("java");  //j
    "javascript reference".at("Java");  //j
    "javascript reference".at("refer"); //j
    "javascript reference".at("REfer"); //j
}

 

 

 

02. charAt( )

"문자열".charAt(검색값)
  • 메서드는 문자열 포함 여부를 검색하여, 지정된 인덱스 위치에 있는 문자 하나를 반환합니다.
  • 문자열을 검색하여, 주어진 값과 일치하는 것이 없거나 음수는 빈문자열 반환합니다.
  • 대소문자를 구별을 안합니다.
{
    "javascript reference".charAt(0);    //j
    "javascript reference".charAt(1);   //a
    "javascript reference".charAt(2);   //v
    "javascript reference".charAt(25);   //
    "javascript reference".charAt(-1);  //
    "javascript reference".charAt(-2);  //
    "javascript reference".charAt("java");  //j
    "javascript reference".charAt("Java");  //j
    "javascript reference".charAt("refer"); //j
    "javascript reference".charAt("REfer"); //j
}

 

 

 

03. charCodeAt( )

"문자열".charCodeAt(검색값)
  • 메서드는 지정한 숫자(index)를 받아, 문자열에서 해당 되는 인덱스의 유니코드 정수 값을 반환합니다.
  • 문자열을 검색하여, 주어진 값과 일치하는 것이 없거나 음수는 'NaN' 을 반환합니다.
  • 대소문자를 구별을 안합니다.
{
    "javascript reference".charCodeAt(0);    //106
    "javascript reference".charCodeAt(1);   //97
    "javascript reference".charCodeAt(2);   //118
    "javascript reference".charCodeAt(25);   //NaN
    "javascript reference".charCodeAt(-1);  //NaN
    "javascript reference".charCodeAt(-2);  //NaN
    "javascript reference".charCodeAt("java");  //106
    "javascript reference".charCodeAt("Java");  //106
    "javascript reference".charCodeAt("refer"); //106
    "javascript reference".charCodeAt("REfer"); //106
}

 

 

 

04. codePointAt( )

"문자열".codePointAt(검색값, [위치값])
  • 메서드는 지정한 숫자(index)를 받아, 문자열에서 해당 되는 인덱스의 유니코드 포인트 정수 값을 반환합니다.
  • 문자열을 검색하여, 주어진 값과 일치하는 것이 없거나 음수는 'undefined' 을 반환합니다.
  • 대소문자를 구별을 안합니다.
{
    "javascript reference".codePointAt(0);    //106
    "javascript reference".codePointAt(1);   //97
    "javascript reference".codePointAt(2);   //118
    "javascript reference".codePointAt(25);   //undefined
    "javascript reference".codePointAt(-1);  //undefined
    "javascript reference".codePointAt(-2);  //undefined
    "javascript reference".codePointAt("java");  //106
    "javascript reference".codePointAt("Java");  //106
    "javascript reference".codePointAt("refer"); //106
    "javascript reference".codePointAt("REfer"); //106
}

 

 

 

05. concat( )

"문자열".concat(문자열2, 문자열3)
  • 메서드는 매개변수로 전달된 문자열을 받어, 결합된 새로운 문자열을 반환합니다.
  • 호출된 문자열은 변경되지 않습니다
{
    const str1 = "Hello";
    const str2 = "world";
    const str3 = "!";
    const result = str1.concat(" ", str2, str3);

    console.log(result); // "Hello world!"
    console.log(str1);   // "Hello"
    console.log(str2);   // "world"
    console.log(str3);   // "!"
}

 

 

 

 

06. localeCompare( )

"문자열1".localeCompare("문자열2")
  • 메서드는 문자열과 문자열을 비교하여, 수치(음수, 양수, 0)을 반환합니다.
  • -1 : 호출된 문자열이 다른 문자열보다 작은 순서에 있습니다.
  • 0 : 호출된 문자열과 다른 문자열이 동일한 순서에 있습니다.
  • 1 : 호출된 문자열이 다른 문자열보다 큰 순서에 있습니다.
{
    const str1 = "apple";
    const str2 = "banana";
    const str3 = "city";

    console.log(str1.localeCompare(str2)); // -1
    console.log(str2.localeCompare(str1)); // 1
    console.log(str1.localeCompare(str1)); // 0
    console.log(str1.localeCompare(str3)); // -1
    console.log(str3.localeCompare(str1)); // 1
}

 

 

 

 

07. normalize( )

"문자열".normalize([form])
  • 메서드는 주어진 문자열을 정규화된 형태로 반환합니다.
  • form은 NFC, NFD, NFKC, NFKD 중 하나일 수 있으며, 기본값은 NFC입니다.
  • 문자열의 유니코드 표준화를 수행하여 문자열에서 결합 문자, 분리 문자 등의 다양한 문자를 단일 문자로 변환합니다.
{
    const str1 = "caf\u00e9";
    const str2 = "cafe\u0301";

    console.log(str1 === str2);                    // false
    console.log(str1.normalize() === str2.normalize());  // true
    console.log(str1.normalize());  //café
    console.log(str2.normalize());  //café
    console.log(str1.normalize('NFD')); //café
    console.log(str1.normalize('NFKC'));    //café
    console.log(str1.normalize('NFKD'));    //café
}

 

 

 

 

08. padEnd( )

"문자열".padEnd(문자열 길이, [추가 문자열])
  • 메서드는 주어진 길이에 맞게 뒤 문자열을 채우고, 새로운 문자열을 반환합니다.
  • 추가되는 문자열은 기본값으로 공백 문자열(' ')입니다.
{
    const str = "hello";

    console.log(str.padEnd(10));             // "hello     "
    console.log(str.padEnd(10, '-'));        // "hello-----"
    console.log(str.padEnd(6, '★'));       // "hello★"
    console.log(str.padEnd(3, '_'));        // "hello"
}

 

 

 

 

09. padStart( )

"문자열".padStart(문자열 길이, [추가 문자열])
  • 메서드는 주어진 길이에 맞게 뒤 문자열을 채우고, 새로운 문자열을 반환합니다.
  • 추가되는 문자열은 기본값으로 공백 문자열(' ')입니다.
{
    const str = "hello";

    console.log(str.padStart(10));             // "     hello"
    console.log(str.padStart(10, '-'));        // "-----hello"
    console.log(str.padStart(6, '★'));       // "★hello"
    console.log(str.padStart(3, '_'));        // "hello"
}

 

 

 

 

10. repeat( )

"문자열".repeat(반복 횟수)
  • 메서드는 주어진 횟수만큼 반복 복사하여, 새로운 문자열을 반환합니다.
  • (반복 횟수) 는 반드시 0 이상의 정수 값이어야 합니다.
{
    const str = "hello";
    const str2 = "world";

    console.log(str.repeat(3)); // "hellohellohello"
    console.log(str.repeat(0)); // ""
    console.log(str2.repeat(5)); // "worldworldworldworldworld"
    console.log(str2.repeat(1)); // "world"
}

 

 

 

 

 

문자열 객체를 알아봤습니다!