JavaScript 문자열 메서드

문자열 메서드는 문자열을 처리하는 데 도움을 줍니다.

문자열 메서드와 속성

원시 값, 예를 들어 "Bill Gates"는 속성과 메서드를 가질 수 없습니다(그들은 객체가 아니기 때문입니다).

하지만 JavaScript를 통해 메서드와 속성은 원시 값에도 사용될 수 있으며, 메서드와 속성을 실행할 때 JavaScript는 원시 값을 객체로 간주합니다.

문자열 길이

length 속성은 문자열의 길이를 반환합니다:

예제

var txt = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
var sln = txt.length;

직접 시험해 보세요

문자열 내의 문자열을 검색합니다

indexOf() 방법은 문자열 내에서 지정된 텍스트를 검색합니다처음출현하는 인덱스(위치):

예제

var str = "The full name of China is the People's Republic of China.";
var pos = str.indexOf("China");

직접 시험해 보세요

JavaScript는 0부터 위치를 계산합니다.

0은 문자열의 첫 번째 위치, 1은 두 번째, 2는 세 번째 ...

lastIndexOf() 방법은 문자열 내에서 지정된 텍스트의 위치를 반환합니다마지막한 번 등장하는 인덱스:

예제

var str = "The full name of China is the People's Republic of China.";
var pos = str.lastIndexOf("China");

직접 시험해 보세요

텍스트를 찾지 못하면 indexOf() 그리고 lastIndexOf() 모두 -1을 반환합니다.

예제

var str = "The full name of China is the People's Republic of China.";
var pos = str.indexOf("USA");

직접 시험해 보세요

두 가지 방법 모두 검색 시작 위치를 두 번째 매개변수로 받습니다.

예제

var str = "The full name of China is the People's Republic of China.";
var pos = str.indexOf("China", 18);

직접 시험해 보세요

lastIndexOf() 방법은 마지막에서부터 검색을 진행합니다(뒤에서부터 앞으로), 이는 다음과 같습니다: 두 번째 매개변수가 50이라면, 위치 50에서 시작하여 문자열의 시작점까지 검색합니다.

예제

var str = "The full name of China is the People's Republic of China.";
var pos = str.lastIndexOf("China", 50);

직접 시험해 보세요

문자열 내의 문자열을 검색합니다

search() 특정 값의 문자열을 검색하고 위치를 반환하는 방법:

예제

var str = "The full name of China is the People's Republic of China.";
var pos = str.search("locate");

직접 시험해 보세요

알고 계신가요?

两种方法，indexOf() 와 search()는동일한.

이 두 메서드는 다릅니다. 차이점은 다음과 같습니다:

  • search() 메서드는 두 번째 시작 위치 매개변수를 설정할 수 없습니다.
  • indexOf() 메서드는 더 강력한 검색 값(정규 표현식)을 설정할 수 없습니다.

당신은정규 표현식의 장을 통해 이러한 더 강력한 검색 값에 대해 배웁니다.

문자열의 일부를 추출

문자열의 일부를 추출하는 방법이 세 가지 있습니다:

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

slice() 메서드

slice() 특정 문자열 부분을 추출하여 새 문자열에 반환합니다.

이 메서드는 두 가지 매개변수를 설정합니다: 시작 인덱스(시작 위치), 종료 인덱스(종료 위치).

이 예제는 문자열의 위치 7에서 위치 13까지의 부분을 잘라냅니다:

예제

var str = "Apple, Banana, Mango";
var res = str.slice(7,13);

res의 결과는 다음과 같습니다:

Banana

직접 시험해 보세요

어떤 매개변수가 음수인 경우 문자열의 끝에서 시작하여 계산합니다.

이 예제는 문자열의 위치 -12에서 위치 -6까지의 부분을 잘라냅니다:

예제

var str = "Apple, Banana, Mango";
var res = str.slice(-13,-7);

res의 결과는 다음과 같습니다:

Banana

직접 시험해 보세요

두 번째 매개변수를 생략하면 이 메서드는 문자열의 나머지 부분을 잘라냅니다:

예제

var res = str.slice(7);

직접 시험해 보세요

또는 끝에서 시작하여 계산합니다:

예제

var res = str.slice(-13);

직접 시험해 보세요

힌트:음수 위치는 Internet Explorer 8 및 이전 버전에서는 적용되지 않습니다.

substring() 메서드

substring() 유사하게 slice().

차이점은 다음과 같습니다: substring() 음수 인덱스는 받아들이지 않습니다.

예제

var str = "Apple, Banana, Mango";
var res = str.substring(7,13);

res의 결과는 다음과 같습니다:

Banana

직접 시험해 보세요

두 번째 매개변수를 생략하면 이 substring() 문자열의 나머지 부분을 잘라냅니다.

substr() 메서드

substr() 유사하게 slice().

두 번째 매개변수가 추출된 부분을 정의하는 점에서 차이가 납니다.길이.

예제

var str = "Apple, Banana, Mango";
var res = str.substr(7,6);

res의 결과는 다음과 같습니다:

Banana

직접 시험해 보세요

두 번째 매개변수를 생략하면 substr()는 문자열의 나머지 부분을 잘라냅니다.

예제

var str = "Apple, Banana, Mango";
var res = str.substr(7);

직접 시험해 보세요

res의 결과는 다음과 같습니다:

Banana, Mango

처음 번째 매개변수가 음수인 경우 문자열의 끝에서 위치를 계산합니다.

예제

var str = "Apple, Banana, Mango";
var res = str.substr(-5);

직접 시험해 보세요

res의 결과는 다음과 같습니다:

Mango

두 번째 매개변수는 길이를 정의하기 때문에 음수일 수 없습니다.

문자열 내용을 대체합니다

replace() 문자열에서 지정된 값에 다른 값을 대체하는 방법:

예제

str = "Please visit Microsoft!";
var n = str.replace("Microsoft", "W3School");

직접 시험해 보세요

replace() 메서드는 호출한 문자열을 변경하지 않습니다. 그는 새 문자열을 반환합니다.

기본적으로:replace() 최초의 일치만 교체:

예제

str = "Please visit Microsoft and Microsoft!";
var n = str.replace("Microsoft", "W3School");

직접 시험해 보세요

기본적으로:replace() 대소문자 구분 없이 일치합니다. 따라서 MICROSOFT에 대한 일치를하지 않습니다:

예제

str = "Please visit Microsoft!";
var n = str.replace("MICROSOFT", "W3School");

직접 시험해 보세요

case-insensitive 대체를 수행하려면, 정규 표현식을 사용하십시오 /icase-insensitive):

예제

str = "Please visit Microsoft!";
var n = str.replace(/MICROSOFT/i, "W3School");

직접 시험해 보세요

주의하세요 정규 표현식은 인용 부호 없이 작성됩니다.

모든 일치를 교체하려면, 정규 표현식의 g 표시자(전체 검색에 사용):

예제

str = "Please visit Microsoft and Microsoft!";
var n = str.replace(/Microsoft/g, "W3School");

직접 시험해 보세요

JavaScript 정규 표현식에서 더 많이 배울 것입니다:정규 표현식의 내용입니다.

대문자와 소문자로 변환

via toUpperCase() 문자열을 대문자로 변환합니다:

예제

var text1 = "Hello World!";       // 문자열
var text2 = text1.toUpperCase();  // text2는 text1이 대문자로 변환된 것입니다

직접 시험해 보세요

via toLowerCase() 문자열을 소문자로 변환합니다:

예제

var text1 = "Hello World!";       // 문자열
var text2 = text1.toLowerCase();  // text2는 text1이 소문자로 변환된 것입니다

직접 시험해 보세요

concat() 메서드

concat() 두 개나 더 많은 문자열을 연결합니다:

예제

var text1 = "Hello";
var text2 = "World";
text3 = text1.concat(" ",text2);

직접 시험해 보세요

concat() 메서드는 추가 연산자 대신 사용될 수 있습니다. 아래 두 줄은 동등합니다:

예제

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

모든 문자열 메서드는 새 문자열을 반환합니다. 그들은 원래 문자열을 변경하지 않습니다.

정식적으로 말하면: 문자열은 불변합니다: 문자열은 변경할 수 없으며 대신 교체할 수 있습니다.

String.trim()

trim() 메서드는 문자열의 양쪽에 있는 공백 문자를 제거합니다：

예제

var str = "       Hello World!        ";
alert(str.trim());

경고：Internet Explorer 8 이하 버전에서 지원되지 않습니다 trim() 메서드。

직접 시험해 보세요

IE 8을 지원하려면 정규 표현식과 함께 사용할 수 있습니다 replace() 메서드 대신：

예제

var str = "       Hello World!        ";
alert(str.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, ''));

직접 시험해 보세요

String.prototype.trim 함수를 추가할 수 있는 위의 replace 구문을 사용할 수 있습니다：

예제

if (!String.prototype.trim) {
  String.prototype.trim = function () {
    return this.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, '');
};
var str = "       Hello World!        ";
alert(str.trim());

직접 시험해 보세요

문자열 문자 추출

이 두 가지는 문자열 문자를 추출하는안전메서드：

  • charAt(위치)
  • charCodeAt(위치)

charAt() 메서드

charAt() 메서드는 문자열에서 지정된 인덱스（위치）의 문자열을 반환합니다：

예제

var str = "HELLO WORLD";
str.charAt(0);            // 반환 H

직접 시험해 보세요

charCodeAt() 메서드

charCodeAt() 메서드는 문자열에서 지정된 인덱스의 문자 Unicode 코드를 반환합니다：

예제

var str = "HELLO WORLD";
str.charCodeAt(0);         // 반환 72

직접 시험해 보세요

속성 접근법（Property Access）

ECMAScript 5 (2009)는 문자열의 속성 접근법 [ ]를 허용합니다：

예제

var str = "HELLO WORLD";
str[0];                   // 반환 H

직접 시험해 보세요

속성 접근법은 약간 신뢰성이 없습니다:

  • Internet Explorer 7 또는 이전 버전에서 사용 불가능합니다
  • 문자열이 배열처럼 보이게 합니다（그렇지 않습니다）
  • 문자를 찾지 못할 경우[ ] 반환합니다 undefined그리고 charAt() 빈 문자열을 반환합니다。
  • 읽기 전용입니다。str[0] = "A" 오류를 발생시키지 않습니다（하지만 작동하지 않습니다！）

예제

var str = "HELLO WORLD";
str[0] = "A";             // 오류를 발생시키지 않지만 작동하지 않습니다
str[0];                   // 반환 H

직접 시험해 보세요

힌트:문자열을 배열처럼 처리하고 싶다면, 먼저 문자열을 배열로 변환할 수 있습니다.

문자열을 배열로 변환하려면

문자열을 배열로 변환할 수 있습니다. split() 문자열을 배열로 변환하려면:

예제

var txt = "a,b,c,d,e";   // 문자열
txt.split(",");          // 콤마로 분리
txt.split(" ");          // 공백으로 분리
txt.split("|");          // pipe로 분리

직접 시험해 보세요

구분자를 생략하면, 반환된 배열은 index [0]에 있는 전체 문자열을 포함합니다.

구분자가 "" 인 경우, 반환된 배열은 단일 문자로 구성된 배열입니다:

예제

var txt = "Hello";       // 문자열
txt.split("\"");           // 문자로 분리

직접 시험해 보세요

완전한 String 참조 가이드

완전한 참조 가이드를 필요로 하시면, 우리의 완전한 JavaScript 문자열 참조 가이드.

이 가이드는 모든 문자열 속성 및 메서드에 대한 설명과 예제를 포함하고 있습니다.