프론트엔드 정복하기
JS | String 관련 메소드 본문
string.length
: 문자열의 길이를 반환
https://www.codingfactory.net/10895
string . indexOf ( 찾고싶은 문자열(필수값) , fromIndex(선택값) )
: 문자열 내에서 특정 문자열의 index 값을 리턴한다.
: 문자열이 존재하지 않는다면 -1을 반환함.
: React에서 사용가능
예제
var stringValue = '생활코딩 - 자바스크립트 레퍼런스';
alert(stringValue.indexOf('자바스크립트',0)); // 7
alert(stringValue.indexOf('자바스크립트',2)); // 7, 두번째 인자로 2가 주어지면 탐색의 대상이 '코딩 - 자바스크립트 레퍼런스'로 줄어든다. index 값은 변하지 않는다
alert(stringValue.indexOf('자바스크립트',10)); // -1, '크립트 레퍼런스'에는 '자바스크립트'가 없기 때문에 -1을 리턴한다
**찾고자하는 문자가 여러개 존재한다면, 가장 앞의 문자의 index를 찾는다.
**찾고자하는 문자 여러 개 중 가장 마지막 문자의 index를 찾고 싶다면 'lastIndexOf' 메서드 사용
**점 특수문자(.)를 찾을 때, '.'은 찾았고 정규식(/[.]/)은 못찾았다. (search함수는 반대였음)
string.substring (from, to)
: 특정 구간의 문자열을 추출함
-from : 필수값, 탐색 구간의 시작점
-to : 선택, 탐색구간이 끝나는 점
** from < to => from~to 사이의 문자열 리턴
** from > to => to~from 사이의 문자열 리턴
** from=to => 빈문자열 리턴
-react 사용 가능
: substring과 indexOf를 이용해 특정문자 뒤의 문자열을 도출한 뒤 삭제, 대체 등 수정 가능
string.toLowerCase( )
: 호출 문자열을 소문자로 변환한다.
[ 정규식에서 자주 사용되는 함수 ]
string.search( ' ' )
: 검색한 문자열의 위치값을 내놓음
-0부터 계산함
-공백도 계산함
-찾고자하는 문자가 없으면 -1을 반환
ex) Please visit Tistory! 에서 'Tistory'를 search하면 -> result=13 / P(0)으로부터 13번째에 T가 있음
**점 특수문자(.)를 search할 때, '.'은 못찾고, /[.]/은 찾았다. (indexOf함수는 반대였음)
/찾고자 하는 문자/.test ( string )
: 찾는 문자열이 있는지 없는지 알려준다.
: true or false (boolean)
** 대각선 안에 따옴표 없이 찾고자 하는 문자를 입력하면 된다.
string.replace( 기존문자, 바꿀 문자 )
: 문자열의 일부를 다른 문자열로 바꿔준다.
string.startsWith('특정문자')
string.endsWith('특정문자')
: 특정문자가 string의 시작점(or 끝점)에 있는지 확인
: boolean값 도출
element.getAttribute( 'attributename' )
: 선택한 요소(element)의 특정 속성 값을 가져온다.
ex)
<a href="https://www.codingfatory.net" id="abc">Coding Factory</a>
var jbHref = document.getElementById( 'abc' ).getAttribute( 'href' ); -> abc ID를 가진 a태그의 href 속성을 저장함
document.write( '<p>href : ' + jbHref + '</p>' );
-> 문자열로 'href : https://www.codingfactory.net' 으로 출력됨
**React에서는 getAttribute 메서드를 사용하지 않음/value값을 저장한 state으로 직접 관리한다.
String . repeat( Number )
Number만큼 String을 반복함
**
'abc'.repeat(3.5); // 'abcabcabc' (count will be converted to integer)
(3.5도 가능함?!, 출력되는 개수가 정수로 출력된다면 가능한듯)
getElements.... .className = 'boolah'
=> 클래스 이름 변경
isNaN ( string )
: NaN이란 ) 문자열을 숫자로 변경 시 숫자로 바꿀 수 없는 경우 NaN으로 변환.
: isNaN : NaN 여부를 boolean 값으로 체크한다.
'JavaScript' 카테고리의 다른 글
javascript로 오늘 날짜 구하기 (0) | 2020.07.20 |
---|---|
JS 자식선택자 (0) | 2020.07.07 |
JS | window.onload 함수 (0) | 2020.06.29 |
JS로 css 변경하기 (0) | 2020.06.23 |
Jquery의 $(this).index()를 ---> JS언어로 (0) | 2020.06.23 |