JavaScript / Object / String.startsWith() / 특정 문자열로 시작하는지 확인하는 메서드
.startsWith()
.startsWith()는 문자열이 특정 문자열로 시작하는지 확인한다, IE는 Edge부터 지원한다.
문법
string.startsWith( searchString, length )
- searchString : 검색할 문자열로 필수 요소이다. 대소문자를 구분한다.
- length : 문자열 중 어디까지 검색할지 정한다. 선택 요소로, 값이 없으면 전체 문자열을 대상으로 한다.
예제
- abcde가 a로 시작하는지 검사한다. a로 시작하므로 true를 반환한다.
'abcde'.startsWith( 'a' )
- bcde가 a로 시작하는지 검사한다. a로 시작하지 않으므로 false를 반환한다.
'abcde'.startsWith( 'a', 1 )
- abcde가 A로 시작하는지 검사한다. 대소문자를 구분하므로 false를 반환한다.
'abcde'.startsWith( 'A' )
가장 기본적인 조건문은 if입니다. 하지만 조건식에서 비교할 값이 많다면 코드가 길어지고 가독성이 떨어진다는 단점이 있습니다. 이럴 땐 switch를 사용하는 것이 좋습니다. 문법 switch ( condition ) { case value1: statement1; break; case value2: statement2; break; ... ...
JavaScript / 함수 / String() / 숫자를 문자열로 변환하는 함수
String() String()은 숫자를 문자열로 변환하는 함수입니다. 문법 String( object ) object : 숫자 또는 숫자를 값으로 하는 변수 등을 입력합니다. 예제 변수 c의 값은 숫자 1과 숫자 2를 더한 3입니다. 변수 d의 값은 문자 1과 문자 2를 더한 12입니다. <!doctype html> <html lang="ko"> <head> <meta charset="utf-8"> <title>JavaScript</title> <style> ...
JavaScript / Object / document.URL / 문서의 URL을 반환하는 속성
.URL .URL 속성으로 문서의 URL을 가져올 수 있습니다. 문법 document.URL 예제 문서의 URL을 출력합니다. <!doctype html> <html lang="ko"> <head> <meta charset="utf-8"> <title>JavaScript</title> <style> body { font-family: Consolas, monospace; } </style> </head> <body> <script> document.write( "<p>document.URL : " + document.URL + "</p>" ); </script> </body> </html> JavaScript / Object / Location - URL 정보 가져오는 객체
JavaScript / Object / String.split() / 문자열 분할하는 메서드
.split() .split()은 문자열을 분할하는 메서드입니다. 문법 string.split( separator, limit ) separator에는 분할의 기준을 넣습니다. 예를 들어 쉼표를 기준으로 분할할 때는 ',' 와 같이 합니다. limit로 최대 분할 개수를 정합니다. 선택 사항으로, 값을 정하지 않으면 전체를 다 분할합니다. 예제 1 쉼표를 기준으로 문자열을 분할하는 예제입니다. <!doctype html> <html lang="ko"> <head> <meta charset="utf-8"> <title>JavaScript</title> </head> ...
JavaScript / Object / String.match() / 정규표현식에 맞는 문자열을 찾아 가져오는 메서드
.match() .match()는 정규표현식에 맞는 문자열을 찾아서 배열 객체로 반환합니다. 문법 string.match( regexp ) 만약 정규표현식에 맞는 문자열이 없다면 null을 반환합니다. 예제 Lorem Ipsum Dolor 문자열에서 Lo가 있는지, Lo를 포함한 단어가 있는지, Loi가 있는지 검색하고, 그 결과를 출력하는 예제입니다. <!doctype html> <html lang="ko"> <head> <meta charset="utf-8"> <title>JavaScript | match</title> </head> ...
JavaScript / 데이터 타입 / 문자열(String)
문자열(String) 문자열을 변수의 값으로 사용하려면 작은 따옴표(') 또는 큰 따옴표(")로 감쌉니다. var jb = 'Lorem ipsum dolor'; var jb = "Lorem ipsum dolor"; 문자열에 작은 따옴표가 있다면 큰 따옴표로, 큰 따옴표가 있다면 작은 따옴표로 감쌉니다. var jb = 'Lorem "ipsum" dolor.'; var jb = "Lorem 'ipsum' dolor."; 만약 작은 따옴표와 큰 따옴표가 같이 있다면 역슬래시를 이용합니다. var jb ...
현재 날짜와 시간 가져오기 Date()로 현재 날짜와 시간을 가져온다. <!doctype html> <html lang="ko"> <head> <meta charset="utf-8"> <title>JavaScript</title> <style> body { font-family: Consolas, monospace; font-size: ...
JavaScript / Object / Array.every() / 모든 원소가 조건에 맞는지 검사하는 메서드
.every() .every()는 배열의 모든 원소가 조건에 맞는지 검사하는 메서드입니다. 모든 원소가 조건을 만족하면 true, 하나라도 만족하지 않으면 false를 반환합니다. 예제 배열의 원소를 오름차순으로 검사하고, 조건을 만족하지 않는 원소가 있으면 검사를 중지하고 false를 반환합니다. 모든 원소를 다 검사했는데 조건을 만족하지 않는 원소가 없으면 true를 반환합니다. 원소가 없는 빈 배열은, 조건은 만족하지 않는 원소가 없으므로 무조건 ...
JavaScript / Plugin / Swiper / 슬라이더 플러그인
Swiper는 널리 사용되는 슬라이더 플러그인 중의 하나입니다. 다양한 옵션을 제공하며, 해상도에 따라 다른 옵션을 줄 수 있어 반응형 사이트에 사용하기 좋습니다. 홈페이지 : https://swiperjs.com/ GitHub : https://github.com/nolimits4web/swiper Swiper는 IE를 지원하지 않습니다. 만약 IE 지원이 중요하다면, IE를 지원하는 Swiper 구 버전을 사용하거나 다른 슬라이더를 사용하세요. 기본 사용법 스크립트 파일과 CSS 파일을 연결합니다. 다음은 CDN을 이용하여 연결하는 코드입니다. <script src="https://unpkg.com/swiper@7/swiper-bundle.min.js"></script> <link ...
JavaScript / Object / Element.childElementCount / 자식 요소의 개수를 반환하는 속성
.childElementCount .childElementCount는 자식 요소의 개수를 반환하는 속성입니다. 바로 아래 단계에 있는 자식 요소의 개수만 세고, 자식 요소의 자식 요소의 수는 세지 않습니다. IE는 버전 9 이상에서 사용할 수 있습니다. 예제 <!doctype html> <html lang="ko"> <head> <meta charset="utf-8"> <title>JavaScript</title> <style> body { font-family: Consolas, monospace; } </style> </head> <body> <ul> <li>Lorem</li> <li>Ipsum <span>Dolor</span></li> </ul> <script> var jb = document.getElementsByTagName( ...