[TIL] 플레이데이터 인공지능 24기 DAY 103

황예빈·2022년 12월 22일

플레이데이터 TIL

목록 보기

18/21

html에서 javascript의 출력

	<h1>자바스크립트의 수행 결과 출력</h1>
	<hr>
	<script type="text/javascript">
	window.alert("어디에 출력될까?....1");
	console.log("어디에 출력될까?....2");
	document.write("어디에 출력될까?....3"); //DOM 기술을 활용하여 출력

window.alert() : 경고메세지 출력
window.prompt() : 사용자로 부터 한 행 정도의 데이터를 입력 받을 때 사용
console.log() : 콘솔 창에 출력
document.write() : 도큐먼트 내에 출력
window.confirm() : 사용자로 부터 yes/no를 입력받고 싶을 때

	var num=window.prompt("숫자를 한 개 입력하세요.");
    document.write("<h1>"+(num+10)+"</h1>");
    document.write("<h1>"+(num-10)+"</h1>");
    document.write("<h1>"+(num*10)+"</h1>");
    document.write("<h1>"+(num/10)+"</h1>");
    document.write("<h1>"+(num%100)+"</h1>");

다음과 같이 숫자 하나를 받아들이는 창이 나타남
이 때 나머지 연산은 num 값을 전부 number형으로 계산하지만,
+는 문자열 결합 연산으로 처리한다.
문자형으로 계산하고 싶으면 Number()를 사용해 형변환 해줘야한다.

자바스크립트의 변수선언과 활용

var v1;
	document.writeln(v1+"<br>");
	v1 = 100;
	document.writeln(v1+"<br>");
	v1 = '가나다';
	document.writeln(v1+"<br>");	
	var v1 = true;
	document.writeln(v1+"<br>");	
	v1 = 123;
	document.writeln(v1+45+"<br>");	
	v1 = '123';
	document.writeln(v1+45+"<br>");

변수 선언 시 var 를 사용
자동으로 undefined 라는 리터럴 값이 저장되어있음. -- error가 아니다.
단, 파이썬처럼 변수를 선언하지 않고 사용하는 것은 불가능 함 - error

	var v1;
	document.write("<li>"+ v1 +"</li>");
	document.write("<li>"+ typeof v1 +"</li>");
	document.write("<li>"+ (v1+10) +"</li>");
	v1 = 100;
	document.write("<li>"+ v1 +"</li>");
	document.write("<li>"+ typeof v1 +"</li>");
	document.write("<li>"+ (v1+10) +"</li>");
	v1 = true;
	document.write("<li>"+ v1 +"</li>");
	document.write("<li>"+ typeof v1 +"</li>");
	document.write("<li>"+ (v1+10) +"</li>");
	v1 = "가나다";
	document.write("<li>"+ v1 +"</li>");	
	document.write("<li>"+ typeof v1 +"</li>");
	document.write("<li>"+ (v1+10) +"</li>");

undefined 에 10을 더하면 NaN 값이 출력됨
숫자와 boolean 형을 연산하면 true는 1 false는 0으로 계산됨
숫자형과 문자열을 더하면 문자열로 계산됨

자바스크립트의 데이터 타입 체크

	document.write("<h2>"+ typeof 100 +"</h2>");
	document.write("<h2>"+ typeof 3.14 +"</h2>");
	document.write("<h2>"+ typeof '가' +"</h2>");
	document.write("<h2>"+ typeof "abc" +"</h2>");
	document.write("<h2>"+ typeof '100' +"</h2>");
	document.write("<h2>"+ typeof true +"</h2>");
	document.write("<h2>"+ typeof undefined +"</h2>");

데이터 타입 체크 시, typeof 연산자를 사용
-결과

for each 문

for(var i=0; i <10; i++){
	var rand = Math.random();// 0.0<= rand < 1.0
	console.log(rand);
	console.log(rand*10);
	console.log(Math.floor(rand*10)); // 소수점 이하를 날림
	console.log("-----------------------");

위 과정을 10번 반복함
이 때 주의 할 점은 자바스크립트에서는 블럭단위 변수가 존재하지 않는다는 것이다!

블록단위 변수를 쓰고 싶으면 for문 초기식에 var 가 아닌, let이라고 써야한다.

이때 document.write(i)를 하면 10이 출력되는걸 확인 할 수 있음

조건문

var num=window.prompt("채크하려는 숫자를 입력하세요.");
	if(isNaN(num) || num == '' || num == null ) {
		document.writeln("<span>숫자</span>를 입력해 주세요!!!");
	} else {
		num % 2 == 0 && document.writeln(num+"는 짝수");
		num % 2 == 0 || document.writeln(num+"는 홀수");
	}