1 분 소요

JavaScript

자바스크립트 특징

  • 웹 개발을 위한 프로그래밍 언어

  • 스크립트 언어

  • 이벤트 드리븐 방식(Event-Driven)

    동파서, 삭스 파서중에서 삭스파서가 이벤트 드리븐

  • 자바스크릡트 표준, ECMAScript

스크립트 언어

  • 스크립트 언어란?

    • 프로그램 실행 시에 기계어로 변환(interpreted) ➡️ 통역

    • 편리하여 초보자도 익히기 쉬움

    • 자바스크립트, 파이선(python)

    • 컴파일(compiled)언어: 실행 이전에 변환 ➡️ 번역

      image-20240704142740709

이벤트 드리븐 방식

  • 이벤트 드리븐 방식

    이벤트에 반응하여 동작을 변경하거나 며역을 수행하는 방식

    • 이벤트 : 대상+트리거(trigger)+처리기(handler/listener)

자바스크립트 연결하기

  • HTML 이벤트 속성을 이용한 연결(높은 복잡도)

    <div id="box" onclick="document.getElementById('box').style.backgroundColor='magenta'">
    </div>
    
  • <script></script> 요소에서의 연결(추천 방법)

    <script>
        document.getElementById('circle').onclick=function(){
            document.getElementById('circle').style.backgroundColor ='green';
        }
        document.getElementById('circle').onclick=function(){
            this.style.backgroundColor = 'green';
            console.log(this);
        }
    </script>
    
function hello(){   
}

➡️ 자바스크립트 함수는 일급객체

➡️자바스크립트 함수는 클래스와 어깨를 나란히한다.

❓일급객체의 특성이 무엇일까??

변수에 담을 수 있다.

매개변수와 리턴 값으로 사용가능

콘솔 활용하기

  • 브라우저의 디버깅 콘솔(console)

    • 자바스크립트의 오류나 비정산적인 연산의 원인 탐지 도구

      image-20240704144733284

명령형 프로그래밍과 선언형 프로그래밍

  • 프로그래밍 패러다임

    • 명령형(imperative)

      명령어의 순차적 나열 - How 관점

    • 선언형(declarative)

      실행할 프로그램 선언 - What관점➡️ 목표가 무엇인지

    • 자바스크립트는 명령형에 가깝지만, 두 가지 스타일 모두 지원

      image-20240704144952718

ES6

let

  • 중복 선언 불가능
  • ECMAS6 부터 선언된 블럭에서만 사용할 수 있는 블록 변수(let)이 제공됨
  • 호이스팅 대상에서 제외

const

  • 상수로 사용
  • 선언 시 값을 할당해야 함
  • 호이스팅 대상에서 제외
  • let 키워드와 값을 변결할 수 없다는 것만 제외하고 동일

✔️호이스팅은 인터프리터가 코드를 실행하기 전에 함수, 변수, 클래스 또는 임포트(import)의 선언문을 해당 범위의 맨 위로 끌어올리는 것 처럼 보이는 현상입니다.

property shorthand

객체에서 key와 value명이 같은 경우 축약해서 사용할 수 있게 만들어주는 문법이다.

함수와 메서드

  • 함수(function)

    어떤 기능 수행을 위해 디자인된 명령어 모음

  • 메서드(method)

    메서드 특정 객체와 연관된 명령어 모음

    image-20240704153649362

업데이트:

댓글남기기