윤인성 모던 웹을 위한 JavaScript + jQuery 입문 3판 16강 - if 조건문 > javascript

윤인성 | 모던 웹을 위한 JavaScript + jQuery 입문 3판 16강 - if 조건문

페이지 정보

조회: 638

본문

※ 영상을 선명하게 보기 안내

유튜브 영상에서 오른쪽하단에 톱니바퀴를 클릭합니다.
팝업목록에서 "품질" 선택하세요.
원하는 해상도를 선택해주세요.

※ 모바일에서 Wifi가 아니라면 데이타가 소진될 수 있으니 주의바랍니다.

윤인성님의 javascript강의 청각장애인을 위한 자막

안녕하세요 모던 웹을 위한 자바스크립트 제이쿼리 입문 3판 16강

되겠구요
이번 강의 부터는 이제 3장의 내용을 진행하도록 하겠습니다
저번에 언급했던 것처럼 이제 삼정 부터는 조금 빠르게 진행이 될 것이기
때문에 조금 뭐 집중을 해서 드셨으면 좋겠습니다
일단 조건문 이란 조건을 판별하는 문장이라고 생각을 해 주시면 되겠습니다
지금까지 살펴보았던 코드는 모두 위에서 아래로 무조건 진행이 되는데요
조건문을 사용을 하게 되면 중간부분을 실행한 하게 하거나 그 부분을
뛰어넘을 수 있습니다
자 그러면 조건문을 본격적으로 나가기 전에 간단하게 뭐 예제 들에서
사용할 코드를 하나 살펴보도록 할게요
현재 시간이나 현재가 며칠 인지 현자가 몇 어린이를 구하는 코디 인데요
간단하게 일단 va 알이 콜 뉴 데이트 라고 적으신 다음에
데이트 점 을 지식의 되면은 제 데이트 개 떼 이게 트로이 알게 다올
스갤 밀리 세컨드 갠 미니 캠 one's 개 세컨드 케 타임 게 타임존
옵셋 utc 데이트 게 gtc 데이 등 등이 엄청나게 나오는 것을 확인할
수 있어요
쭉 보시게 되면 이름만 봐도 대충 아실 수 있을 거에요
개 떼이는 데이가 모를 의미하는 지 모르겠지만 데이 를 가져오게 따 제
데이트는 데이트를 가져오게 따 개수를 11
뭐가 뿌린 지 모르겠지만 열을 가져오게 있구나 개 나머지는 아워 를
가져오게 있구나
미니 슨 뭐 현재 분 을 들고 올 거고 게임방 쓰는 현재 가며 더 린지
들고 겠지 등을 예측을 하실 수 있을 거에요
그래서 여기서 일단 우리는 아버지 를 활용해 보도록 할텐데요
아우 즈를 뽑게 되면 은
u 위치가 현재 시간으로 바뀌게 됩니다
그래서 요런 식으로 입력을 하고
현재 시간을 출력해 보게 되면
저장을 하고 실행해 보도록 할게요 저장을 하고 실행을 보시게 되면 현재
시간은 2시 입니다 라고 나오게 됩니다
그래서 새벽 2시 라는 말이구요 예를 들어서 2pm 라면 1라는
숫자가 들어갑니다
그래서 24시간 제로 값이 나온다고 생각해 주시면 되겠습니다
뭐 이외에도 굉장히 다양한 걸 해볼 수 있을 거예요 예를 들어 데이트
점을 하고
음
난 개 테이트를 한번 써보게 따 뭔지 모르겠지만 써 보겠다고 하시고
실행을 하고 현재 데이트는
데이트 입니다 라고 예제를 변경을 하고 실행을 해 보게 되면
저장하고 실행하면 현재 데이트는 26 이라고 나오게 되는데요
요 26 일하는 이유는 지금 이 강의를 찍고 있는 오늘 날짜가 2017년
5월 26일 이거든요 그래서 26 일이라는 것이 나온다고 생각을 해
주시면 되겠습니다
뭐 다른 것도 가져 보도록 하겠는데요 저번 m 조금 더 나아가기 위해서
우리가 레슬 배우면서 var 은 같은 이름으로 2번 선언할 수 있는데
이게 실수가 되가지고 뭔가 오류를 많이 만들어내기 때문에 레 슬 만들어서
같은 이름으로 2번 선언 하지 못해 못하게 만들었다 고 했는데요
요렇게 데이트로 2번을 선언을 하게 되면 이 다음부터 이 데이터는 숫자
자료형이 되죠 그래서 갠 먼스 라던지 층을 활용할 수 없게 됩니다
그래서 요 이름을 음
그냥 투데이 라고 적을게요 어쨌거나 이번엔 다른 것도 들과 보겠는데 요
몸 현재 연도 들과 볼 기어 켓 하고 연도를 볼걸
뭔가 찾아 보게 되면 대충 개 쏠려 겠죠 그래서
가져와서 축적해 보실 수 있고 오늘 먼스 를 들고 오는 걸 본다 그러면
데이트하고 점 찍은 다음에 대충 보게 되면 캔 먼스 기점 캔 먼스 들과
보고
현재가 몇 분인지 데이트 점 갭 쓰레 보면 대충 이렇게 보시다 보면 현재
몇분 인질 들고 는건 갠 미니 찔 거에요 그래서 다 가져와서 출력해
보도록 하겠습니다
사실 여기서 대부분의 프로그래밍 언어에서 주의해야 되는 게 하나가 나오게
되는데요
실행 결과를 보고 설명하도록 하겠습니다
뭐 3개만 출력해 보도록 할게요 저장을 하고 실행으로 보게 해 보면 아까
언급했듯이 지금의 날짜는 2017년 5월 26일 이기 때문에 2017년
이라고 나오게 되고요
다음 먼 쓰는 5월이 니까 뭐가 나올 것 같은데
자 가 나오게 됩니다 대부분의 프로그래밍 언어에서 공통적으로 되는
내용인데요
대부분의 프로그래밍 언어의 기본 라이브러리 는 월을 찰 때 0부터 되게
됩니다 그래서 현실에서는 1월부터 12월까지 있는데 프로그래밍 언어
내부에서는 영활 부터 11월까지 있습니다
그래서 사가 출력 됬다고 할 수 있는데요 요 내 용 안 꼭 기억을 해
주시면 좋겠습니다
다른 프로그래밍 언어를 하실때도 요런 차이가 발생하기 때문이고요
추가적으로 라이브러리의 따라서는 현재 월을 그대로 내주는 경우도 있어요
따라서 라이브러리나 이런걸 사용을 하실 때 꼭 한번 뭐를 출력을 해서
월을 확인해 보신 다음에 사용을 해주시면 좋겠습니다
어쨌거나 나머진 뭐 우리가 생각하는 그대로 해요 그래서 현재 55분
이니까 55를 출력을 하게 됩니다
자 그러면 이런걸 활용을 해서 본격적으로 조건문을 배워보도록 하겠습니다
녀석들은 일단 잠시 주석처리 에 되도록 할게요
추석 차례 편 해주고 오늘 배울 본격적인 내용 1 조건문 이라고 말씀을
드렸는데요
기본 형식은 무조건 외워 주셔야 됩니다 이프 둥근 괄호 열고 코브라 만
가로 열고 꼬부랑 1 괄호 닫고 라고 할수 있겠구요
이 안에는 불 표현식을 넣게 되어 있고 불 표현식이 참일 때 이 내부로
들어와서 요그 브라운 과로 내부의 내용을 실행을 하게 됩니다
예를 들어서 현재 시간이
5 전이면 오전 이라고 출력을 해 보겠 꼬 오후 라면 5부 라고 실력을
해볼게요
그러면 시간과 관련된 걸 들고 오면 되겠죠
dat 콜 뉴 데이트하고 데이트 점 개다 워즈 에서
아버지를 들고 오도록 하겠습니다 참고적으로 이 코드를 어떻게 우냐고
생각하실 수 있는데요
웨어 저요 치다보면 그래서 첫 번째 것만 내 오시면 은 나중에 데이트
만점 을 입력을 해 보시면 쭉 나오기 때문에 그러한 자동완성 기능을
보시면 될 것 같습니다
그래서 현재 시간을 구한 뒤에
현재 시간이 12시 이전 1 경우 으
4부에 코드를 실행하게 만들어보겠습니다
그냥 간단하게 불 표현식을 써주시면 되요
이러니까 불로 변환될 수 있는 것 그래서 아버지는 cb 보다 작다 라고
써 주시게 되면 오전 이겠죠
이럴 경우에
오전 입니다 를 출력하게 만들어 보도록 하겠 고요
아닐 경우에는 이 풀을 한번 더 써서
아버지가 12 보다 크거나 같을 때 오히 오후입니다 를 출력해 보게
하겠습니다
요 아래 경우는 조건이 현재 시간이 12시
이유일 경우 라고 표기를 하겠습니다
간단한 코디 인데요 저장을 하고 한번 읽어 보시면서
내가 이쁜이 뭔진 모르겠지만 이뿐 은요 과로가 참일 때 요 안에 걸을
실행 한다.고 했으니까 어떻게 결과가 나올지 예측해 보시기 바랍니다
참고적으로 저는 지금 새벽 3시 1분 이구요
실행을 하면 어떤 결과가 나올지 예측을 해 보세요
그러면 예측이 끝났으면 저장을 하고 실행해 보도록 하겠습니다
실행해보면 오전 입니다 라는 글자가 뜨게 됩니다
이프 라는 영어 단어 자체가 마냥 모모 라면 이기 때문에 만약 아버지가
c 보다 작다면 내부의 코드를 실행한다. 라는 간단한 코드 이기 때문에
쉽게 읽으실 수 있을 거라고 생각합니다
자 그러면 여기까지의 내용이 81 페이지에 윗부분까지 되겠구요
이어서 3.2 절의 efl 스 조건문을 살펴보도록 하겠습니다
방금 코드를 보시게 되면 ef 뒤에 현재 시간이 12시 보다 적을 경우
현재 시간이 12시 보다 이상일 경우 라는 두 가지 조건을 사용했는데요
프로그래밍은 무조건 트루아 빨 스 펄스를 결과를 내는 경우가 많기 때문에
요렇게 반대되는 조건을 굉장히 많이 쓰게 되요 근데 요렇게 반대되는
조건인데
조건 비교 를 두 번이나 한다.는 것은 굉장히 쓸데 없는 일이거든요
그래서 프로그래밍 언어는 조금 더 효율적으로 작성하기 위해서
l 스 라는 키워드를 만들었습니다 기본적인 사용 형태는 ex
불 표현식 꼽아 러한 가로 열고 닫고 에이스 꾸 벌어 만 가로 열고 다꾸
가 되는데요
요 위의 경우에는 불 표현식에 참일 때
실행하는 것이 되겠고 요 아래에는 불 표현식이 거짓일 때 실행하는 것이
됩니다
따라서 방금 보았던 오전과 오후 를 나누는 프로그램 같은 경우에는
요렇게 작성을 하게 되면 아워즈 가 12 보다 작을 때 오전 입니다 를
출력을 하게 되고 이 이외의 모든 경우에는 오후입니다 를 출력하게 됩니다
저장을 하고 실행을 해보면
현재 시간이 새벽 3시 5분 이기 때문에 오전 입니다 라는 글자를
출력하게 됩니다
뭐 형식만 외우면 굉장히 내용이 간단하기 때문에 꼭 형식을 외워 주시면
좋겠습니다
그러면 시간을 조금 더 세부적으로 나눠 보도록 할게요 일단 예를 들어서
이쁘 조건문 으로 현재 시간이 6시 보다 적으면 새벽입니다 라고
출력하도록 하겠구요
우리가 저번에 알아 봤던건데
육보다 아워즈 가 크고 & &
아버지가 12 보다 작을 때 요 식을 애쓰는 지는 모르겠다면 이전에 불
표현식을 참고해주시면 좋겠습니다
6시부터 12:0에는 아침 입니다 라고 출력을 하고
12시부터
엔드 음
10 8시까지는
나 집니다 그리고
18시부터
펜 디 엔드
몽 이유는 그냥 전부다
저녁입니다 라고 출력해 보도록 하겠습니다
이렇게 되면 지금 현재 시간이 새벽 3시 7분 이기 때문에
요 앞에 거에서 걸리겠죠 새벽입니다 를 출력을 하고 나머지는 전혀 걸리지
않기 때문에 쭉 지나가게 될 겁니다
네 방금 언급했듯이 요렇게 조건을 여러 번 비교하는 건 그렇게 좋은
형태가 아니거든요
그래서 l 소금 문을 만들고 el 수 금은 안에다가
요거를 넣고 또 l 쏘고 문을 만들고 그 안에다가
요거 를 넣고 또 에이스 구문을 만들고
내부의 다가 요걸 넣어 주시게 되면 조건 비교를 아까보다 훨씬 적게 하게
될겁니다
6시 이전 있기만 하면 아래 꼭 그냥 검사 안하고 곧바로 종료가 되어
버리니까요 그런데 꾸 부러운 가르고 굉장히 만든 많으니까 보기가 힘들 정
근데 자바스크립트에서 는 이뿌 조건문 이나 l 스 뒤에 오는 것이 한
문장 1 경우에는 꾸 불안 괄호를 생각을 할 수 있습니다
뭐 사실 내부적으로는 이렇게 작동하는 건 아닌데 이렇게 설명하는 게
이야기가 쉽더라구요
그래서 욕구 불행한 가루를 제거를 해서
이프 l 스 라는 형태로 코드를 다시 작성할 수 있습니다
그래서 다시 작성을 하게 되면
요런 형태가 되서 들여쓰기 가 굉장히 적어진 보기 좋은 코드가 됩니다
추가적으로 이렇게 조건을 s 도 구문을 사용해서 작성을 하게 되면
6시 보다 적을 때는 u 안쪽을 타고 들어가지만 이보다 많을 때는 이
아래쪽을 타고 들어가게 되겠죠 그래서 사실
6시가 아닌 경우에 많래를 가기 때문에
요 조건이 필요가 없어집니다 그래서 요 앞에 것들을 생각해 줄 수
있습니다
처음 보면 굉장히 당황할 수 있는 코드 니까 다시한번 자세하게 설명을
하도록 할게요
현재 시간이 새실 cb 부분이거든요 세심 여는 첫 번째 조건문을 타고
들어가서
여기에다 3을 넣게 되겠죠 그러면 삼은 육보다 작은게 맞으니까
수로가 되서 이안을 들어가게 되고 새벽입니다 를 출력을 하고 요 아래는
실행하지 않고 코드는 끝나게 됩니다
그런데 만약에 현재 시간이 한 7시 정도 된다면 아워즈 가 만약에 7이
라면 첫 번째 조건문에서
요녀석이 6은 까칠한 욕보다 작다 가 되서 폴스 가 떠서 유압 쪽은
무시가 되구요
두번째 조건문을 타고 들어가게 될 거에요 그래서 7이 들어가게 되죠
그러면 치른 12 보다 작은 게 맞으니까 이 안으로 들어가서 아침입니다
를 실행하게 됩니다
한마디로 이렇게 일쑤 l 스 조건문을 사용을 하게 되면
이전처럼
뭐 논리 연산자를 함께 사용해서 조건을 비교하는 코드가 없어질 수 있게
됩니다
작가는 요렇게 적었어 점
그래서 이러한 코드에서 앞부분이 없어도
요 앞부분에 조건이 사전에 제거되기 때문에 필요 없다는 것을 그냥 일단
머릿속에 기억 을 해주시면 좋겠습니다
같은 경우에는 일을 할 때도 들어가서 이런 조건문을 써버려 썼거든요 근데
주변 분들이 왜 이렇게 쓸데없이 쓰냐 이거 없어도 아무 문제 없는데 라고
이야기를 해주시더라구요
그런데 그때 너무 쪽팔려 가지고 집에 와 가지고 입을 몇 번 뻥뻥
찾는데요
그 100번 차고 나니까 확실하게 웨어 지더라구요 그래서 일단 기억을 꼭
해주시면 좋겠구요
자주 코드를 쳐서 이렇게 중첩되는 조건문을 사용하지 않아도 된다는 것을
기억해 주시면 좋겠습니다
자 그래서 이프 조건문 에 대해 알아봤는데요 79 페이지부터 86
페이지까지 알아봤다고 생각을 해 주시면 되겠습니다
사실 구문 만 기억을 해 주시면 이때부터는 재량 이에요
여러분이 얼마나 많은 조건을 생각할 수 있냐 가 요 조건문을 얼마나 잘
사용하느냐에 기준이 됩니다
뭐 방금 아까 처음 시간에 데이트 점 을 해 가지고 뭘 가져올 수 있는지
굉장히 많이 알아봤어요 그래서 뭐 현재가 보름 전인 야 보름 후 하도
나타낼 수 있을 거고 뭐 계절도 나타낼 수 있을 거고
다양한 예제를 의 직접 만들어 보시면 좋겠구요
추가적으로 우리가 저번에 프롬프트 라는 함수를 배웠어요 프롬프트를
2개를 입력을 하면 입력을 받을 수 있고 입력이 결과로 나온다고
했었는데요
이 결과를 가지고 결과를 숫자로 변화 난 다음에 입력하신 숫자가 모 음
수입니다
양수 입니다 아니면 0입니다 등도 9분에서 만드실 수 있을 겁니다
지난번에 자신이 만들고 싶은 애플리케이션이 있다면 그 애플리케이션에서
어떠한 데이터 가 사용되는지 생각해보라고 했었는데요
어떠한 조건이 사용될 지도 생각을 해보시면 좋겠습니다
예를 들어서 미세먼지 데이터 라면 미세먼지는 어느 기준을 가지고 뭐
정상이냐
나쁨 이냐 매우 나쁨 이 9분 되느냐를 한번 생각하고 내가 미세먼지를
지금 가져오는 방법은 모르겠지만
뭐 미세먼지 수치가
30 보다 적으면 몸 오고
어 미세먼지 수치가
뭐 정확한 기준은 모르겠지만 100 이면 어떻고 요런거 를 한번쯤 생각을
해보시면 좋겠구요
조금 더 나아가서 좀 복잡한 계산과 함께 사용하는 경우도 생각해 보시면
좋을 것 같아요
예를 들어서 우리집 반경 10km 내부에 있는 치킨 집을 찾고 싶다 라고
할 때
조건은 적어 줘 10km 내부에 있다 그러면 대체 우리 집에서 치킨 집
사이의 거리는 어떻게 구할까 가 문제가 될 거에요 그런 구하는 방법은
이제 구글 검색을 하면 알 수 있는데요
우리가 연습 문제를 풀 때 같이 한번 해볼 예제로 생각을 하고 일단 건너
뛰도록 하겠습니다
한번 구글 검색을 통해서 내가 위도 경도를 할 때 어떻게 그 사이의
거리를 구할 수 있는지 등을 찾아보고 한번 코드로 구현을 해 보시면
좋겠습니다
어쨌거나 오늘 강의는 여기까지 되겠고요 이 푸우 조건문 의 구문 형태를
확실하게 기억을 해 주시면 좋겠습니다
그럼 다음 강의에서 뵙겠습니다 감사합니다.