JavaScript

String Method

히찔 2022. 5. 13. 17:28

 

String Method

 

String.indexOf() / String.lastIndexOf()

  • String.indexOf(): String 객체에서 주어진 값과 일치하는 첫 번째 인덱스를 반환한다.
  • String.lastIndexOf(): String 객체에서 주어진 값과 일치하는 마지막 인덱스를 반환한다.
  • 일치하는 값이 없으면 -1을 반환한다.
  • 문자열을 찾을 때 대소문자를 구분한다.
  • 첫 번째 인자: 찾으려는 문자열(주어지지 않으면 “undefined”를 찾음)
    두 번째 인자: 문자열에서 찾기 시작하는 위치를 나타내는 인덱스 값 (생략가능)
// 구문
str.indexOf(searchValue[, fromIndex])

const str = "abcDEFabc"
str.indexOf('abc')     // 0  -> 자바스크립트에서 인덱스는 0부터 시작
str.indexOf('abcd')    // -1 -> 문자열을 비교할 때 문자의 대소문자를 구분
str.indexOf('abc', 3)  // 6  -> 인덱스 3부터 'abc'를 찾기 시작

 

String.substring()

  • String 객체의 시작 인덱스로 부터 종료 인덱스 전 까지 문자열의 부분 문자열을 반환한다.
  • 첫 번째 인자: 반환 문자열의 시작 인덱스
    두 번째 인자: 반환 문자열의 마지막 인덱스 (생략가능, 생략 시 문자열의 끝까지 모든 문자 반환)
// 구문
str.substring(indexStart[, indexEnd])

const str = "abcDEFabc"
str.substring(2, 6); // cDEF

 

String.charAt()

  • 문자열에서 특정 인덱스(인수로 전달한 값)에 위치하는 문자를 반환한다.
  • 인자가 문자열의 범위(0 ~ (문자열 길이 - 1))를 벗어난 경우 빈문자열을 반환한다.
  • 인자를 생략하면 기본값으로 0를 설정되고 첫 문자를 반환한다.
const str = 'Hello'
console.log(str.charAt(0)) // H 
console.log(str.charAt(1)) // e 
console.log(str.charAt(2)) // l 
console.log(str.charAt(3)) // l 
console.log(str.charAt(4)) // o 

// 지정한 index가 범위(0 ~ str.length-1)를 벗어난 경우 빈문자열을 반환
console.log(str.charAt(5)) // ''

 

String.replace()

  • 첫번째 인수로 전달한 문자열 또는 정규표현식을 String 객체에서 검색하여 두번째 인수로 전달한 문자열로 대체한다.
  • 원본 문자열은 변경되지 않고 결과가 반영된 새로운 문자열을 반환한다.
  • 검색된 문자열이 여러개가 존재할 경우 첫번째로 검색된 문자열만 대체된다.
// 구문
let newStr = str.replace(regexp|substr, newSubstr|function)

const str = 'Hello world'

// 첫번째로 검색된 문자열만 대체하여 새로운 문자열을 반환
str.replace('world', 'Hizini') // Hello Hizini 

// 특수한 교체 패턴 사용 가능 ($& => 검색된 문자열) 
str.replace('world', '<strong>$&</strong>') // Hello <strong>world</strong> 

/* 정규표현식 
g(Global): 문자열 내의 모든 패턴을 검색한다. 
i(Ignore case): 대소문자를 구별하지 않고 검색한다. */ 
str.replace(/hello/gi, 'Hizini') // Hizini world

.replace(' ','') // 첫번째 공백 제거
.replace(/\\-/g,'') // 특정문자 제거1 (-)
.replace(/,/g,'') // 특정문자 제거2(,)
.replace(/^\\s+/,'') // 앞의 공백 제거
.replace(/\\s+$/,'') // 뒤의 공백 제거
.replace(/^\\s+|\\s+$/g,'') // 앞뒤 공백 제거
.replace(/\\s/g,'') // 문자열 내의 모든 공백 제거
.replace(/\\n/g,'') // n개행 제거
.replace(/\\r/g,'') // 엔터 제거
  • 매개변수가 String일 때 특수한 교체 패턴
    • $` : 문자 대체(replace) 시 일치한 문자 이전 값 참조
    • $’ : 문자 대체(replace) 시 일치한 문자 이후 값 참조
    • $+ : 문자 대체(replace) 시 마지막으로 캡처된 값 참조
    • $& : 문자 대체(replace) 시 일치한 문자 결과 전체 참조
    • $_ : 문자 대체(replace) 시 입력(input)된 문자 전체 참조
    • $n : 문자 대체(replace) 시 n번째 부분 표현식 문자 값 참조 (n은 1~99)

 

String.split()

  • 첫번째 인수로 전달한 문자열 또는 정규표현식을 대상 문자열에서 검색하여 문자열을 구분한 후 분리된 각 문자열로 이루어진 배열을 반환한다.
  • 원본 문자열은 변경되지 않는다.
  • 인수가 없는 경우, 대상 문자열 전체를 단일 요소로 하는 배열을 반환한다.
const str = 'How are you doing?'

// 공백으로 구분하여 배열로 반환
console.log(str.split(' ')) // [ 'How', 'are', 'you', 'doing?' ] 

// 각 문자를 모두 분리
console.log(str.split('')) 
// [ 'H','o','w',' ','a','r','e',' ','y','o','u',' ','d','o','i','n','g','?' ] 

// 정규 표현식 
console.log(str.split(/\\s/)) // [ 'How', 'are', 'you', 'doing?' ] 

// 인수가 없는 경우, 대상 문자열 전체를 단일 요소로 하는 배열을 반환
console.log(str.split()) // [ 'How are you doing?' ] 

// 공백으로 구분하여 배열로 반 (단, 요소수는 3개까지만 허용한다)
console.log(str.split(' ', 3)) // [ 'How', 'are', 'you' ] 

// 'o'으로 구분하여 배열로 반환
console.log(str.split('o')) // [ 'H', 'w are y', 'u d', 'ing?' ]

 

String.slice()

  • 문자열의 일부를 추출하면서 새로운 문자열을 반환한다. (substring과 동일)
  • 단, 음수의 인수를 전달할 수 있다. (substring과 차이)
const str = 'hello world'

// 인수 < 0 또는 NaN인 경우 : 0으로 취급
str.substring(-5) // 'hello world' 
// 뒤에서 5자리를 잘라내어 반환
str.slice(-5) // 'world' 

// 2번째부터 마지막 문자까지 잘라내어 반환 
str.substring(2) // llo world 
str.slice(2) // llo world 

// 0번째부터 5번째 이전 문자까지 잘라내어 반환 
str.substring(0, 5) // hello 
str.slice(0, 5) // hello

 

String.repeat()

  • 문자열을 주어진 횟수만큼 반복해 연결한 새로운 문자열을 반환한다.
  • count가 0이면 빈 문자열을 반환하고 음수이면 RangeError를 발생시킨다.
'abc'.repeat(0) // '' 
'abc'.repeat(1) // 'abc' 
'abc'.repeat(2) // 'abcabc' 
'abc'.repeat(2.5) // 'abcabc' (2.5 → 2) 
'abc'.repeat(-1) // RangeError: Invalid count value

 

String.includes()

  • 인수로 전달한 문자열이 포함되어 있는지를 판별하고, 결과를 true 또는 false로 반환한다.
  • 두번째 인수는 옵션으로 검색할 위치를 나타내는 정수이다.
const str = 'hello world'

str.includes('hello') // true 
str.includes('hello', 0) // true 
str.includes('hello', 2) // false

 

String.toLowerCase()

  • 문자열을 소문자로 변환해 반환한다.
const str = 'Hizini' 
console.log(str.toLowerCase()) // 'hizini'

 

String.toUpperCase()

  • 문자열을 대문자로 변환해 반환한다.
const str = 'Hizini' 
console.log(str.toUpperCase()) // 'HIZINI'

 

String.trim()

  • 문자열 양 끝의 공백을 제거한다.
const str = ' Hizini ' 
console.log(str.trim()) // 'Hizini'
반응형
저작자표시 비영리 동일조건