백틱(`)
✔️ 문자와 변수를 자유롭게 사용할 수 있음
✔️ 여러줄 사용 가능
let value = `이 식의 정답은 ${result} 이다.`;
let value = `이 값은
줄 바꿔쓰기도
가능`;
length
✔️ 문자열 길이
✔️ 주로 가입시 아이디, 비밀버호의 길이 제한할때 사용
let desc = '안녕하세요.';
console.log(desc.length); //6
특정 위치에 접근
✔️ 문자는 배열을 이용한 특정 위치에 접근할 수 있다.
let desc = '안녕하세요';
console.log(desc[2]); //하
toUpperCase( ) / toLowerCase( )
let desc = "hi";
console.log(desc.toUpperCase()); // HI
let desc = "HI";
console.log(desc.toLowerCase()); // hi
str.indexOf( )
✔️ 문자를 인수로 받아 몇번째에 위치해 있는지 알려준다.
✔️ 0부터 계산시작.
✔️ 해당 문자가 없으면 -1을 반환한다.
let desc = "Hi guys. Nice to meet you";
// 해당 문자가 몇번째에 있는지 알려준다.
console.log(desc.indexOf('to')); //14
// 해당 문자가 없으면 -1을 반환한다.
console.log(desc.indexOf('man')); //-1
str.slice(n,m)
✔️ n부터 m까지의 문자열을 반환
let desc = "abcdefg";
//m이 없으면 문자열 끝까지 반환
console.log(desc.slice(2));
//m이 양수면 그 숫자까지 반환(해당 숫자 포함x);
console.log(desc.slice(0,5)); //abced
//m이 음수면 끝에서부터 샘
console.log(desc.slice(2,-2)); //ced
str.substring(n,m)
✔️ n과 m사이 문자열 반환
✔️ n과 m을 바꿔도 동작
✔️ 음수는 0으로 인식
str.substr(n,m)
✔️ n부터 시작해서 m개를 가져옴.
str.trim( )
✔️ 앞 뒤 공백 제거
✔️ 주로 사용자 값을 받을 때 사용.
let desc = " coding ";
desc.trim(); //coding
str.repeat(n)
✔️ 문자열을 n번 반복
문자열 비교
✔️ 문자열도 비교가 가능하다.
✔️ 대문자가 소문자보다 값이 더 크다.
console.log("a"<"c"); //true
연습 예제
✔️ 배열 속 텍스트에서 문자만 뽑아내기
//배열 속 텍스트에서 문자만 뽑아내기
let list = [
"01. 들어가며",
"02. js의 역사",
"03. 자료형",
"04. 함수",
];
//배열을 뽑아내려면 반복문을 돌려야한다.
//새로운 배열을 넣어줄 배열을 만들어줘야한다.
//새로 배열을 넣을 때는 push를 이용해 줄 수 있다.
lew newList = [];
for(let i=0; i<list.length; i++){
newList.push(
list[i].slice(4)
)
}
console.log(newList);
✔️ indexOf로 금칙어 뽑아내기
function hasCola(str){
//indexOf는 값이 없으면 -1을 반환하고, 해당 값이 첫번째에 있으면 0이 반환되면서 false값을 반환하기 때문에
//해당 값이 > -1 를 설정해줘야 한다.
if(str.indexOf("콜라") > -1) {
console.log("금칙어가 있습니다.");
} else{
console.log("통과");
}
}
hasCola("와 사이다가 짱이야!"); //-1
hasCola("무슨소리 콜라가 짱이야");
hasCola("콜라"); //0
✔️ indexOf 안쓰고 includes 쓰면 더 편안.
Reference
- https://www.youtube.com/watch?v=G360D6lqrfo&list=PLZKTXPmaJk8JZ2NAC538UzhY_UNqMdZB4&index=6
반응형
'Frontend > JavaScript' 카테고리의 다른 글
[Javascript] 구조 분해 할당 (0) | 2022.01.07 |
---|---|
[Javascript] Array methods(1) (0) | 2022.01.05 |
[Javascript] 화살표 함수 (0) | 2022.01.04 |
[Javascript] 함수 표현식 (0) | 2022.01.04 |
[Javascript] 함수 (0) | 2022.01.04 |