자바스크립트 문자열 객체 완벽 가이드

자바스크립트의 문자열 객체

안녕하세요:)

오늘은 자바스크립트에서 자주 사용하는 **문자열 객체(String)**에 대해 배워볼 거예요. 문자열 객체는 텍스트 데이터를 쉽게 다루고 조작할 수 있게 해주는 다양한 메서드를 제공해요. 함께 알아볼까요? 🚀

 

.split([separator[,limit]])

split 메서드는 문자열을 지정한 구분자(separator)로 나눠서 배열로 반환해요.

let url = 'https://www.naver.com';
let splitArr = url.split("://");
console.log(splitArr); // ['https', 'www.naver.com']

 

.charAt(index)

charAt 메서드는 지정한 인덱스에 해당하는 문자를 반환해요.

let url = 'https://www.naver.com';
let char = url.charAt(4);
console.log(char); // 's'

 

.concat(str1, str2, str3, [,..., strN])

concat 메서드는 매개변수로 전달된 문자열들을 하나의 문자열로 합쳐서 반환해요.

let url = 'https://www.naver.com';
let infoUrl = url.concat('/main/info');
console.log(infoUrl); // 'https://www.naver.com/main/info'

 

.indexOf(searchValue[, fromIndex])

indexOf 메서드는 주어진 값(searchValue)을 찾아, 문자열 내에서 처음으로 나타나는 인덱스를 반환해요. 찾지 못하면 -1을 반환해요.

let url = 'https://www.naver.com';
let findIndex = url.indexOf("naver");
console.log(findIndex); // 12

 

.includes(searchValue[, position])

includes 메서드는 주어진 값(searchValue)이 문자열에 포함되어 있는지 여부를 확인해요. 포함되어 있으면 true, 아니면 false를 반환해요.

let url = 'https://www.naver.com';
let find = url.includes("naver");
let find2 = url.includes("naver", 12);
console.log(find); // true 
console.log(find2); // true

 

.slice(beginIndex[, endIndex])

slice 메서드는 문자열의 일부를 추출하여 새로운 문자열로 반환해요. beginIndex부터 endIndex 전까지 추출해요. endIndex가 생략되면 문자열의 끝까지 추출해요.

---

연습문제

let url = 'https://www.naver.com';

// 1. 프로토콜 분리하기
{
  let protocol = url.split("://")[0];
  console.log(protocol); // 'https'
}

// 2. 도메인 분리하기
{
  let domain = url.split("://")[1];
  console.log(domain); // 'www.naver.com'
}

// 3. 특정 위치의 문자 가져오기
{
  let char = url.charAt(8);
  console.log(char); // 'w'
}

// 4. URL에 "/main/info" 추가하기
{
  let infoUrl = url.concat('/main/info');
  console.log(infoUrl); // 'https://www.naver.com/main/info'
}

// 5. 'naver' 문자열이 URL에 있는지 확인하기
{
  let hasNaver = url.includes("naver");
  console.log(hasNaver); // true
}

// 6. 'naver' 문자열의 시작 위치 찾기
{
  let naverIndex = url.indexOf("naver");
  console.log(naverIndex); // 12
}

// 7. URL의 프로토콜 부분만 잘라내기
{
  let protocolPart = url.slice(0, 5);
  console.log(protocolPart); // 'https'
}

// 8. 도메인 부분만 잘라내기
{
  let domainPart = url.slice(8);
  console.log(domainPart); // 'www.naver.com'
}