자바스크립트 문자열 slice – 문자열 자르기

문자열에서 slice() 함수는
주어진 문자열의 특정 범위를 잘라내어(slice) 추출한 결과를 새로운 문자열로 반환합니다.

 

이 글은 코딩에브리바디(codingeverybody.kr)의 내용을 참조해 작성했습니다.

 

이 함수는 문자열을 잘라서 추출하는데 매우 유용합니다.

 

특징

• 지정한 인덱스 범위로 잘라낸 문자열를 새로운 문자열로 반환합니다.
• 인덱스 범위는 매개 변수로 지정한 시작점부터 끝점까지(끝점을 포함하지 않음, 직전까지 추출)입니다.
• 이러한 동작으로 주어진 원본 문자열은 변경되지 않고 그대로 유지됩니다.

기본 예제

/**
 * 문자열의 특정 범위를 추출하여 새로운 문자열로 반환하는 함수
 * str.slice(beginIndex[, endIndex])
 * 
 * @param {number} beginIndex - 추출을 시작할 부분 문자열의 시작 인덱스.
 * @param {number} endIndex - 추출을 종료할 부분 문자열의 끝 인덱스 (직전까지 추출).
 * @returns {string} - 추출된 부분 문자열.
*/

/*
 * 주의하세요!
 * 문자열에서 인덱스는 0부터 시작합니다.
 * 첫 번째 문자열의 인덱스는 0이고, 두 번째 문자열의 인덱스는 1입니다.
*/

const greeting = "환영합니다. 코딩에브리바디입니다.";

const hello = greeting.slice(0, 6);
console.log(hello); // 출력: "환영합니다."

const niceTomeetYou = greeting.slice(7, 9);
console.log(niceTomeetYou); // 출력: "코딩"

/* 👇 원본 문자열은 바뀌지 않습니다. */
console.log(greeting); // 출력: "환영합니다. 코딩에브리바디입니다."

 

구문

str.slice(beginIndex)
str.slice(beginIndex, endIndex)

 

반환 값

slice() 함수는 원본 문자열의 특정 범위를 추출하여 새로운 문자열로 반환합니다.
반환되는 이 새로운 문자열은 원본 문자열의 일부 문자열를 복사한 것이므로, 원본 문자열은 바뀌지 않습니다.

 

매개변수와 반환 값 예시

let str1 = "환영합니다.", // str1의 길이는 6입니다.
    str2 = str1.slice(1, 8),
    str3 = str1.slice(4, -1),
    str4 = str1.slice(),
    str5 = str1.slice(30);
    
console.log(str2); // 출력: "영합니다."
console.log(str3); // 출력: "다"
console.log(str4); // 출력: "환영합니다."
console.log(str5); // 출력: ""

 

주의할 점: 이모지(Emoji)를 자를 때

// 🚨 코드 유닛 기준으로 잘리는 예
'😃🏀🍅'.slice(0, 2);
// 결과: '😃'
// 2개의 문자를 자른 것처럼 보이지만,
// 실제로는 2개의 코드 유닛만 추출되어 첫 번째 이모지만 반환됩니다.

// ❌ 이모지를 중간에서 자르는 위험한 예
'😃🏀🍅'.slice(0, 1);
// 결과: 깨진 문자
// 서로게이트 쌍의 절반만 잘려 문자 데이터가 손상됩니다.

 

활용 예제

onst originalString = "Hello, World!";
const slicedString = originalString.slice(0, 5);

console.log(slicedString); // 출력: "Hello"

 

const greeting = "Hello";
const modifiedGreeting = greeting.slice(0, 3) + "p!";

console.log(modifiedGreeting); // 출력: "Help!"

 

const originalString = "안녕하세요. 자바스크립트!";
const stringWithoutSegment = originalString.slice(0, 5) + originalString.slice(-1);

console.log(stringWithoutSegment); // 출력: "안녕하세요!"

 

참고 자료

https://codingeverybody.jp/javascript-string-slice-function/

JavaScript 文字列slice()関数：文字列の切り取り - codingEverybody

 

https://coding.courses/javascript-string-slice-function/

JavaScript String slice() Function – Slice a String by Index Range - codingCourses