[javascript] 자바스크립트 입문하기(2) - 자바스크립트의 기본 문법

*해당 포스팅은 복습 차원으로 정리하고 있는 내용입니다.

부족한 부분이 있거나, 좀 더 제가 공부하면 좋을 법한 부분은 피드백해주시면 감사하겠습니다:)

---

(1)변수

변수는 값을 핡당하고 그 저장된 갑슬 참고하기 위해 사용한다. 

자바스크립트에서 변수는 주소를 기억하는 저장소이다. 즉, 변수란 메모리 주소에 접근하기 위해 이해할 수 있는 언어로 지정한 식별자이다.

그동안 변수를 선언할 때는 var 키워드를 사용했으나, ES6 문법부터는 var를 사용하지 않고 const와 let 만을 사용하고 있다.

 

 

 

예전문법

var x;  //변수의 선언

x = 7; // 정수값의 할당

 

ES6 문법

const a = 0;

Or 

let b;

b=0;

 

그렇다면 const와 let의 차이는 무엇일까?

const는 한번 값을 대입하면 다른 값을 다시 대입할 수 없다.

그래서 const로 값을 대입한 후, 다시 다른 값을 대입하려 한다면 에러가 발생하게 된다.

또한 초기화 시에 값을 대입하지 않으면 에러가 발생하게 된다.

 

 

 

(2)데이터타입

 

데이터타입이란, 프로그래밍 언어에서 사용할 수 있는 값의 종류를 말한다.

크게 기본타입과 참조타입으로 나눠진다.

 

 

기본 타입

. 숫자(number)
. 문자열(string)
. 불린값(boolean)
. null
. undefined

 

 

참조 타입

. 객체 ( object). 
         - 배열 (array)
         - 함수 (function)
         - 정규 표현식 

 

타입 예시는 아래와 같다.

//number

let num1 = 1001;    //정수타입

let num2 = 11.07;   //float 타입





//string

let string1 = ‘Hello’ // 따옴표 한개 사용

let string2 = “world” //  따옴표 두개 사용





//boolean

let bool1 = true;

let bool2 = false;





//undefined

let empty;



//null

let nullVar = null;





//object

let obj = {

 name : ‘다예’,

 gender : ‘female’,

 likeNum : 7 ,

 likeItem : [‘phone’, ‘camera’]

};



//array

let array =[1,2,3,’choi’];



//function

let fun = function() {} ; 

 

여기서 undefined와 null을 헷갈려하실 수 있는데, 

null은 값이 비어 있음을 명시해놓는 부분아고, undefined는 값이 할당되지 않는 변수를 말한다.

 

 

(3)값

값은 프로그램에 이해 조작될 수 있는 대상을 말한다. 가장 간단한 방법은 리터럴 표기법을 사용하는 것이고,

리터럴이란 소스코드 안에서 직접 만들어 낸 상수 값 자체를 말하며 값을 구성하는 최소 단위를 말한다.

숫자,문자열,불린 같은 기본타입의 리터럴은 다양한 연산잗의 피연산자가 되어 하나의 값으로 될 수 있으며.

리터럴은 연산에 의해 하나의 값이 될 수 있다.

 

//연산

10.50 + 1107

 

 

(4)연산자

그럼 연산자란 무엇일까?

연산자란 하나 이상의 표현식을 대상으로 산술, 할당, 비교, 논리 타입 연산 등을 수행해 하나의 값을 만드는 것을 말한다.

이 때 연산의 대상을 피연산자라고 말한다.

피연산자의 타입은 반드시 일치할 필요가 없다. 왜냐하면 자바스크립트는 압묵적 타입 강제 변환을 통해 연산을 수행하기 때문이다.  그렇다고 모든걸 일치 하지 않고 막 쓰라는 말은 아니다.

 

//산술연산자

Var area = 11*7; //77





//문자열 연결 연산자

var intro = ‘my name is’ + ‘daye’; // my name is daye



// 할당 연산자



var color = ‘yellow’; // yellow





//비교 연산자ㅁ

var foo = 4<5 ;// true



//논리 연산자

var bar = (5>3) && (2<4) ;// true



//타입 연산자

var type = typeof ‘daye’ ;// string

 

이때 한가지 주의할 점이 있다. 자바스크립트에서만 존재하는 특이한 비교 연사자에 관한것이다. 흔히 다른 프로그래밍 언어에서 값을 비교할 때는 ‘==‘ 연산자를 사용한다.

하지만 자바스크립트에서 값을 비교하려면 ‘===‘를 사용해줘야한다.

 

let string = ‘2’;

let number = 2;



console.log(` ==의 결과 : $(string == number)`); //true

console.log(` ==의 결과 : $(string === number)`);  //false

 

왜냐하면 자바스크립트에서는 ‘==‘ 연산자는 값의 형태만 보고 비교한다.

그래서 문자열의 2랑 숫자 2를 똑같이 인식한다.

하지만 우리는 대상의 type까지 같은지 검사를 하기 위해 대부분 비교 연산자를 사용한다.

그래서 우리는 자바스크립트에서 값을 비교할 때 ‘==‘가 아니라 ‘===‘를 사용해야 한다.

 

 

 

(5) object(객체)

자바스크립트는 객체 기반의 언어이다. 따라서 자바스크립트를 이루고 있는 대부분은 객체로 되어 있다.

아까 위에서 언급되었다시피 자바스크립트는 데이터 타입이 기본 타입과 나머지 것으로 구성되어 있는데,

여기서 나머지 것(함수, 배열, 정규표현식 등등)이 모두 다 객체이다. 

 

자바스크립트 객체는 이름(key)과 갑승로 구성된 프로퍼티(property)의 집합니다. 

이 프로퍼티 값으로 자바스크립트에거 가능한 모든 값을 다 사용할 수 있다.

 

let me = {
	name : 'daye';
    age : 28;
    major : 'ITmedia'
     {
    console.log('hello!.my name is' + this.name + 'my major is' + this.major)
    }
    
    
    console.log(typeof me); //object
    console.log(me) ; // {name : 'daye',  age : 28, intro : [Function: intro]}
    
    me.intro() ; //hello!.my name is daye my major is ITmedia
   


}

 

 

 

---

 

마치며

여기까지는 자바스크립트에서 기본적으로 구성되는 문법 관련된 내용이다. 다음에는 일급객체에 대해 좀 더 공부하고, 정리하도록 하겠다.

또한 복습하면서 좀 더 기본문법으로 정리하고자 하는 부분은 꾸준히 해당 글에 업로드하겠다.