2016. 1. 21. 15:53ㆍlanguage/javascript
1. 변수
다른 언어를 경험해본 사람들은 변수가 무엇인지 쉽게 알것이다.
변수란 특정 데이터를 담는 가방이라고 생각하면 쉽다.
변수 명은 가방의 이름이라고 생각하자. 이름이라는 가방에 홍길동이라는 정보를 담는다.
그럼 이름이라는 가방을 들고다니다가 그 가방에 정보를 꺼내면 홍길동이라는 이름이 나온다.
사용방법은 다음과 같다.
var 가방 = "홍길동";
var은 이것은 변수입니다. 라고 알려주는 것이고 홍길동 이라는 이름 양옆에 "(쌍따옴표)를 붙힌 것은 이것은 문자라는 것을 알려주기 위함이다. 당연히 명령이 끝난 마지막을 알리는 세미콜론(;)도 필요하다.
다시 정리하면 변수는 특정 값이 기억될 장소를 나타낸다.
홍길동이라는 이름은 가방이라는 변수에 기억되고 있다.
가방이라는 변수를 가지고 다니다가 사용할 때는 홍길동이라는 정보를 꺼내 사용하게된다.
변수는 크게 전역변수와 지역변수로 나뉜다.
전역변수는 페이지 내부 전체에서 사용 가능한 하나의 변수만을 나타낸다.
한 페이지에서 가방이라는 변수가 전역변수로 선언되어 있다면 페이지 내에 다른 어디에서도 가방이라는 변수가 선언되어서는 안된다.
지역변수는 해당 지역에서만 사용가능한 변수이다.
해당 지역이라 함은 뒤에 배울 함수 내부를 말한다.
다음 예제를 보면 이해하는데 좀더 쉬울 거라 생각한다.
참고로 변수나 함수에서 한글 사용은 이해를 돕기 위함이므로 실제 사용할 때에는 사용하지 마시길 바란다.
<script type="text/javascript">
// 지금처럼 아무런 테두리 없이 선언되어 있다면 이것은 전역변수 입니다.
var 가방 = "홍길동";
function test(){
// 어떠한 함수 내부에 선언되어 있다면 이는 지역변수 입니다.
var 가방 = "홍길동";
// 단 함수 내부에서 var 이라는 선언이 없이 선언된 변수라면 이는 전역변수 입니다.
가방 = "홍길동";
}
// 함수선언에 ()괄호 안에 있는 가방이라는 것도 변수이고 이는 지역변수입니다.
function test(가방){
}
</script>
2. 자료형
javascript(자바스크립트)는 느슨한 타입 (loosely typed) 언어, 혹은 동적 (dynamic) 언어이다.
그래서 특별히 변수에 대해 특정 타입을 지정할 필요가 없다.
또한 같은 변수에 여러 타입의 값을 지정할 수 있다.
2.1 기본타입 (primitive values) 에는 6개의 자료형을 정의한다.
- 정수형(Number)타입 : (-(253 -1) 와 253 -1 사이의 숫자값) 단 하나만 존재한다. 정수만을 표현하기 위한 특별한 자료형은 없다. 부동 소수점을 표현할 수 있는 것 말고도, Number 타입은 세 가지 의미있는 몇가지 상징적인 값들도 표현할 수 있다. 이 값에는 +무한대, -무한대, and NaN (숫자가 아님)이 있다.
ex) 100, 300, 20, 0
0100(8진수) ==> 64
0xA6(16진수) ==> 166
3.14, 1000.0, 0.0002
1.234e4 ==> 1.234 * 10의 4승 ==> 12340
1.234E-2 ==> 1.234 * 10의 -2승 ==> 0.01234
- 문자형(String)타입 : 쉽게 말해 텍스트이다. 어렵게 말하면 16비트 부호없는 정수 값 요소들의 집합이다. 문자형의 길이는 첫번째 인덱스0, 두번째 인덱스1 ... 과같은 방식으로 길이를 가지고 있다.
ex) "홍길동", 'abc', "100"
(스크립트는 "", '' 모두 String을 나타냄)
- 논리형(Boolean)타입 : 논리적인 요소를 나타내며 true(참), false(거짓) 두가지의 값 중 하나를 가진다.
- Null 타입 : 정의가 되어있지 않은 data (0도 아니고, ""도 아닌 값)
- Symbol타입 : Symbol은 유일하고 변경 불가능한 (immutable) 기본값 (primitive value) 이다. 또한, 객체 속성의 key 값으로도 사용될 수 있다.
2.2 객체(Objects)
- 속성을 가지고 있는 collection 으로 볼 수 있다. 속성 값은 객체를 포함하여 어떠한 자료형도 올 수 있고 속성은 키(Key) 값으로 식별된다. 키 값은 String 또는 Symbol 값이다.
3. 함수 (Function)
함수는 특정 작업을 실행하는 하나의 '일' 이라고 생각하면 됩니다.
집을 지을 때도 보면 벽돌을 나르는 일, 벽돌을 쌓는 일, 시멘트를 바르는 일 ... 등등 모든 일이 나누어져 있다.
이는 마찬가지로 프로그램을 짤때도 각각의 역할에 맞는 일을 나누어서 짜야한다.
함수의 모양은 다음과 같다.
function test(){
}
function 은 함수입니다 라는 것을 알리는 선언이고 그 다음 오는 문자가 함수명이 되겠다.
그리고 함수명 다음에 오는 괄호() 는 매개변수 즉 데이터를 받을때 사용하고 없으면 위처럼 안쓰면 된다. 그리고 실질적인 일을 하는 부분은 {} 이 괄호 사이에서 이루어진다.
변수와 다르게 함수는 끝을 알리는 세미콜론(;)을 사용하지 않는다.
앞에서 배운 알림창(alert) 을 생성하는 함수를 만들어 보자
function makeAlert(msg){
alert(msg);
}
함수명은 알림창을 만든다고 하여 makeAlert로 주었고 매개변수는 msg (message)의 약자를 사용했다.
함수의 호출은
makeAlert();
혹은
makeAlert("안녕");
혹은
var msg = "안녕";
makeAlert(msg);
처럼 사용한다. 매개변수를 넣지 않으면 받는 함수에서 null을 받게된다.
기본적인 설명은 마치고 더 자세한 설명에 대해 궁금증이 있다면 이 포스트를 참고하기 바란다.