ITWILL : JS기초이론, Compile VS Interprete, 변수, js라이브러리,객체타입

ITWILL학원 : 2강 JS기초이론 BY 정규태강사

1. 자바스크립트

JAVA와 이름은 비슷하지만 어떠한 연관성도 없는 언어이다.
JS 특징

  • 객체기반의 스크립트 프로그래밍 언어.
  • C언어 기반의 문법 사용
  • 넷스케이프에서 개발
  • HTML 문서 내부에 포함되어 있는 기능
  • 웹 브라우저를 통해서 실헹
  • 인터프리터를 사용해서 실행 : 컴파일러가 필요없고 위에서 아래로 순차적 실행
  • 서버의 작업처리부담을 덜어준다(클라이언트에서 처리가 되기 때문에)
  • JS소스코드는 오픈소스로 누구나 코드를 볼 수 있다.(보안측면상 100% 오픈은 아님)
  • 다양한 JS라이브러리를 제공한다

2. 스크립트 프로그래밍 언어란?

스크립트 언어 - 어플리케이션에 명령을 전달하기 위한 것.

  • ex) sql, awk, 자바스크립트 등

3. 인터프리터언어와 컴파일러 언어란?

Compile VS Interpreter
둘 다 고급언어로 작성된 원시 프로그램(Source Program)을 목적 프로그램(Object Program)으로 번역하는 번역 프로그램이며, 프로그램 번역 방식에 따라 구분된다.

  1. 컴파일
  • 목적프로그램을 생성
  • 번역과정과 번역시간이 복잡하고 오래 걸리지만 한번 번역 후에는 다시 번역하지 않아도되므로 실행속도 빠름
  • 대표적 JAVA, C언어
  • 예시: 소스코드(.java) -> 자바 컴파일 -> 바이트코드(.class) -> JVM 의 JIT 컴파일러 -> 머신코드 -> 실행
  1. 인터프리터
  • 목적프로그램을 생성하지않고 위에서 아래로 순차적으로 실행(웹 브라우저에 포함되어있음)
  • 번역속도는 빠르지만 프로그램 실행시 매번 번역해야해서 실행속도가 느리다
  • 대표적 php, PYTHON
  • 예시 : 소스코드(스크립트) -> 인터프리터 -> 실행

참고링크1

참고링크2

4. JS라이브러리란?

라이브러리란 특수한 기능을 모아놓은 것을 말한다
ex) jQuery, Ajax, JSON

5. 왜 JS를 쓸까?

자바는 서버에서 사용되는 언어이다. 서버에서 처리를 한 후 돌려줘야 한다.
반면 JS는 서버가 아닌 클라이언트에서 처리된다. 그래서 서버의 부담이 줄어든다

그렇다면 전부 JS로 하면 안될까??

하지만 JS에 한계가 있기 때문에 서버의 언어와 클라이언트의 언어를 같이 사용하게 된 것이다.

6. JS 사용시 주의점

  1. 항상 대/소문자 구문해서 사용한다.
    아래 코드는 같은 의미를 가지고 있는 것 같지만 출력값은 다르게 출력된다

    1
    2
    new Date();
    New DATE();
  2. 실행문을 끝낼때 항상 ;을 사용한다.
    세미콜론이 없이 실행가능할 수 있지만 실행중에 문제가 발생할 수도 있기에 붙이는 것을 권장한다

  3. 사용자(개발자)의 편의성을 위해 한 줄에 하나의 문장을 작성한다.

  4. 큰 따옴표와 작은 따음펴 사용에 주의한다

  • 자바의 경우, ""는 String만 가능, ''는 char만 가능
  • js의 경우, 구분없이 다 사용가능하고 항상 짝으로 사용하면 된다.
    1
    2
    // ex)
    document.write('안녕하세요 |'js|'입니다')
  1. 마우스를 사용할 수 없는 환경에 대한 고려를 해야한다.(키보드 접근성 준수)

7. 변수

  1. 변수란 무엇일까?
    하나의 공간에 하나의 데이터만 저장하는 공간(메모리)이다

만약 하나의 공간에 다른 데이터를 추가적으로 넣게되다면?
새로운 데이터가 들어올 시 기존 데이터에 덮어쓰여지게 된다.

저번시간에 꼭 기억해야하는 한 문장이 있다고 했다
바로 모든 프로그램은 주기억장치에서만 실행된다!

  1. 변수의 종류는 크게 아래와 같다
  • 문자형데이터(String) : 문자 또는 숫자를 (“”)(‘’)표현한 데이터.
    • 만약 document.write(‘100’+200+300)이라면 출력값은 어떻게 될까?
    • 100500이라고 답했다면 땡! 정답은 100200300이다.
  • 숫자형(Number) : 변수에 숫자만 저장되는 데이터.
  • 논리형(Boolean)
  • Null : 비워진 데이터 값
  1. 변수를 사용하기 위해서는 아래와 같이 세 가지의 동작이 필요하다
    1. 변수를 선언
    2. 변수를 초기화
    3. 변수를 사용

다만 경우에 따라서는 1번 선언과 2번 초기화를 같이 진행할 수도 있다.
- 변수 선언만 한 경우 : var 변수명;
- 선언과 초기화 같이 하는 경우 : var 변수명 = 값;

8. 변수 선언 후 초기화를 안한다면?

아래를 출력하면 언디파인드가 뜨는데 consol창에는 아무메세지도 나타나지않는다
즉 에러가 아니다

1
2
3
4
5
6
let tmp
document.write(tmp);


//출력값은
undefined

왜 이런 현상이 일어날까?

메모리가 할당된 tem안에 값이 없기때문에?

땡!

tem안에 값이 있는지 없는지 모르기때문에!

이게 무슨 양자역학같은 소리냐면…

메모리는 유한하다. 8기가나 16기가 등등.
컴퓨터는 여러 작업을 하면서 한정된 메모리안에서 데이터를 썼다가 지웠다가를 반복한다.
재사용된 메모리위치에 아직 쓰레기값이 들어있을 수도 있다.
내가 대입하지 않았더라도 어떤 쓰레기값이 들어가 있을수있기때문에 undefined가 나온 것이다.
따라서 변수선언 후에는 항상 초기화를 해줘야된다.

9. 객체타입

var타입은 객체타입이라고 한다. 모든 타입을 저장할 수 있다.
비교하자면, java의 변수선언은 정수인 경우 int num = 1이라고 하지만 js는 데이터타입을 정의하지않고 변수를 선언할 수 있다.