[FrontEnd2] 5월 둘째주 한페이지 복습(출력, 사칙연산자, 관계 연산자, 논리 연산자, 증감연산자, 비트연산자)

SMALL

안녕하세요:) 보라해바라기입니다!

html&css과정이었던 FrontEnd1 수강을 마치고 저는 이제 js과정을 듣고 있는 중입니다.

이제 프로그래밍 언어를 제대로 배운다는 생각에 마음가짐또한 새로워지네요!

전과 마찬가지로 배웠던 내용을 복습하는 한페이지 정리를 해보았습니다.

출력
사칙연산자 (+ 나머지 연산)
관계연산자와 엄격하게 검사하는 연산자 ===, !==
논리연산자
관계연산자와 논리연산자의 응용
증감연산자
비트연산자

에 대해 정리해보았습니다!

1. html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Review(220516)</title>
    <script>
        //1번 사칙연산(+나머지 연산)
        document.write("1. 사칙연산", "<br>")

        var num1 = 8
        var num2 = 5

        document.write(num1 + "+" + num2 + "=" + (num1+num2), "<br>") // 13
        document.write(num1 + "-" + num2 + "=" + (num1-num2), "<br>") // 3
        document.write(num1 + "x" + num2 + "=" + (num1*num2), "<br>") // 40
        document.write(num1 + "÷" + num2 + "=" + (num1/num2), "<br>") // 1
        document.write(num1 + "%" + num2 + "=" + (num1%num2), "<br>") // 3
        document.write("<br>")

        //2번 관계연산자(>, >=, <, <= , ==, !=, ===, !==)
        document.write("2. 관계연산자(>, >=, <, <= , ==, !=, ===, !==)", "<br>")

        var result = (num1 >= num2)
        document.write(num1 + "은 " + num2 + "이상인가?: ", result, "<br>") // true
        result = (num1 <= num2)
        document.write(num1 + "은 " + num2 + "이하인가?: ", result, "<br>") // false
        result = (num1 == num2)
        document.write(num1 + "은 " + num2 + "과 같은가?: ", result, "<br>") // false
        document.write("<br>")

        num1 = 9
        num2 = "9"
        result = (num1 == num2)
        document.write("**num1은 숫자 9이고 num2는 문자 9이다.**", "<br>")
        document.write(num1 + "은 " + num2 + "와 같은가?: ", result, "<br>") // true
        result = (num1 === num2)
        document.write(num1 + "은 " + num2 + "와 엄격하게 같은가?: ", result, "<br>") // true
        document.write("===와 !==의 경우 값 뿐만 아니라 데이터 타입도 비교함!", "<br>")
        document.write("<br>")

        //3번 관계연산자와 논리연산자의 응용
        document.write("3. 관계연산자와 논리연산자(&&, ||, !)의 응용", "<br>")
        num1 = 10
        num2 = 13
        result = (num1 < num2) && (num1 >= num2) // false && true => false
        document.write("(" + num1 + "<" + num2 + ") && (" + num1 + ">=" + num2 + ") : " , result, "<br>")
        result = (num1 < num2) || (num1 >= num2) // false || true => true
        document.write("(" + num1 + "<" + num2 + ") || (" + num1 + ">=" + num2 + ") : " , result, "<br>")
        document.write("<br>")

        //4번 증감연산자 (++, --)
        document.write("4. 증감연산자 (++, --)", "<br>")
        num1 = 20
        num2 = 10
        document.write("** num1:20, num2:10 **", "<br>")

        document.write("num1: ", num1, "<br>") // 20
        document.write("num1++: ", num1++, "<br>") // 20
        document.write("num1: ", num1, "<br>") // 21
        document.write("++num1: ", ++num1, "<br>") // 22
        document.write("<br>")

        document.write("num2: ", num2, "<br>") // 10
        document.write("num2--: ", num2--, "<br>") // 10
        document.write("num2: ", num2, "<br>") // 9
        document.write("--num2: ", --num2, "<br>") // 8
        document.write("<br>")

        //5번 비트연산자 (&, |)
        document.write("5. 비트연산자 (&, |)", "<br>")
        num1 = 7
        num2 = 5
        result = (num1 & num2)

        document.write("7은 0111, 5는 0101로 표현.", "<br>")
        document.write("<br>")

        document.write("000000111", "<br>")
        document.write("&  0000101", "<br>")
        document.write("-------------", "<br>")
        document.write("000000101    ===> 5", "<br>")

        document.write(num1 + "&" + num2 + ": ", result, "<br>") // 5
        document.write("<br>")

        result = (num1 | num2)

        document.write("000000111", "<br>")
        document.write("|  0000101", "<br>")
        document.write("-------------", "<br>")
        document.write("000000111    ===> 7", "<br>")

        document.write(num1 + "|" + num2 + ": ", result, "<br>") //7

    </script>
</head>
<body>
    
</body>
</html>

2. 결과 이미지

728x90

저작자표시

'JavaScript' 카테고리의 다른 글

[FrontEnd2] JS 연습문제 풀이 (제어문, confirm) (0)	2022.05.20
[FrontEnd2] JS 연습하기 (변수, prompt) (0)	2022.05.18
[JS] 모각코 활동 후기 :) (0)	2022.01.30
[JS] 모각코 _15일차 (0)	2022.01.28
[JS] 모각코 _ 14일차 (0)	2022.01.27