whatisthis?

javaScript. (7) 문자열 본문

WEB STUDY/JAVASCRIPT

javaScript. (7) 문자열

thisisyjin 2022. 1. 22. 11:16

문자열(String)

 

- 작은따옴표('') 또는 큰따옴표("")

- 백틱기호 (``) + 템플릿 ${}

 

- 문자열도 객체이다.

new String()
/// object

- 콘솔에 new String()이라고 치면 어떤 객체가 나온다.

- 문자열은 객체이기 때문에 (정확히는, 원시 래퍼) 메소드가 존재한다.

 


 

 

📌 문자열에서 줄바꿈하는 방법

 

>> 아무리 문자열이 길더라도 '\n'을 넣어주지 않으면 한 줄로 인식됨.

여기서, '\n'을 개행문자라고 한다. (=탈출문자)

공백문자 NBSP (Non-Breaking Space) 줄바꿈 없는 공백 - 줄바꿈 방지를 위해
탈출문자(개행문자) Line Feed(LF) \n / 다음 줄로 넘어감 
Carriage Return(CR) \r / 커서가 첫 문자로 돌아감

 

개행문자의 종류에는 \n과 \r이 있다.

이중에서 \n은 다음줄로 넘어가는 Line Feed(LF)에 해당한다.

 

 

 

참고 🔻

더보기
'hello\n'.length
 /// 6

 

\n을 포함한 문자열이 길이는 +1을 해주면 된다. (줄바꿈)

 


📌 문자열 Method

 

 

1) String.length

- 문자열의 길이 반환.

- 메서드(Method)가 아닌 속성(Property)이다.

 +) 배열.length는 요소의 수를 의미함.

 

2) String.charAt(자릿수)

문자열의 특정 자릿수의 문자를 알려줌.

- 문자열을 배열처럼 생각해서 [1]과 같이 해도 같은 결과가 나옴.

'hello'.charAt(1)    // 'e'
'hello'[1]          // 'e'

 

 

3) String.split(구분자)

- 구분자를 기준으로 문자열을 나누어 새 배열로 만듬.

'hello'.split('');    // String : ['h', 'e', 'l', 'l', 'o']

'my name is yjin'.split(' ');        // String : ['my', 'name', 'is', 'yjin']

 

4) String.concat(문자열)

- 두 문자열을 합쳐 새로운 문자열로 반환함.

- string + string을 해도 결과는 같음. (더하기 연산자)

'hello '.concat('yjin');      // 'hello yjin'

'hello ' + 'yjin';            // 'hello yjin'

 

5) String.trim()

- 문자열의 좌우 공백을 제거새 문자열을 반환

let string = '     hello      ';
string.trim();        // 'hello'

- ❗ 여기서, 공백이란? - 모든 공백문자(space, tab, NBSP)와 개행문자(LF, CR)을 의미한다.

 

 

6) String.toUpperCase() / toLowerCase()

- 각 문자열을 대문자나 소문자로 바꾼 새 문자열을 반환.

-UpperCase = 대문자로 / LowerCase = 소문자로

let string = 'aBcD';

string.toUpperCase();   // 'ABCD'
string.toLowerCase();   // 'abcd'

 

7) String.substr(시작, 길이)

- 시작점부터 길이만큼 문자열을 잘라낸 새 문자열을 반환함.

'abcdefg'.substr(1, 3);      //  'bcd'

 

8) String.substring(시작, 끝)

- 두번째 매개변수가 끝점substr. (시작점은 포함되지만 끝점은 포함❌)

- ❗ substr은 시작,길이 / substring은 시작,끝(미만)

'abcdefg'.substring(1,3);   // 'bc'  1부터 3미만까지.

 

 

9) String.slice(시작, 끝)

- substring과 동일하지만, 마이너스 값을 넣을 수 있음. 마이너스 값은 끝에서부터 센다. 

- substring보다 활용도가 많음.

'abcdefg'.slice(-4,6)  // 'def'   끝에서 4번째 = 'd', 6미만 = 'f'

 

10) String. replace(찾을값, 교체값)

- 문자열에서 해당 값을 찾아 교체함.

'hello world'.replace('hello', 'goodbye');     // 'goodbye world'

 

11) String.indexOf(찾을값) / lastIndexOf(찾을값)

- 문자열에서 찾을 값의 위치(인덱스)를 알려줌.  만약, 찾을수 없다면 -1을 반환.

- 해당 값이 여러개 존재한다면 처음 찾은 것만 알려줌.

- lastIndexOf는 끝에서부터 찾음. (여기서는 처음 찾은것이 맨 뒤에 있는것)

 

 

javaScript. indexOf()문

Array.indexOf() - indexOf() 메서드는 배열에서 지정된 요소를 찾을 수 있는 첫 번째 인덱스를 반환하고, 존재하지 않으면 -1을 반환함. SYNTAX arr.indexOf(searchElement[, fromIndex]) 매개변수 searchElemen..

mywebproject.tistory.com

 

❗❗ 두번째 매개변수인 fromindex를 해도 '검색위치'만 달라지지

return값은 결국 전체 문자열에서의 인덱스를 반환한다.

 

 


REFERENCE

https://www.zerocho.com/category/JavaScript/post/57374a46d85eeb9409de56ea

 

(JavaScript) 문자열

이제 왕초보를 벗어났으니 자바스크립트가 기본적으로 지원하는 것들에 대해 알아보겠습니다. 이번 시간은 문자열입니다. 문자열 첫 시간에 간단히 알아봤었죠. 문자열은 작은 따옴표 또는 큰

www.zerocho.com

이 포스팅은 zerocho님의 javascript 강의와 책을 보고 작성한 글입니다.

공부+기록 용으로 작성한 것이며, 자세한 것은 위 포스팅을 참고하세요!