혜랑's STORY

[WEB 6주차 이론] : JavaScript 본문

2020 SISS 21기 활동/여름방학 WEB

[WEB 6주차 이론] : JavaScript

hyerang0125 2020. 8. 13. 14:48

# 비교 연산와 블리언

비교 연산자와 불리언 예시

<!-- 비교연산자와 블리언 예시 코드 -->
<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>
<BODY>
    <h1>Comparison operators & Boolean</h1>
    <h2>===</h2>
    <h3>1===1</h3>
    <script>
        document.write(1 === 1); //write(boolean);
    </script>
    <h3>1===2</h3>
    <script>
        document.write(1 === 2); 
    </script>

    <h2>< / ></h2>
    <h3>1 &lt; 2</h3>
    <script>
        document.write(1 < 2);
    </script>
    <h3>1 &lt; 1</h3>
    <script>
        document.write(1 < 1);
    </script>

</BODY>
</HTML>

# 조건문

간단한 조건문 예시

<!-- 간단한 조건문 예시 -->
<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>
<BODY>
    <h1>Conditional statements</h1>
    <h2>Program</h2>
    <script>
        document.write("1<br>");
        document.write("2<br>");
        document.write("3<br>");
        document.write("4<br>");
    </script>
    <h2>IF-true</h2>
    <script>
        document.write("1<br>");
        if (true) {
            document.write("2<br>");
        } else {
            document.write("3<br>");
        } document.write("4<br>");
    </script>
    <h2>IF-false</h2>
    <script>
        document.write("1<br>");
        if (false) {
            document.write("2<br>");
        } else {
            document.write("3<br>");
        } document.write("4<br>");
    </script>

</BODY>
</HTML>

# 리펙토링 ; 중복의 제거

- 기능 : 중복되는 기능을 함수로 묶어 반복을 줄인다.

# 배열과 반복문

- 배열

배열 예시

<!-- 배열 예시 -->
<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>
<BODY>
    <h1>Array</h1>
    <h2>Syntax</h2>
    <script>
        var coworkers = ["egoing", "leezche"];
    </script>
    <h2>get</h2>
    <script>
        document.write(coworkers[0]);
        document.write(coworkers[1]);
    </script>
    <h2>count</h2>
    <script>
        document.write(coworkers.length);
    </script>
    <h2>add</h2>
    <script>
        coworkers.push('duru');
        coworkers.push('taeho');
    </script>
    <h2>count</h2>
    <script>
        document.write(coworkers.length);
    </script>

</BODY>
</HTML>

- 반복문

반복문 예시

<!-- 반복문 예시 -->
<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>
<BODY>
    <h1>Loop</h1>
    <ul>
        <script>
            document.write("<li>1</li>");
            var i = 0;
            while (i < 3) {
                document.write("<li>2</li>");
                document.write("<li>3</li>");
                i += 1;
            }
            document.write("<li>4</li>");
        </script>
    </ul>

</BODY>
</HTML>

# 함수

함수의 예시

<!-- 함수의 예시 -->
<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>
<BODY>
    <h1>Function</h1>
    <h2>Basic</h2>
    <ul>
        <script>
            function two() {
                document.write('<li>2-1</li>');
                document.write('<li>2-2</li>');
            }
            document.write('<li>1</li>');
            two();
            document.write('<li>3</li>');
        </script>
    </ul>

    <h2>Parameter & Argument</h2>
    <script>
        function onePlusOne() {
            document.write(1 + 1+"<br>");
        }
        onePlusOne();
        function sum(left, right) {
            document.write(left + right + "<br>");
        }
        sum(2, 3); //5
        sum(3, 4); //7
    </script>
    
    <h2>Return</h2>
    <script>
        function sum2(left, right) {
            return left + right;
        }
        document.write(sum2(2, 3) + "<br>");
    </script>

</BODY>
</HTML>
저작자표시

'2020 SISS 21기 활동 > 여름방학 WEB' 카테고리의 다른 글

[WEB 7주차 이론] : JavaScript  (0) 2020.08.23
[WEB 6주차 실습] : JavaScript  (0) 2020.08.13
[WEB 5주차 이론] : JavaScript  (0) 2020.08.08
[WEB 4주차 공부] : CSS  (0) 2020.08.02
[WEB 4주차 실습] : CSS  (0) 2020.08.02
'2020 SISS 21기 활동/여름방학 WEB' Related Articles more