JavaScript

[JS] 연산자

(งᐛ)ว 2023. 10. 8. 20:29
728x90
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>Insert title here</title>
        <script type="text/javascript">
            //산술연산자
            //+, -, *, /, %
           
            let num1 = 10;
            let num2 = 7;
           
            document.write("num1+num2 = "+(num1+num2)+"<br>");
            document.write("num1-num2 = "+(num1-num2)+"<br>");
            document.write("num1*num2 = "+(num1*num2)+"<br>");
            document.write("num1/num2 = "+(num1/num2)+"<br>");
            document.write("num1%num2 = "+(num1%num2)+"<br>");
            document.write("<br>");
           

            //대입연산자
            //연산을 마친 데이터를 변수에 저장할때 사용
           
            let ch = 'A';
            let i = 1+2;
            document.write("ch : "+ch+"<br>");
            document.write("<br>");
           

            //복합대입연산자
            //+=, -=, *=, /=, %=
       
            var str = "<table border='1'>"; //겉에 큰따옴표 썼다면 안에는 다른걸로 작은따옴표로 쓴다. 반대경우도 마찬가지
            str+="<tr>";
            str+="<td>1</td><td>2</td><td>3</td>";
            str+="</tr>";
            str+="</table>";

 

**document.body.innerHTML = str; 
document.write(str+"<br>");


**innerHTML : HTML에 새로운 HTML요소를 추가하거나 특정 HTML요소 내부에 작성된 내용을 가져옴. 전의 내용은 초기화 후 보여줌 

기존 결과창

 

document.body.innerHTML 사용

 

 

            //증감연산자
            //증가연산자(++) : 1씩 증가시킨다.
            //감소연산자(--) : 1씩 감소시킨다.
           
            //선행증감 ++변수, --변수
            //후행증감 변수++, 변수--
           
            let a = 5;
            let b = 7;
            let c = a++; //5            
            let d = ++b; //8
   
            document.write(a+"<br>"); //6
            document.write(b+"<br>"); //8
            document.write(c+"<br>"); //5
            document.write(d+"<br>"); //8
            document.write("<br>");
           

            //비교연산자
            //>, <, >=, <=, ==, !=, ===, !==
           
            //==데이터 일치 여부만 체크함 ★★★★
            document.write(10 == '10'); //true
            document.write("<br>");
           
            //===데이터와 자료형의 일치 여부까지 체크함 ★★★★
            document.write(10 === '10'); //false
            document.write("<br>");
           
            //삼항연산자
            //조건식 ? 조건식이 참일때 반환값 : 조건식이 거짓일때 반환값;
            var e = (10>5)?"10은 5보다 크다":"10은 5보다 작다";
            document.write(e+"<br>");
           
            //논리연산자
            //&&,||,!
            //&&은 모두 참이어야 참
            //||은 하나만 참이어도 참
            //!은 참을 거짓으로 거짓을 참으로    
            document.write("&& : "+(10>5 && 20 == 20));
        </script>
    </head>
    <body>
   
    </body>
</html>
728x90