JAVASCRIPT

문자열 메서드

Hyeon been 2023. 4. 22. 14:32

한번씩 읽고 가세요.

“ 지연되는 프로젝트에 인력을 더 투입하면 오히려 더 늦어진다. ”

- Frederick Philips Brooks
Mythical Man-Month 저자
728x90

문자열 메서드

 

01. 문자열 메서드 : at()

"문자열".at()
문자열에서 지정된 인덱스에 있는 문자를 반환합니다. 인덱스가 음수이면 문자열의 끝에서부터 거꾸로 인덱싱됩니다.

        const str = 'hello';
        console.log(str.at(1)); // 'e'
        console.log(str.at(-1)); // 'o'


02. 문자열 메서드 : charAt()


"문자열".charAt()
문자열에서 지정된 인덱스에 있는 문자를 반환합니다.
인덱스가 문자열의 길이보다 크거나 같으면 빈 문자열을 반환합니다.

    const str = 'hello';
    console.log(str.at(1)); // 'e'
    console.log(str.at(-1)); // 'o'


03. 문자열 메서드 : charCodeAt()


"문자열".charCodeAt()
문자열에서 지정된 인덱스에 있는 문자의 유니코드 값을 반환합니다.
인덱스가 문자열의 길이보다 크거나 같으면 NaN을 반환합니다.

    const str = 'hello';
    console.log(str.charCodeAt(1)); // 101 (e의 유니코드 값)
    console.log(str.charCodeAt(10)); // NaN


04. 문자열 메서드 : charCodeAt()

 


"문자열".charCodeAt()
메서드: 문자열에서 지정된 인덱스에 있는 문자의 유니코드 코드 포인트 값을 반환합니다.
인덱스가 문자열의 길이보다 크거나 같으면 undefined를 반환합니다.

    const str = '👋🏻hello';
    console.log(str.codePointAt(0)); // 128075 (👋의 코드 포인트 값)
    console.log(str.codePointAt(2)); // 104 (h의 코드 포인트 값)
    console.log(str.codePointAt(10)); // undefined

 

 

05. 문자열 메서드 : concat()


"문자열".concat()
인수로 전달된 문자열들을 현재 문자열과 연결한 새로운 문자열을 반환합니다.

    const str1 = 'hello';
    const str2 = 'world';
    console.log(str1.concat(' ', str2)); // 'hello world'


06. 문자열 메서드 : .includes(검색값, [위치값])


"문자열".includes()
문자열 포함 여부를 검색하여, 불린(true, false)을 반환합니다.
대소문자를 구별합니다.

    console.log( "javascript reference".includes("javascript"))
    console.log( "javascript reference".includes("J"))
    console.log( "javascript reference".includes("j"))
    console.log( "javascript reference".includes("a"))
    console.log( "javascript reference".includes("reference",11))
    console.log( "javascript reference".includes("reference",12))


07. 문자열 메서드 : .indexOf()(검색값, [위치값])


"문자열".indexOf()

문자열을 검색하여, 주어진 값과 일치하는 첫 번째 위치값(index)을 반환합니다.
문자열을 검색하여, 주어진 값과 일치하는 것이 없으면 -1을 반환합니다.
대소문자를 구별합니다.

    console.log("javascript refercence".indexOf("javascripts"))  //-1
    console.log("javascript refercence".indexOf("j"))  //0
    console.log("javascript refercence".indexOf("J"))  //-1
    console.log("javascript refercence".indexOf("a"))  //1
    console.log("javascript refercence".indexOf("ja"))  //0
    console.log("javascript refercence".indexOf("jv"))  //-1
    console.log("javascript refercence".indexOf("refercence"))  //11
    console.log("javascript refercence".indexOf("r"))  //6
    console.log("javascript refercence".indexOf("re"))  //11
    
    console.log("javascript refercence".indexOf("javascripts",0))  //0
    console.log("javascript refercence".indexOf("javascripts",1))  //-1
    console.log("javascript refercence".indexOf("refercence",0))  //11
    console.log("javascript refercence".indexOf("refercence",11))  //11
    console.log("javascript refercence".indexOf("refercence",12))  //-1
    console.log("javascript refercence".indexOf("r",7))  //11
    console.log("javascript refercence".indexOf("r",12))  //15


08. 문자열 메서드 : .lastIndexOf()


"문자열".lastIndexOf()
문자열을 역순으로 검색하여, 주어진 값과 일치하는 첫 번째 위치값(index)을 반환합니다.
문자열을 역순으로 검색하여, 주어진 값과 일치하는 것이 없으면 -1을 반환합니다.
대소문자를 구별합니다.

    console.log("javascript refercence".indexOf("javascript"))  //0
    console.log("javascript refercence".indexOf("javascripts"))  //-1
    console.log("javascript refercence".indexOf("j"))  //0
    console.log("javascript refercence".indexOf("J"))  //-1
    console.log("javascript refercence".indexOf("a"))  //1
    console.log("javascript refercence".indexOf("ja"))  //0
    console.log("javascript refercence".indexOf("jv"))  //-1
    console.log("javascript refercence".indexOf("refercence"))  //11
    console.log("javascript refercence".indexOf("r"))  //6
    console.log("javascript refercence".indexOf("re"))  //11
    
    console.log("javascript refercence".indexOf("javascripts",0))  //0
    console.log("javascript refercence".indexOf("javascripts",1))  //-1
    console.log("javascript refercence".indexOf("refercence",0))  //11
    console.log("javascript refercence".indexOf("refercence",11))  //11
    console.log("javascript refercence".indexOf("refercence",12))  //-1
    console.log("javascript refercence".indexOf("r",7))  //11
    console.log("javascript refercence".indexOf("r",12))  //15


09. 문자열 메서드 : .localeCompare()


"문자열".localeCompare()
현재 문자열과 인수로 전달된 문자열을 유니코드 순서로 비교합니다.
현재 문자열이 전달된 문자열보다 작으면 음수를, 같으면 0을, 크면 양수를 반환합니다.

    const str1 = 'hello';
    const str2 = 'world';
    console.log(str1.localeCompare(str2)); // -1
    console.log(str2.localeCompare(str1)); // 1
    console.log(str1.localeCompare(str1)); // 0

 

10. 문자열 메서드 : . match()


"문자열". match()
문자열(정규식)을 검색하고, 문자값(배열)을 반환합니다.
문자열을 검색하여, 주어진 값과 일치하는 것이 없으면 null을 반환합니다.
대소문자를 구별합니다.
match() 메서드는 문자값(배열)을 반환하고, search() 메서드는 위치값(숫자)를 반환하는 것이 다릅니다.

    console.log( "javascript reference".match("javascript"))  //"javascript"
    console.log( "javascript reference".match("reference"))   //"reference"
    console.log("javascript reference".match("r"))            //"r"
    console.log("javascript reference".match("R"))            //null
    console.log("javascript reference".match(/R/i))            //null
    console.log("javascript reference".match(/reference/))    //"reference"     
    console.log("javascript reference".match(/r/g))            //"r r r"


11. 문자열 메서드 : .matchAll()


"문자열".matchAll()
메서드는 문자열에서 정규 표현식과 매치되는 모든 부분을 찾아 이를 반복 가능한(iterable) 객체로 반환합니다.
반복 가능한 객체에서 반환되는 값은 match() 메서드가 반환하는 배열과 유사한 형태를 갖고 있습니다.

    const str = 'hello world';
    const regex = /\w+/g;
    const matches = str.matchAll(regex);
    
    for (const match of matches) {
      console.log(match);
    }
    // 출력 결과:
    // ["hello", index: 0, input: "hello world"]
    // ["world", index: 6, input: "hello world"]

 

각 매치 객체(match object)는 다음과 같은 속성을 가지고 있습니다.

  • 0: 매치된 전체 문자열
  • index: 매치된 문자열의 시작 인덱스
  • input: 검색 대상이 되는 원본 문자열

12. 문자열 메서드 : .normalize()


"문자열".normalize()
현재 문자열의 유니코드 정규화 형식을 반환합니다.
유니코드 정규화는 문자열에서 등장하는 문자들을 일관된 형식으로 변환하는 것을 말합니다.

    const str = 'n\u0303';
    console.log(str.normalize()); // 'ñ'


13. 문자열 메서드 : .padEnd()


"문자열".padEnd()
현재 문자열의 끝에 지정된 길이만큼 다른 문자열을 추가한 새로운 문자열을 반환합니다.
추가할 문자열은 필수적으로 전달되어야 합니다. 만약 현재 문자열의 길이가 지정된 길이보다 크거나 같으면 현재 문자열을 그대로 반환합니다.

    const str = 'hello';
    console.log(str.padEnd(10, '.')); // 'hello.....'


14. 문자열 메서드 : .padStart()


"문자열".padStart()
현재 문자열의 시작 부분에 지정된 길이만큼 다른 문자열을 추가한 새로운 문자열을 반환합니다.
추가할 문자열은 필수적으로 전달되어야 합니다. 만약 현재 문자열의 길이가 지정된 길이보다 크거나 같으면 현재 문자열을 그대로 반환합니다.

    const str = 'hello';
    console.log(str.padStart(10, '.')); // '.....hello'


15. 문자열 메서드 : .repeat()


"문자열".repeat()
현재 문자열을 지정된 횟수만큼 반복한 새로운 문자열을 반환합니다.
반복 횟수는 0 이상의 정수여야 합니다.

    const str = 'hello';
    console.log(str.repeat(3)); // 'hellohellohello'


18. 문자열 메서드 : .search()


"문자열".search()
문자열(정규식)을 검색하고, 위치값(숫자)을 반환합니다.
문자열을 검색하여, 주어진 값과 일치하는 것이 없으면 -1을 반환합니다.
대소문자를 구별합니다.

    console.log( "javascript reference".search("javascript"))  //0
    console.log( "javascript reference".search("reference"))   //11
    console.log("javascript reference".search("r"))            //6
    console.log("javascript reference".search("a"))
    console.log("javascript reference".search("jv"))
    console.log("javascript reference".search("J"))

    console.log("javascript reference".search(/reference/))
    console.log("javascript reference".search(/Reference/))        
    console.log("javascript reference".search(/reference/i))      //11
    console.log("javascript reference".search(/Reference/i))      //-1
    console.log("자바스크립트".search(/[a-z]/g))                   //11
    console.log("javascript reference".search(/[a-z]/g))          //0


19. 문자열 메서드 : .slice(시작위치, [끝나는 위치])


"문자열".slice(시작위치, [끝나는 위치])
시작 위치에서 종료 위치 값을 추출하여, 새로운 문자열을 반환합니다.

    "javascript".slice(0)
    console.log("javascript".slice(0))     //javascript
    console.log("javascript".slice(1))    //avascript
    console.log("javascript".slice(5,10)) //cript
    console.log("javascript".slice(-3,-1)) //ip
    console.log("javascript".slice(-5,-2)) //cri


22. 문자열 메서드 : .split(시작위치, [끝나는 위치])


"문자열".split(시작위치, [끝나는 위치])
구분자를 이용하여, 여러개의 문자열(배열)을 반환합니다.

 

    console.log("javascript".split("")) //['j', 'a', 'v', 'a', 's', 'c', 'r', 'i', 'p', 't']
    console.log("jav ascr ipt".split(" ")) //['jav', 'ascr', 'ipt']
    console.log("javascript".split("",1)) //['j']
    console.log("javascript".split("",2)) //['j', 'a']
    console.log("java script".split(" ", 1)) //['java']
    console.log("java script".split(" ", 2)) //['java', 'script']
    console.log("java script".split(" ")) //['java', 'script']

    console.log("javascript".split("j")) //['', 'avascript']
    console.log("javascript".split("a")) //['j', 'v', 'script']
    console.log("javascript".split("e")) //['javascript']
    console.log("java/scr/ipt".split("/")) //['java', 'scr', 'ipt']
    console.log("java&scr!ipt".split(/&|\!/)) //['java', 'scr', 'ipt']
    console.log("java&scr!ipt".split("&")) //['java', 'scr', 'ipt']
    --체인
    console.log("javascript".split("").join(""))  //j,a,v,a,s,c,r,i,p,t  join을 넣어 배열이 아닌 문자열
    console.log("javascript".split("").join("*"))  //j,a,v,a,s,c,r,i,p,t  
    console.log("javascript".split("").reverse().join("/"))  // t/p/i/r/c/s/a/v/a/j   reverse는 배열만


30. 문자열 메서드 : .trim()


"문자열".trim()
문자열 앞/뒤 공백을 제거하고 새로운 문자열을 반환 합니다.

    console.log("javascript".trim(""))   //"javascript"
    console.log(" javascript".trim(" "))  //"javascript"
    console.log("javascript ".trim(""))  //"javascript"


31. 문자열 메서드 : .trimStart()


"문자열".trimStart()
문자열 앞 공백을 제거하고 새로운 문자열을 반환 합니다.

    console.log(" javascript ".trimStart(""))   //"javascript "


32. 문자열 메서드 : .trimEnd()


"문자열".trimEnd()
문자열 뒤 공백을 제거하고 새로운 문자열을 반환 합니다.

    console.log(" javascript ".trimEnd(""))   //" javascript"