String 데이터에 사용할 수 있는 표준 내장 객체중, 자주 쓰는 것들을 정리한 글입니다.
length
const msg1 = 'Hello World'
console.log(msg1.length) // 11
// 응용 예시
const msg2 = 'The quick brown fox jumps over the lazy dog'
const h1El = document.querySelector('h1')
h1El.textContent = msg2.length>20? `${msg.slice(0,20)}...`:msg2
- 문자의 길이를 숫자로 반환합니다.
includes
const msg1 = 'Hello World!'
const msg2 = 'The quick brown fox jumps over the lazy dog.'
console.log(msg1.includes('!')) // true
console.log(msg1.includes('dog')) // false
console.log(msg2.includes('dog')) // true
- String 데이터 안에 특정 문자가 포함되는지를 확인하여 boolean으로 반환합니다.
replace
const msg1 = 'Hello world!'
const msg2 = 'The quick brown fox jumps over the lazy dog.'
// 'Hello everyone!'
console.log(msg1.replace('world','everyone'))
// 'The quick brown fox jumps over the lazy cat.'
console.log(msg2.replace('dog','cat'))
console.log(msg1) // 'Hello world!'
console.log(msg2) // 'The quick brown fox jumps over the lazy dog.'
// 'Thequick brown fox jumps over the lazy cat.'
console.log(msg2.replace(' ',''))
// 'Thequickbrownfoxjumpsoverthelazycat.'
console.log(msg2.replaceAll(' ',''))
- String 데이터의 일부 부분을 지정한 값으로 교체한 문자데이터를 반환합니다.
- String 데이터 원본을 바꾸는 것은 아니며, 바뀐 데이터를 반환하기만 합니다.
- 모든 문자열을 교체하는것이 아닌, 가장 먼저 발견된 문자열만을 교체해주며,
모든 문자열을 교체하고 싶다면 replaceAll() 메서드를 사용해야 합니다.
slice
const msg1 = 'Hello world!'
const msg2 = 'The quick brown fox jumps over the lazy dog.'
console.log(msg1.slice(0,5)) // 'Hello'
console.log(msg1.slice(6,-1)) // 'world'
console.log(msg1.slice(5)) // 'world'
console.log(msg2.slice(10,19)) //'brown fox'
console.log(msg2.slice(35,-1)) // 'lazy dog'
- 문자를 지정한 범위만큼 추출하여 반환합니다.
- String 데이터 원본을 바꾸는 것은 아니며, 추출한 데이터를 반환하기만 합니다.
- slice( a, b ) 라 지정을 한다면 a번째 글자부터 b-1번째 글짜까지 추출합니다.
- 범위는 0부터 n-1 까지 설정됩니다. ( 0 : 맨 첫번째 , 1 : 두번째 .... )
- 범위를 음수로 지정한다면 맨 뒤쪽을 기준으로 지정됩니다.
ex) -1 : 뒤에서 첫번째 글자, -3 : 뒤에서 세번째 글자
split
const msg1 = 'Hello world!'
const msg2 = 'The quick brown fox jumps over the lazy dog.'
console.log(msg1.split(' ')) // ['Hello', 'world!']
console.log(msg2.split(' ')) //['The','quick','brown','fox','jumps','over','the','lazy','dog']
console.log(msg1.split('')) // ['H','e','l','l','o',' ','w','o','r','l','d','!']
- 특정 문자를 기준으로 문자열들을 나눈 배열데이터를 반환합니다.
- 마찬가지로, 원본을 바꾸지는 않습니다.
toUpperCase & toLowerCase
const msg = 'Hello world!'
console.log(msg.toUpperCase()) // 'HELLO WORLD!'
console.log(msg.toLowerCase()) // 'hello world!'
console.log(msg) // 'Hello world!'
- 문자 데이터를 대문자 / 소문자 로 바꾼 문자열을 반환하는 메서드입니다.
- 원본을 바꾸지는 않습니다.
trim
const msg = ' Hello world! '
console.log(msg.trim()) // 'Hello world!'
console.log(msg) // ' hello world! '
- 문자의 앞 뒤 공백을 제거하여 반환하는 메서드입니다.
- 원본을 바꾸지는 않습니다.
'자바스크립트' 카테고리의 다른 글
JavaScript 표준 내장 객체 - Math (0) | 2024.04.12 |
---|---|
JavaScript 표준 내장 객체 - Number (0) | 2024.04.12 |
JavaScript 함수 - 호출 스케줄링 (0) | 2024.04.11 |
JavaScript 함수 - 화살표함수 와 콜백함수, 즉시실행함수 (0) | 2024.04.10 |
JavaScript 함수 - 함수의 반환과 매개변수 (0) | 2024.04.10 |