비개발자를 위한 Javascript 알아가기 #4

4,266 views
4,196 views

Published on

Javascript 조건문과 반복문

Published in: Education

비개발자를 위한 Javascript 알아가기 #4

  1. 1. For non-developers! Learn Javascript Programming! ! Learning contents with! Conditional statement! ! ! ! ! ! Kim min tae @ibare! NCSOFT http://ibare.kr https://medium.com/@ibare #4
  2. 2. 조건 그리고 흐름 비가오고 있나요? 오늘 기온이 몇도인가요? 내가 좋아하는 영화는? 런닝머신을 시작한지 한시간이 되었나요? 김치찌개의 간이 맞나요? 운동장 10바퀴 돌아!
  3. 3. 조건 그리고 흐름 어떤 비교가 맞느냐? or 틀리냐? 용어가 조금 익숙해지면 Yes or No true or false !0 or 0
  4. 4. 비교 연산자의 종류 크다, 작다, 같다 >, <, == 크거나 같다, 작거나 같다, 같지 않다 >=, <=, != 완전히 같다, 완전히 다르다 ===, !==
  5. 5. 논리 연산자로 비교 확장 조건 A 그리고 조건 B 그리고 … (A > 1 && B < 1 && …) 조건 A 또는 조건 B 또는 … (A > 1 || B < 1 || …) 조건 A 그리고 조건 B 또는 조건 C 그리고 조건 D (A > 1 && B < 1) || (C < 1 && D > 1)
  6. 6. 조건에 따른 흐름 종류 1 2 3 C Yes 1 32 C 4 5 Yes No 1 V C1 C2 C3 CD 2 6 3 4 5 if if else switch 조건(C)이 맞으면 2를 수행 조건이 맞으면 2를 수행, 조건이 틀리면 3을 수행 조건이 C1이면 2를, C2면 3을, C3면 4를! 모두 아니면 5를 수행
  7. 7. 조건에 따른 흐름 반복 1 2 3 C No Yes 1 2 3 C No Yes 1 2 3 C No Yes for while do while 조건(C)이 맞는 동안 2를 수행 조건이 맞는 동안 2를 수행 2를 수행한 후 조건이 맞으면 다시 2를 수행
  8. 8. 비가오고 있나요? 출근 준비 ! ! if (비가 오는가) {! 우산을 챙긴다! }! ! 출근 1 2 3 C Yes
  9. 9. 오늘 기온이 몇도인가요? 1 32 C 4 5 Yes No 출근 준비 ! ! if (오늘 기온) { ! 두꺼운 옷 입기! } else {! 앏은 옷 입기! }! ! 출근
  10. 10. 내가 좋아하는 영화는? switch (영화) {! case ‘그래비티’:! 끝내줘!! case ‘죽은시인의사회’:! 감동이야!! case ‘반지의제왕’:! 말이 필요없지!! default:! 싫어!! } 1 V C1 C2 C3 C4 2 6 3 4 5
  11. 11. 운동장 10바퀴 돌아! for(10바퀴) {! 뛰어! } 1 2 3 C No Yes
  12. 12. 런닝머신을 시작한지 한시간이 되었나요? while(시간) {! 뛰어! } 1 2 3 C No Yes
  13. 13. 김치찌개의 간이 맞나요? do {! 소금 투하! } (간이 맞나)! 1 2 3 C No Yes
  14. 14. 운동장 10바퀴 돌아!! for vs. while
  15. 15. Javascript! 대충 비교하기 vs. 확실히 비교하기 if (1 == 1)! if (1 == ‘1’)! if (1 === ‘1’) true true false 언제나 확실히 비교하기 연산자를 사용하는길 권고합니다
  16. 16. 실습 #1 - 1부터 10까지 숫자 표시하기! * HTML 버전
  17. 17. 실습 #1 - 1부터 10까지 숫자 표시하기! * Javascript 버전
  18. 18. 실습 #1 - 1부터 10까지 숫자 표시하기! * 홀짝는 빨간색, 짝수는 파란색
  19. 19. 실습 #1 - 1부터 10까지 숫자 표시하기! * 홀짝수를 CSS를 이용하기
  20. 20. 1 “다음시간에”;! 2 “잘자요~~; Unclosed string.

×