변수와 자료형 & 함수 & 조건문

이번 TIL에서 다룰 내용인 익숙한 개념이지만, 다시 나를 다시 돌아보는 마음으로 개념을 한번 다시 확인해보자.

 

1. 변수 (Variable)

 

변수는 이름이 붙은 값을 의미하며, 변수는 말 그대로 상황에 따라 변할 수 있다.

 

숫자 3까지의 간단한 구구단을 예로 들어보자.

console.log(3 * 1);
console.log(3 * 2);
console.log(3 * 3); /// 한 번의 작업을 세번 혹은 9를 곱할 때까지 9번 수정해야하는 번거로움 발생

구구단을 효율적으로 출력하기 위해서, 아래와 같이 num이라는 변수를 선언하고 값을 할당해주는 코드가 편리하다.

let num = 4 // num 변수는 계속 바뀔 수 있음

console.log(num * 1);
console.log(num * 2);
console.log(num * 3); // num이 계속 바뀌어도 변수에 할당된 값만 바꿔줘도 일괄적으로 적용됨

 

이렇게 정보를 저장하게 되면, 컴퓨터가 어떤 복잡한 작업을 한 후 다시 돌아와서 새로운 작업을 할 때 다시 꺼내서 쓸 수도 있다.

마치 복잡한 수학 문제를 풀다가 중간값을 따로 적어두는 것과 같은 역할을 한다.

 

* 표현식 (Expression)을 통해 아래와 같은 변수들을 사용할 수 있다.

pi * 5 * 5 // 반지름이 5인 원의 넓이

 

또한, 변수에는 그의 역할에 맞는 변수명, 이름을 붙일 수 있다. (Camel Case 사용)

예를 들어, 원의 넓이를 구하는 방법을 변수에 담는다면, 변수명을 'areaOfCircle' 이라고 지을 수 있을 것이다.

 

2. 타입 (Type)

 

위에 언급했던 변수에는 여러 가지의 정보들이 담긴다.

하지만 모든 정보가 같은 종류는 아니기 때문에, 해당 정보의 종류는 타입을 통해서 구분할 수 있다.

 

원시 자료형: string, number, boolean, undefined

타입마다 다른 속성과 메소드들이 존재한다.

typeof를 활용해 특정 값(정보)의 타입을 확인할 수 있다.

 

각 다른 타입이 섞인 타입도 있다. (Compound 자료형)

• 배열 (array)

let fruits = [
  'banana'
  'apple'
  'pineapple'
]

위 예시처럼 다수의 string 타입의 정보들이 섞인, 순서가 있는 집합 형태의 배열이 있다. 

 

• 객체 (object)

let person = {
  name: 'Steve',
  age: 32,
  isStudent: true
}

위 예시처럼 string, number 그리고 boolean과 같은 여러가지 타입들이 섞인 객체도 있다.

• 이 외의 타입들: undefined, 함수

3. 함수 (Function)

 

함수는 '기능의 단위'이며, 실행의 결과로 다시 돌아온다.

 

• 함수 선언 (Declaration)

function cal(parameter1, parameter2) {
  console.log(parameter1, parameter2);
  return parameter1 * 10;
}

 

• 함수 호출 (Call, Invocation)

예를 들어, let result = cal(10, 20);function cal(paramter1, parameter2) {  console.log(parameter1, parameter2);  return parameter1 * 10 // 반환되는 결과는 100 이다}

 

• 함수 선언식

function myFunction(input) { // input은 매개변수, parameter다.
  //내 코드
}

 

• 함수 표현식

let myFunction = function(input) {
  //내 코드}

 

4. 조건문 (if, else if, else)

 

일반적으로 대다수의 경우, 우리 코드에는 조건문이 들어가야만 문제를 해결할 수 있는 알고리즘을 짤 수가 있다.

조건문에는 반드시, 비교 연산자 (Comparison Operator)가 들어간다. 예를 들어, ===, !==, >, < 와 같은 연산자가 있다.

비교 연산자를 통한 비교의 결과는 늘 Boolean, 즉, true 혹은 false를 return한다.

 

** == 그리고 != 이 두 가지는 사용하지 않는 연산자다.

참고 원문: dorey.github.io/JavaScript-Equality-Table/

JS Comparison Table

조건문은 아래와 같이 사용된다.

  if (조건1) {

    // 조건1이 통과할 경우

  } else if {

    // 조건1이 통과하지 않고

    // 조건2가 통과할 경우

  } else {

    // 모든 조건이 통과하지 않는 경우

  }

두 가지 조건이 모두 들어가는 논리 연산자가 있다.

&& (AND 연산자) : ~~ 이면서 ~~ 일 때 

|| (OR 연산자) : ~~ 이거나, ~~ 일 때 

! : NOT 연산자

Ex. !true === false,

---

이번 TIL을 마치며..

 

기초 개념을 다시 살펴보았는데, 이런 저런 개념들을 나의 말로 정리해보는게 또 유익한 시간이었다.

이렇게, 천천히 기초부터 다시 쌓으며, 매일 TIL을 작성하자.