JavaScript 문법 - 변수

 

지금까지 문법 공부를 하고 코딩테스트도 보면서 여전히 개념이 이해가 안된 부분이 '함수'와 '변수'다.

다른 문법도 버거운 상태이지만, 함수와 변수는 그 속에서 계속 등장하는 걸 보면 매우 기초개념일텐데 ..

 

 

변수

변수는 프로그래밍 언어에서 우리가 처리해야 되는 데이터를 담을 수 있도록 도와주는 아이 = 데이터를 담고 있는 아이

자바스크립트에서 변수를 만들 때는 'let' 이라는 키워드를 이용

 

1. primitive type

let number

 

: number 라는 변수의 이름을 정의

 

let number = 2;

 

: 숫자 2가 number라는 변수에 할당

let number = 2; //숫자도 되고
let num = '2'; //문자열도 됨

 

이렇게 숫자도 되고 문자열도 되는 담을 수 있는 가장 작은 단위의 데이터들을 'primitive data type'이라 한다.

data type : number, string, boolean, null, undefined, symbol

 

여기서 number라는 변수의 이름은 원하는 대로 만들 수 있는데, number는 의미가 없으므로 logic과 연관된 의미있는 이름을 지정하는 것이 좋다.

 

let age = 2;

 

---

작은 단위의 데이터들은 변수를 선언하면 메모리에 무조건 그 변수를 위한 공간이 생긴다.

예를 들어 2를 할당하면, 공간에 2가 적재되어진다. 즉, number라는 변수 안에 2라는 숫자 데이터가 들어있게 된다.

let number = 2;
let number2 = number;
console.log(number);  //2
console.log(number2); //2

 

number에 있는 데이터가 복사되어 number2에 들어온거기 때문에 number2의 변수의 값을 변경하면 number에는 영향을 전혀 주지 않는다.

 

let number = 2;
let number2 = number;
console.log(number);  //2
console.log(number2); //2

number2 = 3;

console.log(number);  //2
console.log(number2); //3

 

2. objective type

 

primitive type도, objective type도 변수를 할당할 때 변수 안에 들어있는 값이 복사되어서 들어온다.

let obj = {
  name: 'Diana',
  age: 5,
};
console.log(obj.name); //Diana

let obj2 = obj;
console.log(obj2.name); //Diana

 

하지만! 다른점은 number, string, boolean 등은 그 데이터 자체가 변수에 담겨있어서 데이터 자체가 복사되어 들어오지만, object는 object를 가리키고 있는 주소가 들어있기 때문에 그 주소만 복사되어 들어온다.

 

따라서

let obj = {
  name: 'Diana',
  age: 5,
};

let obj2 = obj;

obj.name = 'James';
console.log(obj.name);  //James
console.log(obj2.name); //James

 

obj나 obj2나 결국은 가리키고 있는 object가 동일하기 때문에 어떤 곳을 통해서 이름(name)을 업데이트해도 둘다 변경이 된다. 

 

 

---

FUNCTION

• fundamental building block in the program (프로그램을 구성하는 아주 중요한 building block)
• subprogram can be used multiple times (subprogram 으로도 불리며, 여러번 재사용이 가능)
• performs a task or calculates a value (한 가지의 일이나 어떤 값을 계산하는데 쓰여짐)

 

자바스크립트에서 function을 정의하는 방법

 

• function name (param1, param2) { body ... return; }
• one function === one thing
• 함수는 무언가를 동작하는 것이기 때문에 doSomething, command, verb 형태로 이름을 지정해야 한다.

    예) createCardAndPoint -> createCard, createPoint

• function is object in JS

 

function printHello() {  //parameter는 하나도 받지 않음
  console.log('Hello');
}
printHello();

//output : Hello

 

: Hello 만 출력하는 쓸데없는 함수🥲

function log(message) {
  console.log(message);
}
log('Hello');
// output : Hello

 

: parameter로 메세지를 전달하면 메세지를 출력하는 함수가 유용☺️

 

function log(message) {
  console.log(message);
}
log('Hello'); // output : Hello
log(1234);    // output : 1234

 

자바스크립트에서는 type이 없어서 message가 string을 전달해야 되는지, number을 전달해야 되는지가 명확하지 않다. 다행히, 숫자가 문자열로 변환이 되어 log가 출력이 되기 때문에 상관없지만, 다른 함수에서 type이 중요한 경우는 자바스크립트는 조금 난해하다.

=> typescript 배우길 추천.