JS. 문자열 메서드

MJ·2023년 3월 28일
0

Java Script

목록 보기
43/57
post-thumbnail

인수가 필요 없는 메서드

  • 인수란 메서드로 값이 전달되어서 메서드의 동작을 변경하는 입력 값이다.

  • 메서드() 괄호안에 들어가는 데이터가 인수 값이며, 인수가 필요 없는 메서드도 있다.


1. toUpperCase()

  • 전체 문자열을 대문자로 변경해주는 메서드

  • 원본 문자열은 변형되지 않습니다. (비파괴 메서드)

let msg = "hello im jack";

console.log(msg.toUpperCase());	// 결과 : HELLO IM JACK


let uppermsg = msg.toUpperCase();	

console.log(uppermsg);	// 결과 : HELLO IM JACK, 원본 msg 변수에 문자열을 대문자로 변경한 값이 저장 됨



2. toLowerCase()

  • 전체 문자열을 소문자로 변경해주는 메서드

  • 원본 문자열은 변형되지 않습니다. (비파괴 메서드)

let msg = "HELLO IM JACK"

console.log(msg.toLowerCase());	// 결과 : hello im jack



3. trim()

  • 문자열의 처음과 끝에 오는 공백을 제거해주는 메서드

  • 비파괴 메서드

let userInput = "    Hello    "

console.log(userInput.trim());	// 결과 : Hello , 처음과 끝의 모든 공백이 제거 된다.

🔔 메서드는 연속으로 사용할 수 있습니다.
userInput.trim().toUpperCase() 같이 연속사용이 가능함



인수가 필요한 메서드

  • 메서드() 괄호안에 인수값이 존재해야 하는 메서드들을 알아보겠습니다.

1. indexOf()

  • 특정 문자열에 대한 인덱스값, 자리수를 반환합니다.
let brandName = "apple";

console.log(brandName.indexOf('app'));	// 결과 : 0
console.log(brandName.indexOf('le'));	// 결과 : 3
console.log(brandName.indexOf('z'));	// 결과 : -1
console.log(brandName.indexOf('p'));	// 결과 : 1 
// (동일한 문자열이 있기에, 인덱스[2]에 해당하는 p는 반환하지 않음)


/* */
인수에 있는 문자열과 변수에 있는 문자열을 비교해서, 동일한 문자열이 있으면 인덱스값을 반환하고
일치하는 문자열이 없다면 -1을 반환합니다.

동일한 문자열이 존재한다면, 인덱스 0과 가까운 문자열의 자리를 반환합니다.

2. slice()

  • 인덱스에 해당하는 문자열만 오려서 보여준다.

  • 인수를 하나만 사용하면 인수의 값부터 문자열의 끝까지 추출되고, 인수를 두 개 사용하면
    첫 번째 인수의 값부터 두 번째 인수의 값-1 까지의 문자열이 추출 된다.

  • 인수를 음수로 전달하는 경우에는 총 문자열의 길이에서 해당 값을 뺀 만큼부터 시작된다.

let brandName = "apple samsung LG lotte";

console.log(brandName.slice(6));        // 결과 : samsung LG lotte
console.log(brandName.slice(0, 5));    // 결과 : apple 
// index[0] 부터 index[5]-1 즉, index[4]까지 출력된다. (index[5]는 공백)

console.log(brandName.slice(-2));    // 결과 : te
// 총 문자열의 길이는 22이며 22-2인 inndex[20]부터 추출한다.

3. replace()

  • 정규표현식을 이용해 패턴에 매칭시켜서 특정한 문자열 대신에 패턴을 교체할 수 있다.

  • 두 개의 인수를 사용하고, 첫 번째 인수는 교체되어야할 값 / 두 번째 인수는 교체할 값이다.

let brandName = "apple samsung LG lotte";

console.log(brandName.replace('s', 'S'));  // 결과 : apple Samsung LG lotte
// 중복되는 문자열이 존재해도, 인덱스[0]에 가까운 문자열 한개만 변경된다.

4. replaceAll()

  • repalce() 메서드와 기능은 동일하나, 교체하려는 인수에 해당되는 모든 문자열을
    변경해준다.

  • 지원되지 않는 브라우저가 많으므로 사용전에 확인하기
    호환성 확인!

let brandName = "apple samsung LG lotte";

console.log(brandName.replace('s', 'S'));		// 결과 :  apple Samsung LG lotte
console.log(brandName.replaceAll('s', 'S'));	// 결과 : apple SamSung LG lotte
profile
프론트엔드 개발자가 되기 위한 학습 과정을 정리하는 블로그

0개의 댓글