생활 웹디자인

코스 전체목록

닫기

데이터형

본 수업은 폐지 예정입니다. 자바스크립트 언어 수업웹브라우저 자바스크립트로 수업이 리뉴얼 되었기 때문에 이것을 이용해주세요.

데이터형(data type)

미리 정의되어 있는 특성 값들을 가진 데이터 셋트. 상수라고 하며 변수와는 다르게 변할 수 없다.

문자열(string)

문자를 표현한다. 작은 따옴표(')나 큰 따옴표(")로 묶어서 사용한다.

example1.html - (jsfiddle, github)

<!DOCTYPE html>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >
		<script>
			var var1 = 'codingeverybody';
			var var2 = '1337';
			alert(var1 + var2);
			// 문자 'codingeverybody1337';
		</script>
	</head>
</html>

수(number)

수를 작은 따옴표나 큰 따옴표 없이 기술하면 수가 됨

example2.html - (jsfiddlegithub)

<!DOCTYPE html>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >
		<script>
			var val1 = 10;
			var val2 = 20;
			//30
			alert(val1 + val2);
		</script>
	</head>
</html>

불린(boolean)

비교에 사용되며 true와 false만을 값으로 가진다. (참조 : 조건문편)

example3.html - (jsfiddlegithub)

<!DOCTYPE html>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >
		<script>
			var result = 1 == 2;
			alert(result);
			if (result) {
				alert('같다');
			} else {
				alert('다르다');
			}
		</script>
	</head>
</html>

배열(array)

연관되어 있는 값들을 하나로 묶어서 관리하기 위해서 사용됨. (참고 : 배열편)

example4.html - (jsfiddlegithub)

<!DOCTYPE html>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >
		<script>
			var week = new Array('월', '화', '수', '목', '금', '토', '일');
			alert(week);
			var student = ['철수', '영희', '진혁'];
			alert(student[0]); ​
		</script>
	</head>
</html>

객체(object)

연관되어 있는 값과 함수를 하나로 그룹핑해서 관리하기 위해서 사용됨 (참고 : 객체편)

undefined

변수가 정의되지 않았거나, 선언은 되었는데 정의되지 않은 경우

example5.html - (jsfiddlegithub)

<!DOCTYPE html>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >
		<script>
			var val1;
			alert(val1); // undefined
		</script>
	</head>
</html>

null

값이 없음을 명시적으로 표현할 때

example6.html - (jsfiddlegithub)

<!DOCTYPE html>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >
		<script>
			var val1 = null;
			alert(val1);
		</script>
	</head>
</html>

typeof

자바스크립트에서 데이터 타입을 확인하는 방법

example7.html - (jsfiddlegithub)

<!DOCTYPE html>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >
		<script>
			var value = 1;
			alert( typeof value); // number

			var value = 'one';
			alert( typeof value); // string
		</script>
	</head>
</html>

형변환

형변환이란 데이터의 타입을 변환하는 것인데 자바스크립트는 자동으로 형변환을 시도한다.

example8.html - (jsfiddlegithub)

<!DOCTYPE html>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >
		<script>
			alert(1 + 1);// 2
			alert(1 + '1');// 11, 숫자 1을 문자 1로 자동으로 형변환함
			alert(true + 1);// 2 블리언 true를 숫자 1로 자동으로 형변환
			if (undefined) {
				alert(true);
			} else {
				alert(false)
			}
		</script>
	</head>
</html>

명시적인 형변환을 하기 위해서는 함수 Boolean, String, Number를 이용한다.

example9.html - (jsfiddlegithub)

<!DOCTYPE html>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >
		<script>
			alert( typeof String(1));
			alert( typeof Number('1'));
			alert( typeof Boolean(1));
		</script>
	</head>
</html>

댓글

댓글 본문
버전 관리
egoing
현재 버전
선택 버전
graphittie 자세히 보기