[javascript] 문자열(string) 객체 알아보기

 자바스크립트에서 문자열 객체에 대해 알아보기

 

문자열객체란?

자바스크립트에서 문자열(string)객체는 문자열 데이터를 나타내기 위한 객체 입니다.

문자열 데이터를 문자열 객체로 생성하면 , 문자열 객체의 다양한 메서드와 속성을 사용하여 문자열 데이터를 조작하고 분석할 수 있습니다.

 

문자열객체는 String()생성자를 사용하여 생성할 수 있습니다.

예를 들어,

var str=new String("Hello, World!");

와 같이 String()생성자를 사용하여 문자열 객체를 생성할 수 있습니다.

그러나 일반적으로 문자열데이터를 리터럴(literal)로 작성하여 문자열 객체를 자동으로 생성합니다.

예를 들어 , "Hello, World"와 같은 문자열 데이터를 리터럴로 표현하면 자동으로 문자열 객체가 생성됩니다.

 

자바스크립트에서 문자열은 변경불가능한(immutable)객체입니다.

즉 문자열이 생성된 후에는 해당 문자열을 변경할 수 없습니다.

대신에, 문자열 객체의 메서드를 사용하여 새로운 문자열을 생성할 수 있습니다.

기존의 문자열은 변경되지 않으며, 새로운 문자열이 반환됩니다.

 

 

문자열 객체 메서드 10가지

 

✈. at()

문자열 내에서 지정된 인덱스 위치에  있는 문자를 반환합니다.

at()메서드는 문자열 내부에서 유니코드 코드 포인트를 기준으로 인덱스를 계산합니다.

str.at(index)

- str: 문자열 객체 

- index: 반환할 문자의 위치를 나타내는 인덱스 값(0부터 str.length-1 까지의 정수 값을 가질 수 있으며, 음수값을 사용하여 끝에서 부터  문자를 찾을 수도 있습니다.) 

at()메서드는 인덱스 위치에 있는 문자를 반환합니다. 만약 해당 인덱스 위치에 문자가 없는 경우, 빈 문자열("")을 반환합니다.

const str = 'ABCDEF';
console.log(str.at(0)); // 'A'
console.log(str.at(2)); // 'C'
console.log(str.at(5)); // 'F'
console.log(str.at(-1)); // 'F'
console.log(str.at(6)); // ''

문자열 .ABCDEF를 선언 한뒤 at()메서드를 사용하여 각각의 인덱스 위치에 있는 문자를 반환합니다.

인덱스 위치가 문자열의 범위를 벗어나는 경우 빈문자열("")이 반환됩니다.

 

 

✈. charAt()

문자열 내에서 지정된 인덱스 위치에 있는 문자를 반환합니다.

charAt()메서드는 at()메서드와 유사하지만, 인덱스를 기준으로 16비트 유니코드 코드 유닛을 사용하여 계산합니다.

str.charAt(index)

예시

const str = "Hello, World";
const char + str.charAt(1); // "e"
concole.log(char);

hello, world의 1번째 문자("e")를 반환합니다.

 

 

✈. charCodeAt()

문자열 내에서 지정된 인덱스 위치에 있는 문자의 유니코드 값을 반환합니다.

charCodeAt()메서드는 charAt()메서드와 유사하지만, 유니코드 코드 포인드 값을 반환합니다.

const str = "Hello, world!";
const charCode = str.charCodeAt(1); // 101
console.log(charCode);

hello,world의 1번째 문자 ("e")의 유니코드 값을 반환합니다.

 

 

✈. codePointAt()

문자열 내에서 지정된 인덱스 위치에 있는 문자의 유니코드 코드포인트 값을 반환합니다.

codePointAt()메서드는 at()메서드와 유사하지만, 유니코드 코드포인트 값을 반환합니다.

const str = 'Hello, world! 🌍';
console.log(str.codePointAt(0)); // 72
console.log(str.codePointAt(6)); // 44
console.log(str.codePointAt(13)); // 55356
console.log(str.codePointAt(14)); // 57181

위 코드에서 문자열 'str'은 알파벳, 쉼표, 띄어쓰기, 이모지로 이루어져 있습니다. 'codePointAt()' 메소드는 문자열 'str'에서 지정된 위치에 있는 문자의 코드 포인트 값을 반환합니다.

 

첫 번째 문자는 'H'이며, 이 문자의 코드 포인트 값은 '72'입니다. 두 번째 문자는 쉼표이며, 이 문자의 코드 포인트 값은 '44'입니다. 세 번째 문자 이후는 이모지이며, 이모지는 UTF-16 인코딩으로 표현됩니다. UTF-16에서 이모지는 2개의 16비트 숫자 쌍으로 표현되며, 'codePointAt()' 메소드는 첫 번째 숫자 쌍의 코드 포인트 값을 반환합니다. 세 번째 문자의 첫 번째 숫자 쌍은 '55356'이며, 두 번째 숫자 쌍은 '57181'입니다.

 

위와 같이 'codePointAt()' 메소드는 문자열에서 지정된 위치에 있는 문자의 코드 포인트 값을 반환하며, 문자열 내에 해당 위치에 문자가 없는 경우 'undefined'를 반환합니다.

 

 

✈. concat()

문자열을 다른 문자열과 연결하여 새로운 문자열을 반환합니다.

const str1 = 'Hello';
const str2 = 'World';
const str3 = '!';
const result = str1.concat(' ', str2, str3);

console.log(result); // 'Hello World!'

위 코드에서 'concat()' 메소드는 'str1', 'str2', 'st'3' 세 개의 문자열을 이어서 새로운 문자열을 생성합니다. 새로운 문자열은 'Hello World!'가 되며, 이 문자열은 'result' 변수에 할당됩니다.

 

'concat()' 메소드는 두 개 이상의 문자열을 이어서 새로운 문자열을 생성할 수 있습니다. 이 때, 첫 번째 문자열은 항상 원래의 문자열이 되며, 두 번째 문자열부터는 원래의 문자열에 이어서 붙여집니다. 따라서 'concat()' 메소드의 첫 번째 인수는 반드시 문자열이어야 합니다. 빈 문자열('  ') 을 인수로 지정하면, 원래의 문자열을 그대로 반환합니다.

 

 

✈. localCompare()

문자열을 지정된 로케일에 따라 다른 문자열과 비교합니다. 비교결과에 따라 -1, 0, 1을 반환합니다.

const str1 = 'apple';
const str2 = 'banana';

console.log(str1.localeCompare(str2)); // -1
console.log(str2.localeCompare(str1)); // 1
console.log(str1.localeCompare(str1)); // 0

위 코드에서 'localeCompare()' 메소드는 'str1'과 'str2' 두 개의 문자열을 비교합니다. 첫 번째 비교에서는 'str1'이 'str2'보다 작으므로 '-1'이 반환됩니다. 두 번째 비교에서는 'str2'가 'str1'보다 크므로 '1'이 반환됩니다. 세 번째 비교에서는 'str1'과 'str1'이 동일하므로 '0'이 반환됩니다..

 

 

✈. normalize()

문자열의 유니코드 정규화(normalization)를 수행합니다.

const str1 = '\u1E9B\u0323';
const str2 = '\u1E69';

console.log(str1 === str2); // false
console.log(str1.normalize() === str2.normalize()); // true

위 코드에서는 'normalize()' 메소드를 사용하여 두 개의 유니코드 문자열을 정규화한 후, 문자열 비교를 수행합니다. 첫 번째 비교에서는 두 문자열이 서로 다르므로 'false'가 반환됩니다. 두 번째 비교에서는 두 문자열을 모두 NFC 형태로 정규화한 후, 비교하므로 'true'가 반환됩니다.

 

 

✈. padEnd()

문자열의 끝 부분에 지정된 길이만큼 다른 문자열을 추가하여 문자열의 길이를 늘립니다.

const str = 'Hello';
console.log(str.padEnd(10)); // 'Hello     '
console.log(str.padEnd(10, '.')); // 'Hello.....'

위 코드에서는 'padEnd()' 메소드를 사용하여 문자열 'Hello'를 10자리 길이로 만듭니다. 두 번째 매개변수를 생략하면 공백 문자열이 채워지고, 두 번째 매개변수로 '.' 문자열을 전달하면 '.' 문자열이 채워집니다.

 

 

✈. padStart()

문자열의 시작부분에 지정된 길이만큼 다른 문자열을 추가하여 문자열의 길이를 늘립니다.

const str = 'Hello';
console.log(str.padStart(10)); // '     Hello'
console.log(str.padStart(10, '.')); // '.....Hello'

위 코드에서는 'padStart()' 메소드를 사용하여 문자열 'Hello'를 10자리 길이로 만듭니다. 두 번째 매개변수를 생략하면 공백 문자열이 채워지고, 두 번째 매개변수로 '.' 문자열을 전달하면 '.' 문자열이 채워집니다.

 

 

✈. repeat()

문자열을 지정된 횟수만큼 반복하여 새로운 문자열을 반환합니다.

const str = 'abc';
console.log(str.repeat(3)); // 'abcabcabc'

위 코드에서는 'repeat()' 메소드를 사용하여 문자열 'abc'를 3번 반복한 새로운 문자열을 반환합니다.