본문 바로가기
수업 일지/Front End

47일차 - 문자열 관련 문자, 연산, 메소드

by 쿠쿠씨 2022. 3. 15.
반응형

 

이스케이프 문자

 

문자열 내에서 따옴표, 역슬래쉬 같은 문자를 사용할 경우 이스케이프 문자를 사용합니다.

' → \'

" → \"

\ → \\

 

문자열 비교 연산자

 

== : 피연산자가 서로 같으면 true를, 아니면 false를 반환합니다.

=== : 피연산자가 같고 자료형도 같으면 true를, 아니면 false를 반환합니다.

 → ==보다 더 엄격하게 비교합니다.

 

→ == 연산자 사용시 숫자 1 과 문자 '1'을 같다고 판단합니다.

→ === 연산자 사용시 숫자 1 과 문자 '1'을 다르다고 판단합니다.

 

→ 두 객체 비교 시 두 연산 모두 false를 반환합니다.

 

문자열 길이 : length

 

문자열의 길이를 반환합니다.

 

문자열 추출 메소드 : slice(), substring(), substr()

 

slice(start, end)

 

start ~ end-1 위치의 문자열을 추출합니다. (위치는 0부터 시작합니다.)

매개변수는 음수가 가능합니다. (맨 마지막 글자가 -1)

end 생략 시 start 이후의 모든 문자열을 추출합니다.

 

substring(start, end)

 

start ~ end-1 위치의 문자열을 추출합니다. (위치는 0부터 시작합니다.)

매개변수는 음수가 불가능합니다.

end 생략 시 start 이후의 모든 문자열을 추출합니다.

 

substr(start, length)

 

start 위치부터 length만큼 길이의 문자열을 추출합니다. (위치는 0부터 시작합니다.)

매개변수는 음수가 가능합니다. (맨 마지막 글자가 -1)

end 생략 시 start 이후의 모든 문자열을 추출합니다.

 

문자열 치환 메소드 : replace()

 

replace('A', 'B')

 

첫 번째 'A' 문자열을 찾아 'B'로 대체합니다.

문자열은 대•소문자를 구분합니다.

/A/i : 대•소문자 구분 안합니다. (ignore)

/A/g : 전체 모든 A 문자열을 변경합니다. (global)

 

•소문자 변환 메소드 : toUpperCase(), toLowerCase()

 

toUpperCase() : 문자열을 대문자로 변환합니다.

toLowerCase() : 문자열을 소문자로 변환합니다.

 

문자열 연결 메소드 : concat()

 

concat(join,str2) : str2 문자열과 연결합니다. join은 연결할 때 사용할 문자열입니다.

 

공백 제거 메소드 : trim()

 

trim() : 문자열 양쪽에서 공백을 제거합니다.

 

문자 추출 메소드 : charAt()

 

charAt(index) : 특정 위치(index)의 문자를 추출합니다. index는 0부터 시작합니다.

 

문자열 나누기 : split()

 

split()

구분 기호로 문자열로 나누어 배열로 반환합니다.

구분 기호를 생략하면 반환된 배열의 index[0]에 전체 문자열이 포함됩니다. 

구분 기호를 ""으로 하면 한 문자씩 나누어 배열로 반환합니다.

 

문자열 검색 메소드

 

indexOf()

 

일치하는 첫 문자열을 찾아 시작 위치를 반환합니다.

두 번째 매개변수를 사용하여 검색 시작위치를 설정할 수 있습니다.

 

lastIndexOf()

 

일치하는 마지막 문자열을 찾아 시작 위치를 반환합니다.

두 번째 매개변수를 사용하여 검색 시작위치를 설정할 수 있습니다.

 

includes() : 해당 문자열을 포함하면 true, 포함하지 않으면 false를 반환합니다.

 

startsWith() : 해당 문자열로 시작하면 true, 시작하지 않으면 false를 반환합니다.

 

endsWith() : 해당 문자열로 끝나면 true, 끝나지 않으면 false를 반환합니다.

 

태그 요소 가져오기

 

웹 브라우저에서 입력한 값을 가져올 수 있습니다.

 

1) forms, elements 객체 이용해서 input 값 가져오기

 

document.forms[index].elements[index]

form 태그가 많을 때 사용합니다.

index는 0부터 시작합니다.

1번째 폼 : forms[0], 2번째 폼 : forms[1], 3번째 폼 : forms[2], ...

1번째 요소 : elements[0], 2번째 요소 : elements[1], ...

.value 로 값을 가져옵니다.

 

2) name 속성값을 이용해서 input 값 가져오기

 

document.폼의name값.요소의name값

.value 로 값을 가져옵니다

반응형

댓글