JavaScript 기본 문법

JavaScript의 기본 문법 네가지를 한번 해보겠다.
1. 변수
2. 조건문
3. 반복문
4. 함수

1.변수

변수는 변하는 수이다.

var age = 26;
console.log(age);

위 코드는 age라는 변수를 var로 선언 해주고 그 변수 안에 26을 넣어 준 것이다.
그리고 console.log 를 이용해 age라는 변수를 console에 띄워주면 26이 나오는것을 확인 할수 있을것이다.
파일 실행은 터미널에 node 내가지은이름.js로 파일을 실행 시켜준다.
만약 여기 밑으로

age = 24;
console.log(age);

를 해주고 터미널에 node 내가지은이름.js로 파일을 실행 시켜준다.
age가 24로 재 할당 되어서 콘솔에는 24가 찍힐 것이다.
그리고 변수 두개를 합치거나 뺄 수도 있다.

var age1 = 26;
var age2 = 24;
var age3 = age1+age2;
console.log(age3);

이렇게 해주고 터미널에 node 내가지은이름.js로 파일을 실행 시켜준다.
콘솔에는 26+24인 50이 찍힐 것이다.
파일이 바뀔때 마다 실행을 계속 다시 해줘야 한다.
다음장 부터는 실행하는 설명은 생략하겠다.

변수는 숫자가 아닌 문자도 넣을 수 있다.

var name = "hyungu";
console.log(name);

이렇게 해주면 hyungu라는 문자가 터미널에 찍힐 것이다.

그리고 변수는 리스트로도 가능하다.

var person = ["hyungu", 26];
console.log(person);
console.log(person[0]);
console.log(person[1]);

이렇게 person이라는 리스트를 만들어 주고 첫번째 인자에 "hyungu", 두번째 인자에 26을 넣어준다.
그리고 person을 console.log로 찍어보면 리스트가 그대로 출력되고, person[0]을 console.log로 찍어보면 리스트의 첫번째 인자만 나오게 되는것을 확인 할 수 있다.
마지막으로 person[1]을 console.log로 찍어보면 리스트의 두번째 인자만 나오게 되는것을 확인 할 수 있다.
프로그래밍에서는 0이 첫번째이다.
리스트도 변수를 재 할당 할 수 있다.
만약 리스트의 첫번째 인자를 바꾸고 싶으면 그 밑으로

person[0] = 'kang';
console.log(person);

이렇게 써주면 된다. 첫번째 인자가 hyungu에서 kang으로 바뀐것을 확인 할 수 있을 것이다.

그리고 변수는 딕셔너리로도 가능하다.

var people = {"name" : "hyungu", "age" : 26 };
console.log(people["name"]);
console.log(people["age"]);

이렇게 people 딕셔너리를 만들고 이름과 나이를 넣어준다. 그리고 console.log로 people의 name과 age를 찍어본다.
그러면 터미널에 hyungu와 26이 뜨는것을 확인 할 수 있다.

2. 조건문

조건문은 조건이 충족되면 실행되는 문이다.
조건문은 대표적으로 if문이 있다.

var people = {"name" : "hyungu", "age" : 26};
if (people["age"] > 19 ) {
  console.log("udult");
}
else {
  console.log("minor");
}

이렇게 people 딕셔너리를 만들고 밑에 if문으로 만약 people의 나이가 19세 초과면 터미널에 udult라고 뜨게 하고,
만약 그렇지 않는다면 터미널에 minor 라고 뜨게 하는 것이다.
if 다음에 괄호 안으로 조건을 넣어주고 중괄호를 열어서 그 조건이 충족되면 실행 될 코드를 써준다.
그리고 else를 밑에 만들어서 저 조건이 맞지 않는다면 실행 될 코드를 써준다.
중간에 조건을 하나 더 넣고 싶다면 elseif를 if와 else 사이에 넣고 if 처럼 괄호 안에 조건을 넣어주고 그 조건이 충족되면 실행될 코드를 중괄호 안에 넣어주면 된다.

3. 반복문

반복문에는 대표적으로 for문과 while 문이 있다.
먼저 두개의 차이점 먼저 알아보겠다.
for문은 반복할 횟수를 알때 사용하면 편리하고, while문은 반복이 끝나는 조건을 알때 사용이 편리하다.
일단 왜 그러는지는 예제를 보면서 살펴보도록 하자.

for(var i = 0 ; i < 5 ; i++) {
  console.log(i);
}

이렇게 간단한 for문을 써본다. for문 안에 i 변수를 넣어주고 0으로 초기화 시켜준다. 그리고 조건을 i 가 5보다 작으면 반복이라고 잡아놓고 한번 반복 할때 마다 i를 1씩 증가시킨다. 그러면 터미널에 찍히는 값은 0,1,2,3,4가 순서대로 찍힐 것이다.
이처럼 for문은 반복 횟수를 알때 편리하게 사용할 수 있다. 여기선 반복횟수가 5로 알고 있어서 for문이 편리하다.
다음은 while문 예제를 한번 써보겠다.

var n = 0;
var m = 0;
while (n<3) {
  n++;
  m +=n;
  console.log(m);
}

이렇게 간단한 while문을 써본다. 일단 n과 m 변수를 선언해주고 0으로 초기화 시켜준다.
그리고 while 괄호 안에 조건을 써준다. 여기서는 n이 3보다 작을때 라고 썻다. n 이 3보다 작다면 계속 반복 되는 것이다.
그리고 while문 안에 n을 한번 반복될때마다 1씩 증가하게 놓고 m에 n을 더한 값을 m에 집어 넣는다.
그리고 console.log로 m값을 확인한다. 터미널에 1,3,6이 순서대로 찍힐 것이다. 처음 n은 1이고 두번째 n은 2이니 1+2해서 3이 찍히는거고 세번째 n은 3이니 3+3해서 6이 찍히는 것이다. 이처럼 while 문은 조건을 넣어서 그 조건이 만족 되는 한 계속 반복 되는 것이니 끝나는 조건을 알때 while 문이 적합하다.

더 나아가 반복문과 조건문을 합쳐보자.

var number = [3,18,5,22,4,66,34] 
for (var i = 0; i < number.length ; i++) {
	if (number > 19 ) {
      console.log(number[i] + " = adult");
    }
    else {
      console.log(number[i] + " = minor");
    }
}

이렇게 실행을 해주면 리스트에 있는 값들이 성인인지 미성년자인지 판별해서 터미널에 보여지게 된다.

4.함수

함수(function)란 하나의 특별한 목적의 작업을 수행하도록 설계된 독립적인 블록을 의미한다.
이러한 함수는 필요할 때마다 호출하여 해당 작업을 반복해서 수행할 수 있다.
함수는 함수의 이름, 매개변수, 실행문 으로 구성 되어 있다.
일단 간단한 함수 예제를 보도록 한다.

function add (x,y) {
  console.log(x+y);
}
add(2,3);

이렇게 간단한 함수를 만들어 본다.
add는 함수 이름이고, 그 옆에 괄호는 매개변수 이다.
그 매개변수가 함수 안에 중괄호로 되어있는 실행문에 들어가서 실행 되는 것이다.
x와 y를 매개변수로 받고 실행문은 받아온 x와 y를 더한 값을 터미널에 출력하는 것으로 하였다.
그리고 함수 호출은 함수 이름과 매개변수를 넣어서 호출하면 된다.
이렇게 호출을 하게되면 터미널에 5가 찍히는 것을 볼 수 있다.

그리고 함수에는 반환문이 있는데 return을 실행문 안에 쓰면된다.
반환문은 배열이나 객체를 포함한 모든 타입의 값을 반환할 수 있다.
예제를 살펴보도록 한다.

function multi (x,y) {
  return x*y;
}
var num = multi(2,3);
console.log(multi(2,3));
console.log (num);

이렇게 코드를 짜놓고 실행을 하면 6이 뜨게 된다.
multy라는 함수에 리턴값을 x*y 를 줘서 매개변수에 2,3이 들어오면 6이 나오는 것이다.
따로 변수에 값을 저장해서 나오게 할 수도 있고, 변수에 저장 안하고 바로 함수를 호출해서 나오게 할 수도 있다.

이렇게 기본문법 네가지에 대해 알아 보았다.
다음은 이제 ES6의 새로운 문법에 대해 알아보겠다.

좋은 웹페이지 즐겨찾기