본문 바로가기
Java Script

Java Script-변수와 상수, 데이터 타입

by Hrin_0820 2020. 9. 9.

1. 변수 선언 (var, let)

 변수는 '데이터를 저장하는 장소'를 의미한다. var과 let 키워드를 사용하여 선언하고 할당 연산자를 사용해 값을 할당한다. 그리고 식별자인 변수명을 사용해 저장된 값을 참조한다.

 var num = 10;
 var str = 'javascript';
 var temp = true;
 var : 변수 선언을 의미
 num, str, temp : 변수를 구분하는 이름(변수명)
 10, 'javascript', true : 변수에 저장되는 데이터(값)

 - 여러 개의 변수를 선언할 경우 다음과 같은 방법으로 선언할 수 있다.

 var num, str, temp;
 var num = 10, str = 'javascript', temp = true;

 - 변수는 새로운 데이터가 저장되면 기존 데이터는 사라진다.

 var num = 0;
 num = 10;
 document.write(num);  // 10

▶ 변수명 관련 주의사항

 - 변수명은 띄어쓰기할 수 없다.

 var n um = 10;

 - 변수명의 첫 글자에는 숫자나 특수문자가 올 수 없으나 예외적으로 '_'나 '$'는 사용할 수 있다.

 var 1num = 10;
 var %num = 10;
 var _num = 10;
 var $num = 10;

 - 예약어(reserved word)는 특별한 용도를 가진 키워드를 의미하며, 변수명으로 사용할 수 없다.

자바스크립트 예약어의 종류

 - 명명 규칙

   : 변수, 함수, 객체 등을 선언할 때는 변수명, 함수명, 객체명과 같이 이름이 필요하다. 이러한 이름에 일정한 규칙을 부여하면 코드에 대한 가독성을 높일 수 있다.

표기법 설명
camelCase(카멜) 표기법 첫 번째 단어의 첫 문자는 소문자, 두 번째 단어 이후부터는 첫 문자만 대문자로 표시
userAge, createElement( )
Pascal(파스칼) 표기법 각 단어의 첫 글자를 대문자로 표시
UserAge, SpeedDirection( )
underscore(언더스코어) 표기법 각 단어를 언더바(_)로 이어준다.
→ user_age, time_process( )

▶ let을 이용한 변수 선언 방법

 - var을 이용한 변수 선언의 단점을 보완하기 위해 let이 추가되었다.

 let num = 10;
 let str = 'javascript';
 let temp = true;

 - var과 같은 변수 선언의 기능을 가진다. var과 let의 차이점

 var num = 10;
 var num = 20;
 document.write(num);   //20
 let num = 10;
 let num = 20;
 document.write(num);   //에러

var은 동일한 변수를 중복해서 선언할 수 있지만 let은 이미 선언한 변수를 중복해서 선언할 수 없다.

var 선언 출력 이미지 / let 선언 출력 이미지

2. 상수 선언 (const)

 변수(var, let)가 변경되는 데이터를 선언하는 반면, 상수(const)는 변경하지 않을 데이터를 선언한다.

  var let const
중복 선언 가능 불가능 불가능
값 변경 가능 가능 불가능

3. 데이터 타입 (Date Type)

 데이터 타입은 변수에 저장되는 데이터의 유형으로 Primitive(원시) 데이터 타입Object(객체) 데이터 타입으로 나눌 수 있다. Primitive(원시) 데이터 타입으로는 number, string, boolean, undefined, null, symbol 등이 있으며, Object(객체) 데이터 타입에는 function, object, array 등이 있다.

데이터 타입의 종류

3-1. 원시 타입 (Primitive Data Type)

 원시 타입의 값은 변경 불가능한 값(immutable value)이며 pass-by-value(값에 의한 전달)이다.

▶ number(숫자) 데이터

 number 데이터는 정수, 소수점, 지수를 표현할 수 있다.

 var num1 = 10;
 var num2 = 10.5;
 var num3 = 1e+2;  // 100, 1*10의 2승

▶ string(문자) 데이터

 string 데이터는 텍스트 데이터를 나타내는데 사용하며, ' '또는 " "을 표현한다. 보통 문자 데이터는 작은따옴표로 많이 표현한다.

 var str1 = '문자';
 var str2 = "문자";
 var str3 = '문자는 "문자"';

▶ boolean(논리) 데이터

 boolean 데이터는 논리적 참(true), 거짓(false)의 값을 표현한다. 프로그램의 흐름을 제어하는 조건문에서 자주 사용한다. Boolean( ) 명령어는 변수의 값을 true나 false로 변환시켜주는 명령어이다.

 var com1 = (5 > 4);  // true
 var com2 = (5 < 4);   // false
 var com3 = 1;          // true : 0 이외의 숫자나 문자는 true를 의미
 var com4 = 0;          // false : 0 값은 false를 의미

▶ undefined 데이터

 undefined 데이터는 변수는 선언하였으나 데이터 값을 지정하지 않았을 경우나 객체의 속성 값을 지정하지 않았을 경우에 자동으로 저장되는 값이다.

 var temp1 = 10;   // 10
 var temp2;          // undefined → 변수에 데이터 값이 없기 때문에 undefined가 저장된다.

▶ null 데이터

 null 데이터는 undefined와 유사하지만 변수를 빈(empty) 상태(초기화)로 만들거나, 데이터를 저장하였으나 값이 존재하지 않을 때 null 값을 반환한다.

 var obj = 10;
 obj = null;     // null, 변수를 빈(empty)상태로 만든다.

▶ symbol

 symbol 데이터는 주로 이름의 충돌 위험이 없는 유일한 객체의 프로퍼티 키(property key)를 만들기 위해 사용한다. 심볼은 Symbol 함수를 호출해 생성한다.

 // 심볼 key는 이름의 충돌 위험이 없는 유일한 객체의 프로퍼티 키
 var key = Symbol('key');   // symbol

▷ typeof 명령

 typeof는 연산자로, 변수나 데이터에 저장된 자료형을 알고 싶을 때 사용한다.

 typeof 변수 또는 데이터;

 

        //number
        var num1 = 10;
        var num2 = 10.5;
        var num3 = 1e+2;
        console.log(num1+', '+num2+', '+num3);
        
        //string
        var str1 = '문자';
        var str2 = "문자";
        var str3 = '문자는 "문자"';
        console.log(str1+', '+str2+', '+str3);
        
        //boolean
        var com1 = (5 > 4); 
        var com2 = (5 < 4);  
        var com3 = 1;  
        var com4 = 0; 
        console.log(com1+', '+com2);
        console.log(Boolean(com3)+', '+Boolean(com4));
        
        //undefined
        var temp;   
        console.log(temp);
        
        //null
        var obj = 10;
        obj = null;
        console.log(obj);
        
        //typeof
        console.log(typeof num1+', '+typeof str1+', '+typeof com1);

출력 이미지

'Java Script' 카테고리의 다른 글

Java Script-제어문  (0) 2020.09.10
Java Script-연산자  (0) 2020.09.09
Java Script-기본 문법  (0) 2020.09.07
Java Script-기본 형식 및 적용 방법  (0) 2020.09.07
Java Script-정의 및 특징  (0) 2020.09.07

댓글