String
어떤 데이터가 '' 이나 "" 으로 둘러쌓여 있으면 String 타입의 데이터이다
둘 중 아무거나 써도 상관없지만 회사에 따라 다르므로 회사 규정에 맞춰서 처리하는것이 좋다
참고자료 : airbnb 코딩컨벤션
참고자료 : String Method
대소문자 변환
문자열.toUpperCase()
소문자 -> 대문자로 변환
문자열.toLowerCase()
대문자 -> 소문자로 변환
String형에는 대소문자를 바꿔주는 메서드를 사용해 변환할 수 있다
메서드를 사용하더라도 원본 데이터는 변하지 않으며 메서드를 사용한 값을 다른 변수에 저장할 수 있다
let lastName = 'sk Jin';
let upperLastName = lastName.toUpperCase();
let lowerLastName = lastName.toLowerCase();
console.log(lastName);
console.log(upperLastName);
console.log(lowerLastName);결과
"sk Jin"
"SK JIN"
"sk jin"위의 내용을 보면 원본데이터인 lastName은 변경되지 않는다
문자열.length() - 문자열 길이 구하기
String(문자열) 데이터 타입도
length의 속성을 가질 수 있다
문자열.length() 이 양식이며 길이를 구할 수 있다
회원가입을 받을 때 이름이 10자가 넘어갔는지 체크하거나,
주민번호의 길이가 13자가 넘어갔는지 확인할때 쓰인다
단 여기서 Number(숫자) 데이터 타입은 length의 속성을 가질 수 없으므로,
문자열로 형변환해서 사용해야 한다
예제
let phoneNumber = 01012349876;
console.log(phoneNumber); // 숫자이기 때문에 console로 출력시 0 생략
console.log(phoneNumber.length); // number은 length를 가질 수 없다결과
1012349876
undefined예제
let strPhoneNumber = "01012349876";
console.log(strPhoneNumber);
console.log(strPhoneNumber.length); // string이므로 length 사용가능결과
"01012349876"
11문자열.indexOf(찾을 문자열) - 찾고싶은 문자열의 시작 index 찾기
찾고싶은 문자열의 시작 위치를 찾을 때
indexOf()함수를 사용해서,
찾을 문자열이 시작하는index를 알 수 있다
찾을 문자열이 없으면-1을 반환한다
문자열.indexOf(찾을 문자열)이 양식이다
배열의index속성과 동일하다 (0부터 시작)
이런 특정 문자열을 찾는 함수가 필요한 이유는
댓글 기능에 욕설이 포함되면 달지 못하도록 차단할 때 사용할 수 있기 때문이다
차단할 단어 모음이 존재한다고 하고 사용자가 댓글을 달려고 할 때,
차단할 단어 모음 중에 하나라도 ,
사용자가 작성한 댓글에 포함이 되어있으면 댓글을 달지 못하도록 할 수 있기 때문이다
예제
let info = "JavaScript는 프로래밍 언어이다.";
let firstChar = info.indexOf("프로래밍");
console.log(info, firstChar);결과
JavaScript는 프로래밍 언어이다. 12프로래밍의 시작위치는 문자열의 12번째에서 시작한다
문자열.slice(시작index, 종료index) - 문자열 잘라내기
slice(시작위치, 종료위치)
slice 함수를 사용하면 문자열을 잘라낼 수 있다
여기서 주의해야할 점이 있는데
실제로 요소를 가져오는 범위는 시작 index ~ (종료 index -1) 까지만 가져온다
즉, 종료 위치 전까지의 값만 가져온다
let exSlice = '안녕하세요';
console.log(exSlice.slice(0, 3));결과
"안녕하"위의 예제를 살펴보면 index 3에 위치한 세를 가져오는 것이 아니라
그 앞인 index 2에 위치한 하를 가져온다
그러므로 원하는 문자열을 잘라낼려면
원하는 문자열이 위치한 index값에 1을 더한 값을 종료위치로 넣어야 한다
slice의 예를 몇가지를 더 살펴본다면
- 문자열 전체를 가져오고 싶을 때 시작 위치에만
0넣기
let str = "Hello world!";
let res = str.slice(0);
console.log(res);
// 결과 : Hello world!- 첫번째 문자만 가져오고 싶을 때 시작위치 : 0, 종료위치 : 1
let str = "Hello world!";
let res = str.slice(0, 1);
console.log(res);
// 결과 : H- 마지막 문자만 가져오고 싶을 때 시작위치에 -1
let str = "Hello world!";
let res = str.slice(-1);
console.log(res);
// 결과 : !template literal (다시)
ES6 부터 새로 나온 문자열 연결 방법이다 (변수 사용)
+ 연산자를 사용하지 않으며 백틱 표시(`)로 전체 문자열을 묶어주고
${문자열이 저장된 변수 이름} 을 지정하면 변수값이 template literal에 삽입된다
const myPet = 'armadillo';
console.log(`I own a pet ${myPet}.`);
// 결과 : I own a pet armadillo.예제-1
주소는 무조건 시로 끝나고 시를 없엔 주소를 새로 반환해야 한다
한 주소에서 도, 시는 한번만 들어간다
function sliceCityFromAddress(address) {
let doStr = address.indexOf('도');
let siStr = address.indexOf('시');
let newAddress;
if (siStr !== -1 && doStr !== -1) {
newAddress = address.slice(0, doStr+1) + address.slice(siStr + 1, address.length);
return newAddress;
} else if (siStr !== -1 && doStr === -1) {
newAddress = address.slice(siStr + 2, address.length);
return newAddress;
}
}
let argAddress = '경기도 성남시 분당구 중앙공원로 53';
let argAddress2 = '서울특별시 마포구 망원동'
console.log(sliceCityFromAddress(argAddress));
console.log(sliceCityFromAddress(argAddress2));결과
경기도 분당구 중앙공원로 53
마포구 망원동1. 도, 시가 다있을때
indexOf 함수를 사용해 도, 시가 있는지 찾아본다
만약 도, 시가 없으면 indexOf 함수가 -1을 반환하므로
!== 연산자를 사용해 같지않으면 도, 시가 존재한다
새로 반환할 주소는 시 이름을 삭제해야 하므로
첫번째 인덱스부터 도의 이름까지 slice로 가져오고,
시 이름의 다음 부분부터 끝까지 slice로 가져오면 된다
공백이 있으니 주의해서 가져오기..
2. 도는 없고 시만 있을 때
도가 없고 시만 있을때
도가 없으면 indexOf는 -1을 반환하기 때문에 도를 찾는 indexOf 가 -1이고(=== -1),
시를 찾는 indexOf는 -1이 아니어야(!== -1) 시만 삭제한 새로운 주소를 반환할 수 있다
주소는 시로 끝나므로 시가 끝난 다음의 인덱스를 시작 위치로 삼고,
문자의 끝까지 가져오면된다
(공백이 있으니 잘 생각하기)
여기서 문자열의 length 속성을 사용할 수 있는데,
slice는 실제로 종료위치 전까지의 값을 가져오므로,
length속성을 사용한 문자열의 길이를 넣어주면 된다
(왜냐하면 문자열은 index 0부터 시작하기 때문)
예제-2
getCookie 함수를 구현해주세요
- 아무 인자도 받지 않습니다.
- 쿠키에 접근해서 저장된 현재 쿠키 정보를 가져옵니다.
- wecode_cookie 라는 key값으로 저장된 쿠키정보를 추출하고 그 value 값을 리턴합니다.
const getCookie = () => {
let cookie = document.cookie;
let findCookie = cookie.split(';');
let findIndex = 0;
for (let i = 0; i < findCookie.length; i++) {
if (findCookie[i].includes('wecode_cookie')) {
findIndex = i
}
}
let findCookie2 = findCookie[findIndex].trim().split('=')
return findCookie2[1];
}