일단 문자열은 외워야 할 것들도 많아서 목표도 적는게 좋을 것 같다.
- 문자열의 속성과 메소드를 이용해 원하는 형태로 만들 수 있다.
- 문자열의 length라는 속성을 활용해 길이를 확인할 수 있다. str.length
- 문자열의 글자 하나하나에 접근할 수 있다. str[1]
- 문자열을 합칠 수 있다. word1 + " " + word2
- 문자열을 원하는 만큼만 선택할 수 있다. str.slice(0, 3) 또는 str.substring(0, 3)
- 영문을 모두 대문자로 바꿀 수 있다. str.toUpperCase()
- 영문을 모두 소문자로 바꿀 수 있다. str.toLowerCase()
- 문자열 중 원하는 문자의 index를 찾을 수 있다 str.indexOf('a') 또는 str.lastIndexOf('a')
- 문자열 중 원하는 문자가 포함되어 있는지 알 수 있다. str.includes('a')
일단은 이러하다. 쌤이 말씀하시길 이것들은 가장 기초적이면서 자주 쓰이는 것이니 꼭 외워두라고 하셨다.
📌 str [ index ]
이것은 예제로 보는 게 더 빠를 듯 하다. 그래도 간단히 설명하자면 들어가는 값에 하나하나 접근이 가능하다는 점이다.
let str = 'CodeStates'
console.log(str[0]) ; 👉 'C'
console.log(str[3]) ; 👉 'e'
console.log(str[4]) ; 👉 'S'
❗ 자바스크립트에서는 0번째가 가장 첫번째다.(0번째,첫번째,두번째 ...)
그러나 이것은 index로 접근만 가능할 뿐 쓸 수가 없다. 이 말은 아래 예제를 통해 확인이 가능하다. 즉, 새로 할당하지 않는 한 그 값은 바뀌지 않는다. (read - only)
let str = 'CodeStates'
str[0] = 'G'
console.log(str); 👉 'CodeStates' not 'GodeStates'
📌 + 연산자
string타입과 다른 타입 사이에 +연산자를 쓰면, string 형식으로 변환한다. toString 이라는 함수도 있다. toString이라는 함수는 지정된 객체를 나타내는 문자열을 반환한다.
이에 관해서는 아래 MDN으로 확인이 가능하다.
toString 함수_MDN
이 + 연산자에 관한 예시를 살펴보도록 하자
let str1 = 'Code';
let str2 = 'States'
let str3 = '1' 👉 요기 따옴표에 있는 것이기 때문에 문자열로 취급
console.log(str1 + str2); 👉'CodeStates'
console.log(str3 + 7); 👉 '17' // 문자열1과 숫자타입 7이 더해지는게 아니다. 결과는 8이 아님
❗ str1.concat(str2, str3...) 👉 str1 + str2 + str3
ex) var str1 = 'code'
var str2 = 'states'
var str3 = 'love'
str1.concat(str2,str3) 👉 'codestateslove'
+연산자가 있으면 다른 연산자도 있다. 그에 관한 건 아래 링크에서 자세히 살펴볼 수 있으며, 여기 블로그 글에는 가장 많이 쓰이는 걸 올리도록 하겠다.
표현식과 연산자_MDN
📢 자주 쓰이는 연산자
- 할당 x = y 👉 x = y
- 덧셈 할당 x += y 👉 x = x + y
- 뺄셈 할당 x -= y 👉 x = x - y
- 곱셈 할당 x = y 👉 x = x y
- 나눗셈 할당 x /= y 👉x = x / y
- 나머지 연산 할당 x %= y 👉 x = x % y
- 지수 연산 할당 x = y 👉 x = x y
- 왼쪽 이동 연산 할당 x <<= y 👉 x = x << y
- 오른쪽 이동 연산 할당 x >>= y 👉 x = x >> y
- 부호 없는 오른쪽 이동 연산 할당 x >>>= y 👉 x = x >>> y
📌 length Property
문자열의 전체길이를 반환한다는 것이다. 자주 쓰이는 프로퍼티이고 for문 문제에서 이렇게도 쓰일 수 있구나 해서 이마를 쳤던 게 있었다. 그것에 관해서는 코플릿 복습 카테고리에 정리해두려고 한다. 아래는 예시이다.
let str = 'CodeStates'
console.log(str.length) 👉 10
📌 indexOf 메서드 str.indexOf(searchValue)
arguments 는 찾고자 하는 문자열,return value 처음으로 일치하는 index, 찾고자 하는 문자열이 없으면 -1
lastindexOf는 문자열 뒤에서 부터 찾는다. 예제를 살펴보자.
'Blue Whale'.indexOf('Blue'); 👉 0
'Blue Whale'.indexOf('blue'); 👉 -1
'Blue Whale'.indexOf('Whale); 👉 5
'Blue Whale Whale'.indexOf('Whale'); 👉 5
'canal'.lastIndexOf('a'); 👉 3
❗ 주의 공백도 체크한다. 'Blue Whale'.indexOf('Whale); 👉 5 와 같은 경우를 살피도록 한다.
인터넷 익스플로러 같은 구형에서는 먹히지 않는 str.includes(searchValue) 있다.
ex)
'Blue whale'.includes('blue') 👉 true
'Blue whale'.includes('blue') 👉 false