키모스토리

#6 문자열 메소드 (String Method) 본문

Web Devlopment/JavaScript

#6 문자열 메소드 (String Method)

키모형 2025. 3. 13. 23:13
반응형

String at()

const name = "W3Schools";
let letter = name.at(2); // 'S' 

 

const name = "W3Schools";
let letter = name[2]; // 'S'

 

let text = "HELLO WORLD";
let char = text[0]; // 'H'

문자열 부분 추출

  • slice(start, end)
  • substring(start, end)
  • substr(start, length)

Slice : 시작위치(0부터)~끝위치

let text = "Apple, Banana, Kiwi";
let part = text.slice(7, 13); // 'Banana'

 

2번째 인자 없으면 시작 위치부터 끝까지

let text = "Apple, Banana, Kiwi";
let part = text.slice(7);  // 'Banana, Kiwi'

 

음수인 경우 뒤에서 부터 위치찾음 

let text = "Apple, Banana, Kiwi";
let part = text.slice(-12, -6); // 'Banana' , 뒤 에서 12번째~뒤에서 6번째

substring()

slice와 유사함, 차이점은 시작 값과 종료 값이 0보다 작으면 0으로 처리된다는 것입니다 

 

let str = "Apple, Banana, Kiwi";
let part = str.substring(7, 13); // 'Banana'

 

substr()

slice와 유사함, 차이점은 두 번째 매개변수는 추출된 부분의 길이를 지정한다는 것입니다.

 

let str = "Apple, Banana, Kiwi";
let part = str.substr(7, 6); // 'Banana' , 7번째 글자부터 6개

 

두 번째 매개변수를 생략하면 substr()나머지 문자열이 잘라집니다.

let str = "Apple, Banana, Kiwi";
let part = str.substr(7); // 'Banana, Kiwi'

 

첫 번째 매개변수가 음수이면 위치는 문자열 끝에서부터 계산됩니다.

let str = "Apple, Banana, Kiwi";
let part = str.substr(-4); // 'Kiwi'

 

대문자와 소문자로 변환

문자열은 다음을 사용하여 대문자로 변환됩니다 toUpperCase().

문자열은 다음을 사용하여 소문자로 변환됩니다 toLowerCase().

 

let text1 = "Hello World!";
let text2 = text1.toUpperCase(); // 'HELLO WORLD!'

 

let text1 = "Hello World!";     
let text2 = text1.toLowerCase();  // 'hello world!'

 concat()

oncat()두 개 이상의 문자열을 연결합니다.

let text1 = "Hello";
let text2 = "World";
let text3 = text1.concat(" ", text2);  // Hello World'

 

 concat()방법은 플러스 연산자 대신 사용할 수 있습니다. 다음 두 줄은 동일한 작업을 수행합니다.

text = "Hello" + " " + "World!";
text = "Hello".concat(" ", "World!");

trim()

문자열 양쪽의 공백을 제거합니다.

let text1 = "      Hello World!      ";
let text2 = text1.trim(); // 'Hello World!'

trimStart()

trimStart()방법은 와 비슷하게 작동 trim()하지만 문자열의 시작 부분에서만 공백을 제거합니다.

let text1 = "     Hello World!     ";
let text2 = text1.trimStart(); // 'Hello World!      '

trimEnd()

trimEnd()방법은 와 비슷하게 작동 trim()하지만 문자열의 끝부분에만 공백을 제거합니다.

let text1 = "     Hello World!     ";
let text2 = text1.trimEnd(); // '      Hello World!'

 

padStart() 

padStart()메서드는 문자열의 시작 부분을 채웁니다.

주어진 길이에 도달할 때까지 문자열에 다른 문자열을 (여러 번) 채웁니다.

let text = "5";
let padded = text.padStart(4,"0");  // '0005'

 

문자열을 "x"로 패딩하여 길이가 4가 될 때까지 채웁니다.

let text = "5";
let padded = text.padStart(4,"x"); // 'xxx5'

 

padEnd()

주어진 길이에 도달할 때까지 문자열에 다른 문자열을 (여러 번) 채웁니다.

let text = "5";
let padded = text.padEnd(4,"0"); // '5000'

 

let text = "5";
let padded = text.padEnd(4,"x"); // '5xxx'

 

문자열 내용 바꾸기

repace()

replace()메서드는 지정된 값을 문자열의 다른 값으로 바꿉니다.

let text = "Please visit Microsoft!";
let newText = text.replace("Microsoft", "W3Schools"); // 'Please visit W3Schools!'

 

대소문자를 구분하지 않으려면 플래그(구분 안 함) 가 있는 정규 표현식을 사용하세요./i

let text = "Please visit Microsoft!";
let newText = text.replace(/MICROSOFT/i, "W3Schools"); // 'Please visit W3Schools!'

 

모든 일치 항목을 바꾸려면 플래그 가 있는 정규 표현식을/g 사용합니다 (전역 일치):

let text = "Please visit Microsoft and Microsoft!";
let newText = text.replace(/Microsoft/g, "W3Schools"); // 'Please visit W3Schools and W3Schools!'

 

split()

문자열을 배열로 변환할 수 있습니다

text.split(",")    // Split on commas
text.split(" ")    // Split on spaces
text.split("|")    // Split on pipe

 

 

실전예제

list 배열에 있는 문자열중에 제목만 입력

let list = [
    "01. 들어가며",
    "02. JS의 역사",
    "03. 자료형",
    "04. 함수",
    "05. 배열",
];

console.log(list);

let newList = [];
for(let i=0; i<list.length;i++){
    newList.push(
        list[i].slice(4)
    );
}

console.log(newList);

 

금칙어 체크

// 금칙어 : 콜라 체크
function hasCola(str){
    if(str.indexOf('콜라')>-1){
        console.log("금칙어 있음");
    }else{
        console.log("통과");
    }
}

hasCola('사이다가 짱이야!');
hasCola('무슨 소리야!');
hasCola('콜라가 짱이야!');
반응형

'Web Devlopment > JavaScript' 카테고리의 다른 글

#7 배열 메소드2 , sort(), reduce()  (0) 2025.03.17
#7 배열 메소드 (Array method)  (0) 2025.03.17
#5 숫자, 수학 method  (0) 2025.03.13
#4 Symbol - property key  (0) 2025.03.13
#3 객체 메소드, 계산된 프로퍼티  (0) 2025.03.13