JavaScript / Object / String.charAt(), String.charCodeAt()

.charAt(), .charCodeAt()

  • .charAt() : 특정 위치에 있는 문자를 반환합니다.
  • .charCodeAt() : 특정 위치에 있는 문자의 유니코드 값을 반환합니다.

문법 - .charAt()

string.charAt( n )

인덱스의 값이 n인 문자를 반환합니다. 예를 들어

"12345".charAt( 2 )

는 3입니다.

만약 인덱스 n에 문자가 없으면 빈 문자열을 반환합니다.

문법 - .charCodeAt()

string.charCodeAt( n )

인덱스의 값이 n인 문자의 유니코드 값을 반환합니다. 예를 들어

"12345".charCodeAt( 2 )

는 3의 유니코드 값 51입니다.

만약 인덱스 n에 문자가 없으면 NaN을 반환합니다.

예제

<!doctype html>
<html lang="ko">
  <head>
    <meta charset="utf-8">
    <title>JavaScript</title>
		<style>
			body {
				font-family: Consolas, monospace;
			}
		</style>
  </head>
  <body>
		<p><strong>var x = 'abcde';</strong></p>
		<script>
			var x = 'abcde';
			document.write( '<p>x.charAt( 3 ) : ' + x.charAt( 3 ) + '</p>' );
			document.write( '<p>x.charCodeAt( 3 ) : ' + x.charCodeAt( 3 ) + '</p>' );
			document.write( '<p>x.charAt( 10 ) : ' + x.charAt( 10 ) + '</p>' );
			document.write( '<p>x.charCodeAt( 10 ) : ' + x.charCodeAt( 10 ) + '</p>' );
		</script>
  </body>
</html>

Related Posts

JavaScript / Object / document.URL / 문서의 URL을 반환하는 속성

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.startsWith() / 특정 문자열로 시작하는지 확인하는 메서드

JavaScript / Object / String.startsWith() / 특정 문자열로 시작하는지 확인하는 메서드

.startsWith() .startsWith()는 문자열이 특정 문자열로 시작하는지 확인하는 메서드입니다. IE는 Edge부터 지원합니다. 문법 string.startsWith( searchString, length ) searchString : 검색할 문자열로 필수 요소입니다. 대소문자를 구분합니다. length : 문자열 중 어디까지 검색할지 정합니다. 선택 요소로, 값이 없으면 전체 문자열을 대상으로 합니다. 예제 'abcde'.startsWith( 'a' ) 는 abcde가 a로 시작하는지 검사합니다. a로 시작하므로 true를 반환합니다. 'abcde'.startsWith( 'a', 1 ) bcde가 a로 시작하는지 검사합니다. ...

JavaScript / Object / document.title / 문서의 제목을 가져오거나 변경하는 속성

JavaScript / Object / document.title / 문서의 제목을 가져오거나 변경하는 속성

.title .title 속성으로 문서의 제목을 가져오거나 변경할 수 있습니다. 문법 1 document.title 문서의 <title> 태그의 내용을 반환합니다. 문법 2 document.title = 'ABC' 문서의 <title> 태그의 내용을 ABC로 바꿉니다. 예제 문서의 제목 JavaScript를 출력하고, 제목을 CODING FACTORY로 바꿉니다. <!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>' ...

JavaScript / 요소 추가하기 / .createElement(), .createTextNode(), .appendChild()

JavaScript / 요소 추가하기 / .createElement(), .createTextNode(), .appendChild()

자바스크립트를 이용하여 문서에 HTML 요소를 추가할 수 있습니다. 이 때 필요한 자바스크립트 속성은 다음과 같습니다. .createElement() .createTextNode() .appendChild() .createElement()는 요소를 만듭니다. 예를 들어 .createElement( 'h1' ) 은 다음과 같은 코드를 생성합니다. <h1></h1> .createTextNode()는 선택한 요소에 텍스트를 추가합니다. 예를 들어 .createTextNode( 'My Text' ) 는 My Text라는 문자열을 만듭니다. .appendChild()는 선택한 요소 안에 자식 요소를 추가합니다. 다음은 Click이라는 텍스트를 가진 button 요소를 추가하는 예제입니다. <!doctype html> <html ...

JavaScript / Object / document.characterSet / 문자 인코딩 반환하는 속성

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 / Library / Lozad.js / 이미지 Lazy Loading 구현해주는 라이브러리

JavaScript / Library / Lozad.js / 이미지 Lazy Loading 구현해주는 라이브러리

Lazy Loading 웹 페이지의 로딩 속도에 큰 영향을 미치는 것 중의 하나는 이미지입니다. 이를 해결해주는 방법 중의 하나가 Lazy Loading입니다. 웹브라우저에 보이는 영역 안에 있는 이미지는 로드하고, 보이지 않는 부분은 로드하지 않습니다. 밑으로 스크롤하여 이미지가 있는 영역에 도달하면 그 때 이미지를 로드합니다. 이렇게 하면 불필요한 이미지 로딩으로 인한 속도 저하를 방지할 수 있습니다. Lozad.js Lozad.js는 Lazy ...

JavaScript / Object / Element.removeAttribute() / 요소의 속성을 제거하는 메서드

JavaScript / Object / Element.removeAttribute() / 요소의 속성을 제거하는 메서드

.removeAttribute() .removeAttribute()는 요소의 속성을 제거하는 메서드입니다. 문법 element.removeAttribute( attributename ) 예를 들어 document.getElementsByTagName( 'h1' ).removeAttribute( 'class' ); 는 문서의 첫번째 h1 요소의 class 속성을 제거합니다. 예제 첫번째 h1 요소의 class 속성을 제거해서 글자색이 검정색이 됩니다. <!doctype html> <html lang="ko"> <head> <meta charset="utf-8"> <title>JavaScript</title> <style> body { font-family: Consolas, monospace; } .abc { color: red; } </style> </head> <body> <h1 class="abc">Lorem ...

JavaScript / 구문(Statement) 넣는 방법

JavaScript / 구문(Statement) 넣는 방법

자바스크립트는 줄바꿈을 하면 구문(Statement)이 종료된 것으로 봅니다. var jb1 = 'Lorem' var jb2 = 'Ipsum' 하지만, 구문이 완성되지 않았다면 다음 줄까지 해석합니다. 즉 var jb1 = 'Lorem' 과 var jb1 = 'Lorem' 은 같습니다. 구문이 종료되었음을 명확히 표시할 때는 세미콜론(;)을 사용합니다. var jb1 = 'Lorem'; var jb2 = 'Ipsum'; 세미콜론 사용은 선택사항이지만, 한 줄에 여러 구문을 쓸 때는 구문과 구문 사이에 꼭 ...

JavaScript / Object / String.endsWith() / 특정 문자열로 끝나는지 확인하는 메서드

JavaScript / Object / String.endsWith() / 특정 문자열로 끝나는지 확인하는 메서드

.endsWith() .endsWith()는 문자열이 특정 문자열로 끝나는지 확인하는 메서드입니다. IE는 Edge부터 지원합니다. 문법 string.endsWith( searchString, length ) searchString : 검색할 문자열로 필수 요소입니다. 대소문자를 구분합니다. length : 문자열 중 어디까지 검색할지 정합니다. 선택 요소로, 값이 없으면 전체 문자열을 대상으로 합니다. 예를 들어 'abcde'.endsWith( 'e' ) 는 abcde가 e로 끝나는지 검사합니다. e로 끝나므로 true를 반환합니다. 'abcde'.endsWith( 'e', 3 ) abc가 e로 끝나는지 ...

JavaScript / Object / Array.every() / 모든 원소가 조건에 맞는지 검사하는 메서드

JavaScript / Object / Array.every() / 모든 원소가 조건에 맞는지 검사하는 메서드

.every() .every()는 배열의 모든 원소가 조건에 맞는지 검사하는 메서드입니다. 모든 원소가 조건을 만족하면 true, 하나라도 만족하지 않으면 false를 반환합니다. 예제 배열의 원소를 오름차순으로 검사하고, 조건을 만족하지 않는 원소가 있으면 검사를 중지하고 false를 반환합니다. 모든 원소를 다 검사했는데 조건을 만족하지 않는 원소가 없으면 true를 반환합니다. 원소가 없는 빈 배열은, 조건은 만족하지 않는 원소가 없으므로 무조건 ...

JavaScript 강좌