문자열(String)_20201026

String 전역 객체는 문자열(문자의 나열)의 생성자입니다.

String(thing) 문자열은 전역 객체를 직접 사용 및 생성할 수 있습니다.

문자열은 변경 불가능한 값입니다.

 

문자열 메소드 빠르게 찾기

 

1. str.length: 문자열 길이를 숫자로 반환(공백포함)

2. str[인덱스]: 문자열의 한 글자 반환(공백 포함)

3. str.indexOf(원하는글자): 원하는 글자의 문자의 인덱스 찾기(첫글자인덱스반환)

4. str.lastIndexOf(원하는글자): 마지막 문자열의 첫번째 글자 index를 반환한다.(마지막으로 발견한 문자열)

5. str.substr(시작인덱스,글자수): 문자열 특정 위치부터 특정 문자 수 만큼 문자를 반환. str.substr(2): 0번째 인덱스부터 2개 반환.

6. str.substring(시작인덱스,끝 인덱스): 문자열을 특정 위치에서 원하는 만큼만 잡을 수 있다: str.substring(0, 3). 시작(0)에서 끝(3)전까지.

7. str.replace(바꿔야할 문자, 치환할 문자):

8. str.split(나눌기준): 나눌기준에 따라 여러개의 문자열로 나눈다. 결과값은 배열이다. 문자열 => 배열

'  ' => 공백기준, '' => 한글자기준,  () => 문자열 전체를 가져옴.(copy)

9. str.join(합칠기준): 합칠기준에 따라 문자열로 된 배열을 합친다.  배열 => 문자열

' ' =>  공백기준(한칸 띄어서 합침), '' => 모든 글자를 합침, () => 문자 사이에 , 를 넣어 합침.

10. str.toUpperCase, str.toLowerCase: 모두 대문자, 소문자로 바꾸기 . 원본에는 변함이 없다.

11. str.includes(원하는글자): 원하는 글자의 포함여부 boolean 확인

12. str.trim(): 문자열 양끝의 공백제거하기.

13. str.repeat(): 현재 문자열을 주어진 횟수만큼 반복해 붙인 새로운 문자열

 

자바스크립트 문자열 자르기 세가지 방법

: 문자열의 일부를 추출하면서 새로운 문자열을 반환합니다.

 

1. slice()

2. subString()

3. substr()

1. slice()

<script>
var str = "Apple, Banana, Kiwi, Pear, Peach";
var result = str.slice(7, 13);
document.write(result); //결과값은 Banana 이다
</script>

문자열.slice(잘라올 첫번째 글자 위치값, 잘라올 마지막 글자 위치값의 다음글자위치)

배열에도 사용가능함.. !

<script>
var str = new Array("Apple", "Banana", "Kiwi", "Pear", "Peach");
var result = str.slice(0, 3);
document.write(result); //결과값은 Apple,Banana,Kiwi
</script>

출처: https://aljjabaegi.tistory.com/127

negative index(-)도 사용가능함.

let str = "hello world"

str.slice(3)
// 앞에서부터 3개 이므로 'hel'
str.slice(-3)
// 뒤에서부터 3개 이므로 'rld'

 

2. subString()

 

<script>
var str = "Apple, Banana, Kiwi, Pear, Peach";
var result = str.substring(7, 13);
document.write(result); //결과값은 Banana이다. 
</script>

출처: https://aljjabaegi.tistory.com/127 [알짜배기 프로그래머]

문자열.substring(잘라올 첫 위치값, 잘라올 마지막 위치값)

 

3. substr()

 

<script>
var str = "Apple, Banana, Kiwi, Pear, Peach";
var result = str.substr(7, 6);
document.write(result); //결과값은 Banana 이다.
</script>

출처: https://aljjabaegi.tistory.com/127 [알짜배기 프로그래머]

문자열.substr(잘라올 첫 위치값, 문자열의 길이)
slice() 와 비슷한데 substr() 의 두번째 파라메터값은 문자열의 길이라는 것이 차이점이다.

 

 

 

 

 

 

자세한 설명은 이하를 참조합니다.

 

.length:  문자열 전체 길이를 숫자로 반환해줍니다.

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

 

Finding a Letter in a String

var str = "Please!";
var pos = str[0]
console.log(pos); //결과값은 P이다. 

문자열의 한 글자를 찾아줍니다.

Finding a String in a String

var str = "Please locate where 'locate' occurs!";
var pos = str.indexOf("locate");

- 원하는 글자의 인덱스 찾기

- return value는 처음으로 일치하는 index, 문자열이 없으면 -1

- 산출되는 숫자는 찾은 문자의 첫번째 글자의 위치.

var stringName = 'everybody';
alert(stringName.lastIndexOf('every')); // 0
 
var stringName = 'coding everybody';
alert(stringName.lastIndexOf('every')); // 7
 
var stringName = 'coding everybody everywhere';
alert(stringName.indexOf('every')); // 7, lastIndexOf와 indexOf의 차이

- indexOf가 처음 발견되는 문자열에 대한 index를 반환하는 반면,
- lastIndexOf는 마지막 문자열의 첫번째 글자 index를 반환한다.

 

*Array 일 경우,

const animals = ['Dodo', 'Tiger', 'Penguin', 'Dodo'];

console.log(animals.lastIndexOf('Dodo'));
// expected output: 3

console.log(animals.lastIndexOf('Tiger'));
// expected output: 1

 

The substring() Method

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

결과 값은 Banana

 

- 문자열을 원하는 만큼만 잡을 수 있다: str.substring(0, 3). 시작(0)과 끝(3) index. 

 

The replace() Method

let text = 'hello';
text.replace('h' , 'o'); //	결과값 = 'oello'

변수명.replace('바꿔야할 문자', '치환할 문자')

 

The split()  Method

let text = 'hello my friend';
text.split(' '); //	결과값: "hello", "my", "friend"

() 에 나눌 기준을 적으면 된다.

 

기타.

 

추가설명-헷갈리는 개념.

<script>
var str = "Apple, Banana, Kiwi, Pear, Peach";
var result = str.slice(7, 13);
document.write(result); //결과값은 Banana 이다
</script>

<script>
var str = new Array("Apple", "Banana", "Kiwi", "Pear", "Peach");
var result = str.slice(0, 3);
document.write(result); //결과값은 Apple,Banana,Kiwi
</script>

출처: https://aljjabaegi.tistory.com/127

let str = "hello world"

str.slice(3)
// 앞에서부터 3개 이므로 'hel'
str.slice(-3)
// 뒤에서부터 3개 이므로 'rld'

<script>
var str = "Apple, Banana, Kiwi, Pear, Peach";
var result = str.substring(7, 13);
document.write(result); //결과값은 Banana이다. 
</script>

출처: https://aljjabaegi.tistory.com/127 [알짜배기 프로그래머]

<script>
var str = "Apple, Banana, Kiwi, Pear, Peach";
var result = str.substr(7, 6);
document.write(result); //결과값은 Banana 이다.
</script>

출처: https://aljjabaegi.tistory.com/127 [알짜배기 프로그래머]

 

 

공백 문자: 탭문자(\t), Carrige return(\r\n) 및 return 문자(\n)

match(advanced)

정규표현식(advanced)

 

!주의할점!

문자열의 index로 접근은 가능하지만 쓸 수는 없음(read-only)

문자열(string 형식) + [숫자, boolean, 배열] = 문자열로 강제 변환된다. 

ex) var str3 = Code, str3 + 7 = Code7