JavaScript

JavaScript

기본문법 = 변수, 연산자와 제어문, 함수와 객체

주요 라이브러리 = DOM API (Document Object Model) -> 태그를 생성, 조회, 변경, 삭제 / Event 처리 / AJAX(Asynchromous JavaScript And XML)

외부 라이브러리 - jQuery

자바스크립트 문법

스크립트 태그는 헤드에 올 수도 바디에 올 수도 있다.

html 사이사이에 들어가는 스크립트 코드는 순서대로 실행한다.
만약 에러가 중간에 생긴다면 즉시 script 태그의 실행을 중단하고 다음 태그로 간다.

 

 

함수 정의

function plus (a + b) {
return a + b;
}

console.log(plus(10,20));

 

 

함수 이름을 변수로 저장할 수 있다.(자바와 가장 큰 차이점 자바는 메서드를 주고받을 수 없다 자바스크립트는 객체 뿐만 아니라 함수를 주소로 주고받을 수 있다.)

 

var ok = plus;

console.log(ok(100,200));

자바스크립트는 값을 넣고싶으면

레퍼런스.키 = 값;

var 레퍼런스 {
키 : "값";
}

 

자바스크립트는 대소문자를 구분한다.

웹브라우저는 HTML을 로딩한 후 위에서 아래로 태그가 나온 순서대로 실행한다.
실행하다가 script라는 태그를 만나면 "자바스트립트 엔진"을 이용하여 코드를 실행한다. script 태그 실행이 완료되면 계속 이어서 다음 태그를 처리한다.

자바스크립트 문법 2

script에 선언된 변수나 함수는 그 다음 script에서 사용할 수 있다.
만약 아래의 script 태그를 실행한 후라면 그 태그에서 선언한 변수나 함수를 사용할 수 있다.
자바스크립트는 자바와 달리 문자와 문자열을 구분하지 않는다.

 

typeof 값
=> 값의 타입을 알아내는 연산자

이렇게 변수에 들어있는 값이 무슨 타입인지 검사할 때 사용한다.

var v = function() {};
if ("function" == typeof v) {
console.log("함수입니다!");
}

 

자바스크립트의 변수를 선언할 때는 타입을 지정하지 않는다.
변수에 값을 넣는 순간 타입이 결정된다.
v1 = "문자열";

 

자바스크립트의 변수는 타입이 고정되지 않는다. 값을 넣을 때 마다 타입이 바뀐다.

 

자바스크립트의 변수는 "동적 타입 바인딩(dynamic type binding)"이다. 그에 반해 자바는 한 번 변수의 타입이 지정되면 다른 타입을 바뀔 수 없기 때문에 "정적 타입 바인딩(static type binding)"이라 부른다.

 

그러나 유지보수를 쉽게 하기 위해서는 가능한 변수를 사용하기 전에 선언한 후에 쓰는 게 좋다.변수를 선언하지 않고 사용할 때 오류를 띄우게 하려면 strict 모드를 사용하라고 자바스크립트 엔진에 알려줘야 한다.
다음 문자열을 단순히 선언하라!
"use strict";

 

strict 모드에서는 변수를 선언하지 않고 사용하면 실행 오류가 발생한다! strict 모드는 script 태그에서 첫 번째 문장으로 와야 한다. 이렇게 첫 번째 문장이 아닌 경우 무시된다.

 

script 태그를 실행할 때 변수가 선언된 위치와 함수가 정의된 위치에 상관없이 제일 먼저 실행한다. 그래서 변수 선언이나 함수 선언을 끌어 올린다는 의미로 "hoisting"이라는 표현을 쓴다. 변수 선언을 하기 전에 그 변수를 사용하는 코드를 먼저 둘 수 있다. 변수 선언은 항상 script 태그를 실행할 때 제일 먼저 실행된다. hoisting은 현재 태그에 선언된 변수나 함수에 대해서만 수행한다. 변수 선언만 먼저 실행되는 것이지, 값을 할당하는 코드는 원래의 순서대로 실행된다.

자바스크립트 문법 3

window 객체
=> 자바스크립트 언어의 내장(built-in) 객체는 아니다.웹브라우저에서 제공하는 기본 객체이다.자바스크립트에 선언되는 모든 글로벌 변수와 글로벌 함수는 이 객체에 자동으로 소속된다.

함수 바깥에 선언되는 모든 변수는 window 객체에 소속된다. 보통 "글로벌 변수(global variables)"라고 한다. 글로벌 변수는 모두 window 객체에 자동 소속된다. 다른 말로 window 객체에 소속된 변수나 함수를 글로벌 변수, 글로벌 함수라 한다.

 

객체에 저장된 값을 꺼낼 때는 다음의 문법을 사용할 수 있다.
=> 객체.변수명
=> 객체["변수명"]
=> 객체['변수명']

 

 

자바스크립트는 일반 블록에 선언된 var 변수도 글로벌 변수로 간주한다.
자바스크립트에서 let 변수는 블록 변수로 간주한다.let 변수는 그 변수를 선언한 블록에서 나가면 제거된다. let 변수는 로컬 변수이기 때문에 window에 소속되지 않는다.

자바스크립트에서 로컬 변수는 함수 안에 선언된 변수를 말한다.

조건문 블록도 일반 블록과 같다. 즉 조건문 안에 선언되는 모든 변수는 로컬 변수이다. 반복문 블록도 일반 블록으로 간주한다. 반복문, 조건문 블록 안에 선언되는 변수도 결국 함수에 소속된 변수이기 때문에 반복문, 조건문이 끝난 다음에도 사용할 수 있다.