JavaScript / Object / Array.indexOf(), Array.lastIndexOf() - 일치하는 요소의 위치(인덱스)를 반환하는 메서드
.indexOf()
.indexOf()는 주어진 값과 일치하는 요소의 인덱스를 반환하는 메서드입니다.
문법
array.indexOf( value, start )
- value : 찾으려는 값을 넣습니다.
- start : 검색을 시작할 인덱스 값입니다. 생략 가능하고, 생략했을 경우 값은 0입니다.
- 일치하는 원소가 있다면 인덱스를 반환합니다. 여러 개 있으면 처음 원소의 인덱스를 반환합니다. 없다면 -1을 반환합니다.
예제
배열 원소의 인덱스는 0부터 시작합니다. 즉, 첫번째 원소의 인덱스는 0, 두번째 원소의 인덱스는 1입니다.
[ 'a', 'b', 'c', 'd' ].indexOf( 'a' )
문자열 a의 인덱스인 0을 반환합니다.
[ 'a', 'b', 'c', 'd' ].indexOf( 'b' )
문자열 b의 인덱스인 1을 반환합니다.
[ 'a', 'b', 'c', 'c' ].indexOf( 'c' )
문자열 c가 여러 개 있으면 첫번째 원소의 인덱스 2를 반환합니다.
[ 'a', 'b', 'c', 'd' ].indexOf( 'f' )
문자열 f가 없으므로 -1을 반환합니다.
[ 'a', 'b', 'a', 'c' ].indexOf( 'a', 1 )
문자열 a를 1 인덱스부터 검색합니다. 따라서 2를 반환합니다.
[ '1', 1, 'a', 'b' ].indexOf( 1 )
데이터 타입도 같은 것을 찾습니다. 1을 반환합니다.
.lastindexOf()
.lastIndexOf()는 .indexOf()와 달리 뒤에서부터 검색합니다.
문법
array.lastIndexOf( value, start )
- value : 찾으려는 값을 넣습니다.
- start : 검색을 시작할 인덱스 값입니다. 생략 가능하고, 생략했을 경우 제일 뒤에서부터 검색합니다.
- 일치하는 원소가 있다면 인덱스를 반환합니다. 일치하는 원소가 여러 개 있다면 가장 뒤에 있는 원소의 인덱스를 반환합니다. 없다면 -1을 반환합니다.
예제
document.write( [ 'a', 'a', 'b', 'c', 'd' ].indexOf( 'a' ) );
.indexOf()라면, 앞에서부터 검색했을 때 처음 나오는 문자열 a의 인덱스인 0을 반환합니다.
document.write( [ 'a', 'a', 'b', 'c', 'd' ].lastIndexOf( 'a' ) );
.lastIndexOf()라면, 뒤에서부터 검색했을 때 처음 나오는 문자열 a의 인덱스인 1을 반환합니다.
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 / Object / Math.max(), Math.min()
Math.max(), Math.min() Math.max()는 주어진 값 중에서 최댓값을, Math.min()은 최솟값을 반환합니다. 문법 Math.max( number1, number2, number3, ... ) Math.min( number1, number2, number3, ... ) 예제 1 10, 20, 30 중에서 최댓값과 최솟값을 구합니다. <!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>Math.max( 10, 20, 30 ) : ' + Math.max( 10, 20, 30 ) + '</p>' ); document.write( '<p>Math.min( 10, ...
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.writeln()
.writeln() .writeln()은 문서에 문자, 코드 등을 쓰는 메서드입니다. .write()와 다른 점은 줄바꿈 기호가 들어간다는 것입니다. 예제 .writeln()에는 줄바꿈 기호가 들어갑니다. 하지만 HTML 특성 상 한 칸 띄어쓴 것처럼 보입니다. pre 태그로 감싸면 줄바꿈이 제대로 표현됩니다. <!doctype html> <html lang="ko"> <head> <meta charset="utf-8"> <title>JavaScript</title> <style> body { font-family: Consolas, monospace; } </style> </head> <body> <p><strong>document.write</strong></p> <script> document.write( ...
한 줄 주석 한 줄 주석은 //로 만듭니다. // single line comment // 앞은 코드로 처리하고, // 뒤는 주석으로 처리합니다. 예를 들어 var jb = 'hi'; // Comment 라고 var jb = 'hi';는 코드로 인식합니다. 여러 줄 주석 여러 줄을 주석으로 만들 때는 /*와 */로 둘러쌉니다. /* Comment 1 Comment 2 */ 읽기 좋게 다음과 같은 모양으로 만들기도 ...
JavaScript / 함수 / parseFloat(), parseInt() - 문자열을 수로 바꾸는 함수
parseFloat() parseFloat()는 문자열을 실수로 바꾸는 함수입니다. 문법 parseFloat( string ) 수로 시작할 때 그 수를 실수로 바꿉니다. 띄어 쓰기로 여러 개의 수가 있으면 첫번째 수만 바꿉니다. 공백으로 시작하면 공백은 무시합니다. 수가 아닌 문자로 시작하면 NaN을 반환합니다. 예제 <!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>parseFloat( '12.34' ) : " + parseFloat( '12.34' ) + "</p>" ); document.write( "<p>parseFloat( ' 12.34' ...
JavaScript / 함수 / 함수 선언하고 호출하기
함수 선언하기 방법 1 function functionName( argument1, argument2, ... ) { // Do Something } 방법 2 var functionName = function( argument1, argument2, ... ) { // Do Something }; 함수 호출하기 functionName( value1, value2, ... ); 방법 1로 함수를 선언한 경우, 함수 호출은 함수 선언 전 또는 함수 선언 후에 할 수 있습니다. functionName( value1, value2, ... ...
JavaScript / 함수 / Number() / 문자열을 숫자로 변환하는 함수
Number() Number()은 문자열을 숫자로 변환하는 함수입니다. 문법 Number( object ) object : 문자열 또는 문자열을 값으로 하는 변수 등을 입력합니다. 숫자로 변환할 수 없는 값인 경우 NaN을 반환합니다. 예제 변수 c의 값은 문자 1과 문자 2를 더한 12입니다. 변수 d의 값은 숫자 1과 숫자 2를 더한 3입니다. <!doctype html> <html lang="ko"> <head> <meta charset="utf-8"> ...
JavaScript / Object / document.characterSet / 문자 인코딩 반환하는 속성
.characterSet .characterSet은 문서의 문자 인코딩을 반환하는 속성입니다. 예제 <!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.characterSet : " + document.characterSet + "</p>" ); </script> </body> </html>
JavaScript / 조건문 / if, else if, else
특정 조건 만족 시 어떤 작업을 수행하고 싶을 때 사용하는 것이 if, else if, else입니다. 문법 if ( condition1 ) { statement1 } condition1을 만족하면 statement1을 실행합니다. if ( condition1 ) { statement1 } else { statement2 } condition1을 만족하면 statement1을 실행하고, 만족하지 않으면 statement2를 실행합니다. if ( condition1 ) { statement1 } else if ( ...