210406_조건문(conditional expression)

Bitnara Lee·2021년 4월 11일
0

조건문(conditional expression)

어떠한 조건을 판별하는 기준을 만드는 것

반드시 비교연산자(comparison operator)필요

비교의 결과는 늘 Boolean (true, false)

if 조건문과 switch 조건문이 대표적이며 삼항 연산자 도 사용 가능하다.

<if 조건문>

if (condition1)
  statement1
else if (condition2)
  statement2
else if (condition3)
  statement3
...
else
  statementN
 - if 안에 있는 condition이 참인 경우 해당하는 statement1, 아닌 경우 else if문을 실행 한다.
 - 조건문(if, else if)에 모두 해당하지 않으면 else에 있는 statement3 이 실행된다.
 - else if에는 갯수 제한이 따로 없다.

비교 연산자

MDN comparison operator

6가지 falsy 값

  • false
  • null – 값이 없다
  • undefined – 정의되지 않았다
  • 0 – falsy
  • NaN – Not a Number (--> but typeof NaN returns "number")
  • ‘ ’ - don’t have any value
    ( ' ' !== '' 띄어쓰기 is not empty)

논리연산자 - 두가지조건 한번에 적용될 때(Logical Operator)

  • && (and operator) / 두 조건 만족시켜야 true, (!Boolean일때)falthy 값 만나면 그 값 출력, 둘다 truthy - 뒤 값 출력
  • || (or operator) / 둘 중 하나가 true면 true,(!Boolean일때) truthy 값 만나면 그 값 출력, 둘다 falsy – 뒤 값 출력
  • ! (not operator) / true, false 값 반전됨

(??) Nullish coalescing operator / that works like ||, but it only returns the second expression, when the first one is "nullish", i.e. null or undefined. It is thus the better alternative to provide defaults, when values like '' or 0 are valid values for the first expression, too.

MDN

<Switch 조건문>


switch ( 변수 ){
    case A: // 값 A
        // 변수 값이 A 일때 실행할 명령문
        break;
    case B:
        // 변수 값이 B 일때 실행할 명령문
        break;
    case C:
        // 변수 값이 C 일때 실행할 명령문
        break;
    default:
        // 모든 CASE에 부합하지 않을때 실행할 명령문
        break;
}
  • case 뒤에는 해당하는 조건이 오며, 그 아래에 실행할 명령문을 적는다.
  • default는 if...else 조건문에서의 else와 같이 모든 조건에 해당 안 될 때 실행된다.

<조건 (삼항) 연산자/ Conditional (ternary) operator>

조건 ? 값1 : 값2
만약 조건이 참이라면, 조건 연산자는 값1을 값으로 갖습니다. 그렇지 않은 경우 조건 연산자는 값2을 값으로 갖습니다. 

var status = (age >= 18) ? "adult" : "minor";
이 구문은 age 변수가 18보다 같거나 클때 "adult" 값을 status 변수에 할당합니다. 그렇지 않은 경우, 이 구문은 "minor"값을 status변수에 할당합니다.

If you need to use an assignment in a conditional expression, a common practice is to put additional parentheses around the assignment.
할당연산자를 조건문 속에 넣을 때 소괄호를 추가해주는 것을 추천

if ((x = y)) {
  /* do something */
}
+
// Number + Number -> 합
1 + 2 // 3
// Boolean + Number -> 합
true + 1 // 2
// Boolean + Boolean -> 합
false + false // 0
// Number + String -> 연결
5 + "foo" // "5foo"
// String + Boolean -> 연결
"foo" + false // "foofalse"
// String + String -> 연결
"foo" + "bar" // "foobar"

-
5 - 3 // 2
3 - 5 // -2
"foo" - 3 // NaN

/
1 / 2      // JavaScript에선 0.5
1 / 2      // Java에선 0
// (양쪽 피연산자 모두 명시적인 부동소수점 숫자가 아님)
1.0 / 2.0  // JavaScript와 Java 둘 다 0.5
2.0 / 0    // JavaScript에서 Infinity(무한대)
2.0 / 0.0  // 동일하게 Infinity
2.0 / -0.0 // JavaScript에서 -Infinity
<typeof Infinity: "number" / true>

*
2 * 2 // 4
-2 * 2 // -4
Infinity * 0 // NaN
Infinity * Infinity // Infinity
"foo" * 2 // NaN

%
12 % 5 // 2
-1 % 2 // -1
NaN % 2 // NaN
-4 % 2 // -0
5.5 % 2 // 1.5

**
2 ** 3 // 8
3 ** 2 // 9
-(2 ** 2) // -4
(-2) ** 2 // 4

(그외)
++x/x++
var x = 3;
y = x++; // y = 3, x = 4
var a = 2;
b = ++a; // a = 3, b = 3

x--/ --x
var x = 3;
y = x--; // y = 3, x = 2
var a = 2;
b = --a; // a = 1, b = 1

-x
var x = 3;
y = -x; // y = -3, x = 3
var x = "4";
y = -x; // y = -4// 단항 부정 연산자는 숫자가 아닌 값을 숫자로 변환함

+x
값이 숫자가 아닐 경우 숫자로 변환을 시도합니다(속도 제일 빠름)
+3     // 3
+"3"   // 3
+true  // 1
+false // 0
+null  // 0
+function(val) { return val } // NaN

chaining these expressions, each assignment is evaluated right-to-left.
w = z = x = y
z += x *= y

Strings are compared based on standard lexicographical ordering, using Unicode values.
In most cases, if the two operands are not of the same type, JavaScript attempts to convert them to an appropriate type for the comparison.

(true)
"12" > 2
"2" < 12

new Boolean(value) : 원시데이터형인 boolean value를 객체화(wrapper) 시킴
value의 값으로 false가 전달된 Boolean Object라고해도 조건문에서는 true가 된다

var x = new Boolean(false);
if (x) {
  // this code is executed
}
var x = Boolean(expression);     // use this...
var x = !!(expression);          // ...or this
var x = new Boolean(expression); // don't use this!

-----곧 추가-----

profile
Creative Developer

0개의 댓글