본문 바로가기
코드스테이츠 42기/[TIL] Section 1

S1U3 반복문

by 랜덤다이스 2022. 10. 25.

1. 현재 기분이나 느낌

오늘도 역시 아무것도 이해가 되지않는다. 따로 쉽게 공부해야할거같은데 유튜브를 검색해서 차근차근 배워봐야겠다

페어랑 코플릿 문제 푸는건 코드스테이츠에 알려주는 기본적인 개념가지고는 한계가 있다. 그외 적으로 구글 검색을 통해 배워야 겨우 풀거나 아니면 앞전 기수들이 블로그 한 것을 참고해야 겨우 풀 수있는데;; 도대체 나는 정답을 보고도 이게 왜 쓰이는지? 왜 이걸 여기에 넣는지?

도무지 이해가 가지 않는다. 다들 어떻게 문제를 푸는지?;; 속이 탄다... 페어랑도 오늘이 마지막이다.

 

 

2. 학습한 내용중 떠오르는 것

조건문-어떤 조건에 맞춰 어떤 행동을 해야 하는지 명시

학습 목표

  • truthy와 falsy 가 조건문에서 작동하는 방식을 이해할 수 있다.
  • 비교 연산자를 통한 엄격한 비교(=== , !==)에 대해 이해할 수 있다.
  • if 와 else if , else를 이해하고 무리 없이 활용할 수 있다.
  • 논리 연산자를 (&&, ||, ! ...) 통해 복잡한 조건을 간결하게 작성할 수 있다.
  • 복잡한 조건문을 활용하여, 실생활에서 쉽게 마주하는 문제를 해결하기 위한 알고리즘을 구현할 수 있다.

 

3. 떠오르는 것을 설명하기

a. truthy와 falsy 가 조건문에서 작동하는 방식을 이해할 수 있다.

Truthy와 Falsy는 자바스크립트의 문법이 아닌 자바스크립트의 특성같은 것. Truthy는 말 그대로 True같은 것, Falsy는 False같은 것으로 보여지는 값은 true나 false가 아니지만 자바스크립트가 true나 false로 이해하는 값들을 의미. 

b. 비교 연산자를 통한 엄격한 비교(=== , !==)에 대해 이해할 수 있다.

==와 ===, !=와 !==는 비슷해 보이지만 자세히 보면 서로 다른 연산자이다.
javascript는 엄격한 비교(일치 비교)와 형변환 비교(동등 비교)의 두 가지 비교 방법을 가지고 있다.

동등 연산자 (==)

두 피연산자의 자료형을 일치시킨 후, 엄격하게 비교를 수행

  1   ==  1        // true
 "1"  ==  1        // true
  1   == '1'       // true
  0   == false     // true
  0   == null      // false

  0   == undefined // false
null  == undefined // true

부등 연산자 (!=)

두 피연산자의 자료형을 일치시킨 후, 엄격하게 비교를 수행

1 !=   2     // true
1 !=  "1"    // false
1 !=  '1'    // false
1 !=  true   // false
0 !=  false  // false

일치 연산자 (===)

자료형 변환 없이 두 피연산자가 엄격히 같은지 판별

3 === 3   // true
3 === '3' // false

불일치 연산자 (!==)

자료형 변환 없이 두 피연산자가 엄격히 같은지 판별
두 피연산자가 같지 않거나, 같은 자료형이 아닐 때 true를 반환

3 !== '3' // true
4 !== 3   // true

정리

정리하자면 동등 비교 연산자(==, !=)와 일치 비교 연산자(===, !==)의 가장 큰 차이점은 형변환을 하냐 안하냐이다.

동등 비교 연산자(==, !=)는 형변환을 해 두 피연산자의 자료형을 일치시킨 뒤, 서로 같은지 비교를 진행한다.

반면 일치 비교 연산자(===, !==)는 형변환을 하지 않은 상태에서 두 피연산자가 서로 같은지 비교를 진행한다.

따라서 일치 비교 연산자(===, !==)는 두 피연산자의 자료형까지 모두 일치/불일치해야하는 경우에 사용하면 적절할 듯 하다.

 

c. if 와 else if , else를 이해하고 무리 없이 활용할 수 있다.

if문

if (true) {
  		console.log('조건이 참입니다.');
}
//output:조건이 참입니다.

> if (조건){
'조건이 참일 경우 실행되는 내용'
}


조건이 참일 때 if문이 실행된다.

비교 연산자

var a = 4;

if (a === 4) {
		console.log('참');
}
// output:참  	

else문

if (false) {
 	console.log('해당 내용은 출력되지 않습니다.');
} else {
  	console.log('해당 내용이 출력됩니다.');
}

> if (조건){
'조건이 참일 경우 실행되는 내용'
} else{
'조건이 거짓일 경우 실행되는 내용'
}


if의 조건이 false이므로, else의 내용이 실행된다.



var a = 20;
var b = 30;

if (a > b) {
		console.log('a는 b보다 크다'); 
} else {
  		console.log('a는 b보다 작다');
}

a가 b보다 큰 것이 참일 경우, 'a 는 b보다 크다' 를 출력
a가 b보다 큰 것이 거짓일 경우, 'a는 b보다 작다' 를 출력
따라서 a = 20, b = 30 'a > b'는 거짓이기에
'a는 b보다 작다'가 출력된다.

else if문

var usename = prompt("이름을 입력하세요.")
var question1 = prompt("'=', '+='의 연산자는? \n ①산술연산자 ②논술연산자 ③대입연산자")
var questopn = prompt("'+', '-', '*'의 연산자는? \n ①문자결합연산자 ②산술연산자 ③증감연산자")

var answer1 = question1 == 3 ? 50:0;
var answer2 = questopn2 == 2 ? 50:0;

var score=answer1 + answer2;

if(score >= 100){
  document.write(username + "님" + <br/>+"A학점 입니다");
}

else if(score >= 50){
  document.write(usename + "님" + <br/>+"B학점 입니다");
}

else if(score >= 0){
  document.write(usename + "님" + <br/>+"C학점 입니다");
}
                 

A학점 = 100, B학점 = 50, C학점 = 0
if문으로 이용자가 2문제를 모두 맞혔을 경우 A학점을,
else if문으로 이용자가 1문제를 맞혔을 경우 B학점을,
else if문으로 이용자가 0문제를 맞혔을 경우 C학점
출력하도록 한다.

else문과 else if문의 차이점

  • else문은 if문의 조건이 거짓일 경우이다.
  • else if문은 새로운 조건을 추가할 수 있다.
  • else if는 여러 조건을 중첩할 수 있다.
  • else문의 조건에 해당하지 않을 경우 마지막에 조건을 지정할 수 있다.

 

d. 논리 연산자를 (&&, ||, ! ...) 통해 복잡한 조건을 간결하게 작성할 수 있다.

연산자 표기법 구문 구문 치환 설명
논리 AND && example1 && example2 example1 AND example2 example1 이 true 인 경우 example2 을 반환하고 그렇지 않은 경우 example1을 반환
논리 OR || example1 || example2 example1 OR example2 example1 이 true 인 경우 example1 을 반환하고 그렇지 않은 경우 example2을 반환
논리 NOT ! !example1 NOT example1 example1 이 true 인 경우 false를 반환하고 그렇지 않은 경우 true 를 반환

 

e. 복잡한 조건문을 활용하여, 실생활에서 쉽게 마주하는 문제를 해결하기 위한 알고리즘을 구현할 수 있다.(x)

 

 

4. 설명하기 어려운 단어가 있다면 왜 그런지?

 

 

5. 그 단어를 스스로 설명할 수 있기 위해서 누군가에게 질문을 한다면, 어떤 질문을 해야 하나?

 

 

6. 추가로 알아야하는 것, tip

페어랑 문제 풀때 안되면 답보고 의사코드라도 적어봐야함.

문제를 보고 몰라도 답먼저 기입후 주석으로 문제 추리 라도 적어내야함

문제제출을 못하면 성실도에서 점수 깍임.

오늘 배운 수업이 어려운 현재 어려운 난이도에 속하지만 한달뒤에는 쉬워보인다고함

코드는 암기하지말고 이해를 하도록하자 나만의 언어로 생각해보자

문제에 입출력코드 보면 힌트가 있다

 

'코드스테이츠 42기 > [TIL] Section 1' 카테고리의 다른 글

S1U5 CSS 기초  (1) 2022.10.27
S1U4 HTML기초  (2) 2022.10.26
S1U3 기초 제어문  (1) 2022.10.24
S1U2 변수, 타입, 함수  (1) 2022.10.21
S1U1 개강 첫날!  (2) 2022.10.20