20220324 Javascript

학습한 내용

1. 값 입력하고 경고창 띄우기

<html>
    <body>
        <script>
            let input_id = prompt('아이디?');
            if(input_id==='123'){    
                alert(input_id+'님 안녕하세요 ^^');
                // alert(input_id+'가 누구요?');
            }else{
                alert(input_id+' 누구세요??');
            }
        </script>
    </body>
</html>
  • 실행결과

2. Boolean

참, 거짓 값을 나타낸다.

<html>
    <body>
        <h1>Boolean</h1>
        <script>
            console.log(true);
            console.log(false);
        </script>
    </body>
</html>

3. Comparison Operator

<html>
    <body>
        <h1>Comparison Operator</h1>
        <script>
            console.log(1>1);
            console.log(1===1);
            console.log(1==1);
            console.log(1!==1);
            console.log(1<=1);
        </script>
    </body>
</html>

4. Conditional Statements

<html>
    <body>
        <h1>Conditional Statements</h1>
        <script>
            console.log(1);
            if (true){
                console.log('2 - true');

            } else {
                console.log('2 - false');
            }
            console.log(3);

            console.log(4);
            if(false){
                console.log('5 - true');
            }else{
                console.log('5 - false')
            }
            console.log(6);
        </script>
    </body>
</html>
  • 실행결과

5. Array

<html>
    <body>
        <h1>배열(Array)</h1>
        <script>
            let topics = ['html', 'css', 'js'];
            var members = ['egoing', 'leezche', 'duru'];

            console.log(topics.length);
            console.log(topics[0]);
        </script>
    </body>
</html>

6. Loop

<html>
    <body>
        <h1>반복문(Loop)</h1>
        <script>
            console.log(1);
            for(let i=0 ; i<3 ; i=i+1){
                console.log(2);
                console.log(3);
            }
            console.log(4);
        </script>
    </body>
</html>

7. Array + Loop

<html>
    <body>
        <h1>Array + Loop</h1>
        <script>
            topics = ['html', 'css', 'js', 'python'];
            for(let i=0; i<topics.length; i=i+1){
                document.write('<li>'+topics[i]+'</li>');
            }
        </script>
    </body>
</html>
  • 실행결과

WEB에 적용하기

https://ujamong.github.io/daegu-ai-school-web/

학습한 내용 중 어려웠던 점 또는 해결못한 것들

for문의 구조가 조금 헷갈린다.

해결방법 작성

for ([초기문]; [조건문]; [증감문]){
	실행문;
}
  • 초기문 : 초기 설정 값 선언
  • 조건문 : 조건문으로 참/거짓 판단
    생략할 경우 기본 참으로 설정됨.
  • 증감문 : 값의 증감을 실행

학습 소감

지금까지 배운 내용들을 좀 더 문법적으로, 간단하게 코드를 짤 수 있게 된 수업이었다.

좋은 웹페이지 즐겨찾기