[JavaScript] String 객체의 메소드, 속성 알아보기 [JS기초 함수]

String이란?

문자열(string)은  따옴표("") 안에 텍스트의 집합을 말합니다.

var str = "Hello, I'm myeong-coding."​

문자열은 위와 같은 예시로 표현할 수 있습니다.
이러한 문자열 객체가 갖고있는 다양한 메소드와 속성에 대해 알아보겠습니다.

 

속성

length

문자열의 가장 중요한 속성은 length입니다.

var str = "hello";

console.log(str.length); // 5​

length는 문자열의 길이를 반환해줍니다.
가장 유용하고 빈번하게 사용됩니다.

 

메소드

charAt()

var str = "HelloWorld";

console.log(str.charAt(0)) // 'H'​

charAt( index )
: 매개변수에 인덱스를 인자로 주어 문자열 속에서 그 인덱스 위치에 해당하는 단어를 반환합니다.

 

charCodeAt()

var str = "ABC"

console.log(str.charCodeAt(0)); // 65

charCodeAt( index )
: 매개변수에 인덱스를 인자로 주어 문자열 속에서 그 인덱스 위치에 해당하는 단어의 유니코드 값을 반환합니다.

 

indexOf()

var str = "Hello, world"

console.log(str.indexOf("Hello")) // 0
console.log(str.indexOf("llo")) // 2
console.log(str.indexOf("Z")) // -1

indexOf( 찾을 문자열 )
: 매개변수에 찾으려는 문자열을 인자로 주어 문자열 안에서 주어진 값과 일치하는 첫 번째 인덱스를 반환합니다. 일치하는 값이 없으면 -1을 반환합니다.

 

includes()

var str = "Hello, World"

console.log(str.includes("Hell")); // true
console.log(str.includes("hell")); // false

includes( 찾을 문자열 )
: 매개변수에 찾으려는 문자열을 인자로 주어 문자열 안에 주어진 값이 포함되어 있는지 판별하여 true 또는 false 값으로 반환합니다. 검색 시 대소문자를 구분합니다. 

 

repeat()

var str = "AB"

console.log(str.repeat(0)); // ""
console.log(str.repeat(3)); // "ABABAB"
console.log(str.repeat(-1)); // RangeError

repeat( 횟수 )
: 매개변수에 횟수를 인자로 주어 문자열을 주어진 횟수만큼 반복해 붙인 새로운 문자열을 반환합니다. 횟수가 음수이거나, 문자열 크기를 넘을 경우 RangeError가 출력된다.

 

replace()

var str = "hello world"

console.log(str.replace("hello", "hi")) // "hi world"

replace( 찾을 문자열, 변경할 문자열 )
: 매개변수에 찾으려는 문자열과 변경하려는 문자열을 인자로 주어 가장 먼저 일치하는 문자열을 변경할 문자열로 바꿔줍니다. 일치하는 모든 문자열을 바꿔주기 위해선 찾을 문자열에 정규식으로 표현을 해주어야 합니다.

 

slice()

var str = "hello world hi"

console.log(str.slice(5)); // " world hi"
console.log(str.slice(0,5)); // "hello"
console.log(str.slice(-4,-1)); // "d h"

slice( 시작 인덱스, 끝 인덱스 )
: 매개변수에 시작 인덱스와 끝 인덱스를 인자로 주어 문자열로부터 주어진 범위(시작인덱스<= && <=끝인덱스-1)내에 문자열을 새로 반환합니다. 원본 문자열은 바뀌지 않습니다. 끝 인덱스를 인자로 주지 않을 경우 시작 인덱스부터 문자열 끝까지 추출합니다. 인덱스가 만약 음수일 경우 (str.length + 인덱스)가 인덱스의 위치가 됩니다.

 

split()

var str = "hello world hi world";
console.log(str.split(" ")); // ['hello', 'world', 'hi', 'world']

var str1 = "hello";
console.log(str.split("")); // ['h', 'e', 'l', 'l', 'o']

split( 구분자, 끊는 횟수 )
: 매개변수에 구분자를 인자로 주어 문자열을 주어진 구분자마다 끊어 부분 문자열을 담은 배열을 반환합니다. 끊는 횟수를 추가로 주게되면 구분자로 끊는 횟수가 제한됩니다.

 

substr()

var str = "hello, world";

console.log(str.substr(1,3)); // "ell"
console.log(str.substr(7)); // "world"

substr( 시작 인덱스, 추출할 문자 개수 )
: 매개변수에 시작 인덱스와, 추출할 문자의 개수를 인자로 주어 문자열을 시작 인덱스부터 추출할 문자 개수만큼의 문자들을 반환합니다. 추출할 문자 개수는 옵션값으로 주지않을 경우 시작 인덱스부터 문자열 끝까지 반환합니다.

 

toLowerCase(), toUpperCase()

var str = "Hello";

console.log(str.toLowerCase()) // "hello"
console.log(str.toUpperCase()) // "HELLO"

toLowerCase(), toUpperCase()
: toLowerCase()는 호출 문자열을 모두 소문자로 변환하여 반환합니다. 반대로 toUpperCase()는 호출 문자열을 모두 대문자로 변환하여 반환합니다.

 

trim()

var str ="  hello  ";

console.log(str.trim()); // "hello"

trim()
: trim() 메소드는 문자열 양 끝의 공백을 제거하고 원본 문자열을 수정하지 않고 새로운 문자열을 반환합니다.

 

후기

자바스크립트로 프로그래머스에서 코테를 풀면서 다른사람의 문제 풀이를 참고하였는데 4줄짜리 코드를 여러 함수를 사용하여 1줄짜리 코드로 문제를 해결하는 것을 보고 함수를 적절히 사용하는 것이 보다 더 빠르게 코드를 작성할 수 있고 효율적으로 코드를 짤 수 있다는 것을 깨닫게 되었습니다.

 

String - JavaScript | MDN (mozilla.org)

String - JavaScript | MDN