제어문
프로그램의 흐름을 제어 (조건문, 선택문, 반복문)
조건문 - if문
if(조건식) {자바스크립트 코드;};
조건이 참일 경우, 자바스크립트 코드를 실행.
※ =을 한번만 쓰면 대입연산자(변수)로 인식이 되기에 '같다'는 조건을 걸고 싶은 경우 ==을 사용해줘야 한다.
- 첫번째 if문만 참이기에 첫번째 if문의 코드만 실행
var num = 10; : 변수 num에 숫자 10을 대입
if ( num<500 ) {document.write ('hellow') ; } ; : 변수 num이 숫자 500보다 작으면 hellow를 화면에 표기 (참이라 실행)
if ( num>500 ) {document.write ('hellow') ; } ; : 변수 num이 숫자 500보다 크면 world를 화면에 표기 (거짓이라 실행x)
- if문이 참이기에 '습관~'문장이 떴다. 아래는 if문이 아니기에 상관없이 화면에 나온다.
var walkAmount = 10000; : 변수 walkAmount에 숫자 10000을 대입
if ( walkAmount>=10000 ) { : 변수 walkAmount가 숫자 10000보다 큰 경우 뒤의 코드를 진행(참)
document.write ('매우 좋은 ~ 있습니다.' , '<br>') ; } ; : '매우 좋은 ~ 있습니다.'를 출력하고 한 줄 내림.
document.write ('*******') ; } ; : '*******' 을 화면에 출력.
- prompt를 사용한 예제. 넣은 값에 따라 10000이상을 적었으면 '습관'문장이 뜬다.
var walkAmount = Number(prompt( "당신은 하루에 얼마나 걷습니까?" , "5000" ) )
: 변수 walkAmount에 prompt 값(사용자 직접 입력)을 숫자로 치환하여 대입.
※ prompt("텍스트 내용", "기본값-사용자가 직접 입력하는 란-")
if ( walkAmount>=10000 ) { : 변수 walkAmount가 숫자 10000보다 큰 경우 뒤의 코드를 진행(참)
document.write ('매우 좋은 ~ 있습니다.' , '<br>') ; } ; : '매우 좋은 ~ 있습니다.'를 출력하고 한 줄 내림.
document.write ('당신은' + walkAmount + '보 걸었습니다.') ; } ;
: prompt에 사용자가 적은 값을 대입하여 '당신은 ~보 걸었습니다.'라고 화면에 출력.
값이 0인 경우
값을 아예 적지 않으면, 값이 0이 되기에 거짓으로 반영되어 오류가 뜬다.
if문으로 참일 경우, 아닐 경우에 대한 값 나타내기
1) if문 2가지 이상 사용하기
prompt를 사용한 예제. 넣은 값에 따라 다르게 뜨도록 if문을 2가지 설정했다. (60분기준)
var phone = Number(prompt( "당신의 하루 통화량은 몇분인가요?" , "10" ) ) ;
: 변수 phone에 prompt 출력값을 숫자로 치환하여 대입.
if ( phone >= 60 ) {document.write (phone + '분이나 사용하시네요? 많이~') ; } ;
: 변수 phone이 숫자 60보다 크거나 같으면 '(통화분수)분이나 사용하시네요? 많이~'가 화면에 출력
if ( phone < 60 ) {document.write (phone + '분 사용하시네요. 이 정도면 ~') ; } ;
: 변수 phone이 숫자 60보다 작으면 '(통화분수)분 사용하시네요. 이 정도면 ~'이 화면에 출력
2) if문 + else문 사용하기
- 조건 1가지: if(조건식) {자바스크립트 코드;} else {자바스크립트 코드;};
1번째 자바스크립트 코드는 참일 때의 값, 2번째(else문 뒤) 자바스크립트 코드는 거짓일 때의 값이다.
var likeNum = prompt( "좋아하는 숫자를 적으시오." , "0" ) ) ; : 변수 likeNum에 prompt 값을 대입.
document.write("당신이 좋아하는 숫자는 " + likeNum +"이고 ");
: 화면에 '당신이 좋아하는 숫자는 (prompt에서 받은 숫자)이고 ' 가 출력
if ( likeNum % 2 == 1 ) : likeNum을 2로 나눴을 때 나머지가 1이면 (즉, 홀수면)
{ document.write("홀수") ; } : '홀수'를 화면에 출력
else{ document.write("짝수") ; } ; : 아니면(else), '짝수'를 화면에 출력
document.write( "입니다." ); : 화면에 '입니다.' 가 출력
- 조건 2가지 이상 : if(조건식) {자바스크립트 코드;} else if(조건식){자바스크립트 코드;} else {자바스크립트 코드;};
조건이 2가지 이상일 경우, else if를 사용하여 나타낼 수 있다.
var month = prompt( "오늘은 몇월인가요?" , "12" ) ) ; : 변수 month에 prompt 값을 대입.
if ( month >= 3 && month <= 5 ) { document.write("햇살 가득한 봄이네요.") ; }
: month가 3보다 크거나 같으면서 5보다 작거나 같을 때(3~5), '햇살 가득한 봄이네요.' 화면에 출력
else if ( month >= 6 && month <= 8 ) { document.write("여행가기 좋은 여름이네요.") ; }
: 아니면(else) 개중에서도(if) month가 6~8일 때, '여행가기 좋은 여름이네요.' 화면에 출력
else if ( month >= 9 && month <= 11 ) { document.write("독서의 계절, 가을입니다.") ; }
: 그도 아니면(else) 개중에서도(if) month가 9~11일 때, '독서의 계절, 가을입니다.' 화면에 출력
else { document.write("눈 내리는 겨울이네요. 스키타러 가볼까요?") ; } ;
: 전부 아니라면(else), '눈 내리는 겨울이네요. 스키타러 가볼까요?' 화면에 출력
3) 중첩 if문 사용하기
if(조건식) {if(조건식) {자바스크립트 코드;} else {자바스크립트 코드;};} else {자바스크립트 코드;};
조건 두 가지가 다 맞으면 1번째 자바스크립트 코드, 첫 번째 조건만 맞으면 2번째 코드, 둘 다 틀리면 3번째 코드가 뜬다.
var id = "abcd1234" ; : 변수 id에 'abck1234' 값을 대입.
var pw = "1122233" ; : 변수 pw에 '1122233' 값을 대입.
var userid =prompt( "id를 적어주세요" , "" ) ) ; : 변수 userid에 prompt 값을 대입.
var userpw = prompt( "비밀번호를 적어주세요" , "" ) ) ; : 변수 userpw에 prompt 값을 대입.
if ( id == userid ) : 변수 id의 값이 변수 userid의 값과 같다면,
{ if ( pw == userpw) {document.write(id + "님 반갑습니다." ) ; }
: 그 와중에 변수 pw의 값이 변수 userpw의 값과도 같다면, '(id =abcd1234)님 반갑습니다.' 화면에 출력
else { document.write(id +"님 비밀번호가 일치하지 않습니다.") ; } ;
: 변수 pw의 값과 변수 userpw의 값이 다르다면, '(id=abcd1234)님 비밀번호가 일치하지 않습니다.' 화면에 출력
} : 비밀번호에 대한 if문 닫기
else { document.write("아이디가 일치하지 않습니다.") ; } ;
: 변수 id의 값과 변수 userid의 값이 다르다면, '아이디가 일치하지 않습니다.' 화면에 출력
'html+CSS+JS > Java Script' 카테고리의 다른 글
[초보자용 Java Script] 반복문 - while, for (0) | 2019.09.04 |
---|---|
[초보자용 Java Script] 선택문 - switch (0) | 2019.08.30 |
[초보자용 Java Script] 논리 연산자 (0) | 2019.08.21 |
[초보자용 Java Script] 변수 선언 - 문자 / 숫자 연산 (0) | 2019.08.16 |
[초보자용 Java Script] document.write 기본(주석/메모, 문자표기) (0) | 2019.08.14 |