TIL 05.02

blueprint·2022년 5월 2일

JavaScript TIL

멋쟁이사자처럼 프론트엔드 스쿨

목록 보기

18/24

1. String

Docs

프로퍼티

.length : 문자열의 길이를 나타냄

메서드

indexOf()
: 호출한 String 객체에서 주어진 값과 일치하는 첫 번째 인덱스를 반환
일치하는 값이 없을 경우 -1 반환
lastIndexOf()
: 주어진 값과 일치하는 부분을 역순으로 탐색하여 최초로 마주치는 인덱스를 반환
탐색 위치는 끝에서부터지만 반환값은 앞에서부터의 위치로 반환
일치하는 부분 없을 경우 -1 반환
search()
: 정규표현식과 String 객체 간에 같은 것을 찾기 위한 검색을 실행

💡 indexOf vs search

둘의 공통점
1. 처음 검색된 값 반환
2. 일치하는 값이 없을 경우 -1 반환

차이점
1. search : 정규식 사용 허용 / 다른 시작 위치를 인수로 지정 불가능
2. indexOf : 정규식 사용 비허용 / 다른 시작 위치를 인수로 지정 가능

정규표현식을 사용하려면 search를, 좀 더 빠르고 간단하게 이용하려면 indexOf를 쓰는 편이 용이함

slice(시작인덱스, 종료인덱스)
: 시작 인덱스부터 종료 인덱스 - 1까지 반환
substr(시작위치, 길이)
: 시작 인덱스부터 길이만큼 반환 (업데이트로 인해 deprecated 됨, 사용하지 말 것)
replace()
: 어떤 패턴에 일치하는 일부 또는 모든 부분이 교체된 새로운 문자열을 반환
- 패턴: 문자열, 정규식(RegExp)
- 교체 문자열: 문자열이나 호출된 함수
toUpperCase()
: 문자열을 대문자로 변환해 반환 (잘 사용하지 않음)
toLowerCase()
: 문자열을 소문자로 변환해 반환 (잘 사용하지 않음)
includes()
: 하나의 문자열이 다른 문자열에 포함되어 있는지를 판별하여 boolean 데이터로 반환
startsWith()
: 어떤 문자열이 특정 문자로 시작하는지 확인하여 boolean 데이터로 반환
endsWith()
: 어떤 문자열이 특정 문자로 끝나는지 확인하여 boolean 데이터로 반환

2. Boolean

🎵 Now Playing - boolean은 혼란스럽다

!는 부정연산자로 true → false, false → true로 반환
!!는 부정을 부정하기 때문에 다른 타입의 데이터를 boolean 타입으로 명시적으로 형 변환 하는 데 사용 (undefined나 null을 위해)

✔️ 꼭 알아야 하는 세 가지

console.log(`${!!undefined}`); // false
console.log(`${!!null}`); // false
console.log(`${!!NaN}`); // false

논리가 없는 것들이기 때문에 이해하려고 하지 말 것
왜? 혹은 뭐였지? 라고 생각이 들 때 확인하면서 사용할 것

예제 1
예제 2
드모르간 법칙

3. object

object의 변수명을 선언해 준 다음 key:value의 형태로 데이터 삽입
${}를 통해 데이터를 불러올 수도 있고, 체이닝 형태로도 값을 삽입하고 불러올 수 있음

💡 잠깐 맛보기!

프로토타입은 어떻게 사용할까?

아래 예시처럼 replace는 String.prototype.replace()으로 앞에 prototype이 붙으므로 인스턴스에 붙여서 사용
Docs
console.log(String(10));
conosle.log('1234'.replace('23','99'));
String.fromCharCode()처럼 prototype이 붙지 않은 경우에는 String 그대로 사용
Docs
console.log(String.fromCharCode(189, 43, 190, 61));