Digking's cave

JS 기초) 문자열 메소드 (문자열 길이 / 문자열 특정위치 / 문자열 비교/ 문자 대소문자 / 문자 위치찾기 / 특정문자 찾기) 본문

기초/JavaScript

JS 기초) 문자열 메소드 (문자열 길이 / 문자열 특정위치 / 문자열 비교/ 문자 대소문자 / 문자 위치찾기 / 특정문자 찾기)

디깅 2022. 8. 2. 10:39
728x90

' (작은따옴표) 와 "(큰따옴표)는 큰 차이가 없다.

` 는 $를 활용해 변수나 표현식을 사용할 수 있다.

 

` 는 여러줄을 포함 할 수 있다.

`내 이름은 ${name}이다.`

`3 빼기 1 은 ${3-1}이다.`

let desc = `오늘은 맑고
화창하고
즐거운 날씨가 계속됩니다.`

let desc = '오늘은 맑고 화창하고\n즐거운 날씨가 계속됩니다.'

# 문자열 길이 (length)

let desc = '안녕하세요.'
desc.length // 6

# 문자열 특정 위치에 접근가능

인덱스를 활용하여 특정 위치에 접근이 가능하다.

let testa = '안녕하세요.';
testa[2] // '하'

다만, 배열과 다르게 한글자만 변경은 불가능하다.

# 문자열 내에 해당문자 위치 확인

str.indexOf(text) : text 인덱스를 반환

중복된 결과가 있어도 가장 먼저 나온, 첫번째 위치만 반환

let testtext = "Hi guys. Nice to meet you.";
testtext.indexOf('to'); // 14
testtexxt.indexOf('man'); // -1

// 조건문으로 해당문자가 있는지 확인하고 싶을 때
if(testtext.indexOf('Hi') > -1){ //testtext.indexOf('Hi') 로하면 위치 0이 반환되서 false가 된다.
	console.log('Hi가 포함된 문장입니다.');
}

# 특정 범위의 문자열만 추출

str.slice(n,m) : n부터 m까지 문자열반환

m은 없으면 문자열 끝까지 / 양수면 그 숫자까지(포함하지 않음) / 음수면 끝에서부터 센다.

let testn = "abcdefg";

testn.slice(2) // "cdefg"
testn.slice(0,5) // "abcde"
testn.slice(2,-2) // "cde"

# 특정 범위의 문자열 추출

str.substring(n,m) : n과 m 사이 문자열 반환

n과 m을 바꿔도 동작한다.

음수를 허용하지 않아서 음수는 0으로 인식

let testn = "abcdefg";

testn.substring(2,5) // "cde"
testn.substring(5,2) // "cde"

# 특정 시작점부터 해당 개수만큼 가져오기

str.substr(n,m) : n부터 시작해서 m개를 가져온다

let testn = "abcdefg";

testn.substr(2,4) // "cdef"
testn.substr(-4,2) // "de"
728x90

# 대소문자 변경

toUpperCase() 모두 대문자로 변경
toLowerCase() 모두 소문자로 변경
let testb = "Hi guys. Have a good day."

testb.toUpperCase();
// "HI GUYS. HAVE A GOOD DAY."

testb.toLowerCase();
// "hi guys. have a good day."

# 앞뒤 공백제거

str.trim()

let tets = " coding          ";
tets.trim(); // "coding"

# 문자열 반복

str.repeat(n) : 문자열을 n번 반복

let hello = "hello!";
hello.repeat(3); //"hello!hello!hello!"

# 문자열 비교

아스키에 따라 비교된다.

str.codePointAt(0); // 문자에 해당하는 아스키숫자 반환
String.fromCodePoint(n) // 아스키숫자에 해당하는 문자 반환

"a" < "c" //true

"a".codePointAt(0); //97
String.fromCodePoint(97) // "a"

예시1)

let list = [
    "01. 들어가며",
    "02. js의 역사",
    "03. 자료형",
    "04. 함수",
    "05. 배열",
];

let newList = [];

for (let i =0; i < list.length; i++){
    newList.push(list[i].slice(4));
}

console.log(newList)

예시2)

// 금칙어 : 콜라
function hasCola(str){
    if(str.indexOf("콜라")){
        console.log("금칙어가 있습니다.");
    } else {
        console.log("통과");
    }
}

hasCola("와 사이다가 짱이야!"); // 금칙어가 있습니다. -> -1이 반환되어서 true가 됨
hasCola("난 콜라가 좋아"); //금칙어가 있습니다. 
hasCola("콜라"); // 통과 -> 0이 반환되어서 false가 됨


function hasCola(str){
    if(str.indexOf("콜라") > -1){
        console.log("금칙어가 있습니다.");
    } else {
        console.log("통과");
    }
}

hasCola("와 사이다가 짱이야!"); // 통과
hasCola("난 콜라가 좋아"); // 금칙어가 있습니다. 
hasCola("콜라"); // 금칙어가 있습니다.

예시 3)

// 금칙어 : 콜라
// includes 활용 (문자 있으면 true / 없으면 false 반환)

function hasCola(str){
    if(str.includes("콜라")){
        console.log("금칙어가 있습니다.");
    } else {
        console.log("통과");
    }
}

hasCola("와 사이다가 짱이야!"); // 통과
hasCola("난 콜라가 좋아"); // 금칙어가 있습니다. 
hasCola("콜라"); // 금칙어가 있습니다.

 

 

 

 

 

참고 ; https://www.youtube.com/watch?v=4_WLS9Lj6n4&t=1887s

반응형