Javascript 자바스크립트 기본 문법들

 

 

자바스크립트의 ES5기반으로 한 기본 개념들입니다.  

공부했던 내용을 정리하는 용도로 오류가 있을 수 있습니다.

재배포 수정하지 마세요. 

 

 

 

---

 

 

문장 Statement

 

자바스크립트 코드의 실행 단위로써  세미콜론(;)까지가 하나의 문장이다. 

문장 시작은 위치제약이 없고 문장 들여 쓰기는 기본이 2칸, 4칸이다. 

 

 

if (true) {
    var lemon = "시다";
    var count = 2;
};
if (true) {
    var apple = "시고 달다";
};

if { 부터 }; 까지가 한 문장이고 그 안에 var부터 세미콜론까지가 한 문장이다. 문장 안에 문장들을 안고 있는 구조이다.  

 

 

 

변수 Variable 

 

값을 저장하는 영역으로 저장된 값을 재사용하기 위해 쓴다. 

 

var apple = "사과";
var amount = 987, amount = 887;
var amount = 499
    ,amount = 90;
amount = 300;
var number = day = 4;

 

• var 변수명 = 할당값;  
• var(variable의 약자)로 지정을 해주고 하나의 문장에 콤마로 구분하여 여러 개의 변수를 지정할 수 있다. 단 문장 하나에 var도 하나여야 한다. 띄어쓰기나 줄 바꿈은 상관없이 ;로 문장의 끝을 정한다.
• 한번 변수의 할당값을 주고 나중에 값을 할당해주면 그 값으로 바뀐다.
• 마지막 문장처럼 여러개의 변수에 같은 값을 할당해줄 수 있지만 권장하지 않는다. 
• 변수의 이름은 의미를 부여하여 지정해주는 것이 좋다. 이를 Sementic이라고 한다. 

 

 

 

주석 Comment

 

주석은 코드로 인식하지 않는다. 

 

/**
 * 1. 이 형식으로 작성함. 
 */

//var apple = "사과";
var amount = 987//, amount = 887;
/*var amount = 499
    ,amount = 90;*/
amount = 300;
var number = day = 4;

 

• 한 줄 주석 : //로 시작해서 써주고 문장 중간에서 시작해서 그 줄의 끝까지 주석처리해줄 수 있다.
• /* */ : 블록주석, 여러 문장들을 주석처리해줄 때 사용한다. 
• /** */ : 정식은 아니지만 블록주석과 같다. 개발자들이 관용적으로 쓰는 주로 주석으로 앞으로 어떤 형식으로 코드를 짤 것인지에 대한 내용을 담는다. 

 

 

Console.log( )

 

var apple = 7;
console.log(apple);

 

소괄호 안에 작석된 값을 브라우저 콘솔 창에서 출력해준다.

콤마로 구분하여 다수를 작성할 수 있고 소괄호 안의 값은 보통 파라미터 값이라고 부른다.  

 

 

 

 

 

정수와 실수 Decimal Number

 

console.log(.123);			//0.123
console.log(4+ 0.4);			//4.4
console.log(4);				//4

 

자바스크립트에서는 정수와 실수를 구분하지 않는다. 

ES6 에디션에서는 정수와 실수를 구분할 수 있는 것이 생겼다.  

 

 

 

 

상수 Constant Number

 

상수는 변경 할 수 없는 값, 실질적으로 변경할 수 있지만 나중에 변경하지 말자는 개발자들의 약속으로 선언적 의미(sementic)이다. 

 

var FIVE = 5;
//JS가 제공하는 상숫값은 변경불가
console.log(FIVE.MAX_VALUE);
console.log(FIVE.MIN_VALUE);

 

코딩 관례로 영문 대문자만을 사용한다. 

MAX_VALUE 와 같은 자바스크립트가 제공하는 상숫값은 변경이 불가하다.

 

 

 

진수 Decimal & Hexadecimal & Octal Number

 

console.log(987);  //10진수
console.log(0xFF);   //16진수 255 
console.log(0xff);  //225 (16*15 +15) 
console.log(0xfff);  //4095  (16*16*15 + 16*15 + 15)  
console.log(0o7);  //8진수 

 

• 16진수 : 앞 두글자가 0x로 시작하고 세 번째부터는 0~f로 표시한다. 대소문자는 구분하지 않는다. 
• 8진수 : ES6에서 폐지되었지만 ES6에서 재정의 되었다. 위에 내용은 재정의된 후 표기법이다. 

 

 

 

데이터 타입 Data Type

 

'자료형' 이라는 의미로 할당 값의 타입 형태이다. 

 

 

var apple = 100;
var lemon = "시다";
console.log(typeof apple);    //number
console.log(typeof lemon);    //string

 

첫 번째 데이터 타입은 숫자(number) 타입이고 두 번째 데이터의 타입은 문자(string) 타입이다. 

typeof 연산자는 데이터값의 타입을 반환하기 때문에 이를 이용해 데이터의 타입을 확인할 수 있다. 

자바스크립트는 데이터를 기중으로 타입을 결정한다. 타입을 먼저 선언하고 데이터를 할당하지 않는다. 

 

 

 

 

 

숫자 타입 Number

 

 

var apple = 13.25;
var lemon = -2;
console.log(typeof apple);    //number 
console.log(typeof lemon);    //number
console.log(2 * "딸기");      //NaN   Not-a-Number
console.log(typeof Infinity);   //number
console.log(typeof -Infinity);  //number

 

 

부호를 가진 값이다. 

숫자타입에는 특수한 3개의 값이 있다. 

• NaN : Not-a-Number   (연산 결과 숫자 타입이나 문자 타입이 아니게 될 때 숫자가 아니라는 값이 된다.)
• Infinity : 양수 무한대
• -Infinity : 음수 무한대

 

 

 

문자 타입 String

 

 

var strawberry = "딸기";      //string 
var grpes = "7"               //string

var melon = "딸기는 '과일'"
var mango = '딸기는 "과일"'
console.log(melon);           //딸기는 '과일'
console.log(mango);           //딸기는 "과일"

 

 할당된 값이 숫자던 문자던 홑따옴표나 큰따옴표로 표현된 값이라면 문자 타입이 된다. 

큰따옴표와 홑 따옴표를 같이 쓸 경우에는 짝을 잘 맞추어 작성해주어야 한다.  

 

 

 

 

 

Undefined 타입

 

 

var apple;
console.log(apple);     //undefined   

 

Undefined 타입의 값은 undefined(소문자)이다. 

변수의 초기값(default)이다. 

변수를 선언만 한것으로 undefined가 초깃값으로 설정되고 값을 할당하지 않은 것을 나타내는 의미적 선언(sementic)이다. 

 

 

 

 

Null 타입

 

 

var lemon = null;
console.log(lemon);     //null

 

Null타입의 값은 null(소문자)이다. 

null은 undefined와 다르게 null을 할당해야만 값이 된다. 

단지 변수만 선언한 것이 아닌 의도적으로 값이 없음을 할당한것이다. 

 

 

 

 

Boolean 타입

 

 

console.log(true);      //true
console.log(false);     //false

 

true와 false 두개의 값만을 가진 타입이다.

 

 

 

 

 

Object 타입

 

var apple = {name: value};     
var lemon = {melon: "달다", grapes: "시다"};
console.log(lemon);             //{melon: "달다", grapes: "시다"}

 

 

{name: value} 의 형태로 name은 key와 같다. 

하나의 프로퍼티(properyt)는 하나의 name과 value를 지칭한다. 

Object는 프로퍼티의 집합체이다. 

 

 

 

 

정리

 

console.log(typeof 11);                         //number
console.log(typeof "blah");                     //string
console.log(typeof true);                       //boolean
console.log(typeof undefined);                  //undefined

console.log(typeof null);                       //object
console.log(typeof {melon: "달다"});            //object

 

데이터 타입들을 정리해보았다. 

특이한 점은 undefined의 타입은 undefined이지만 null의 타입이 object라는 점이다. 하지만 이것도 ES5까지는 구분하지 못한다.