1. 변수

• 변수는 데이터를 다루는 방법이다.
• 변수를 사용하는 이유
• 변수의 선언과 할당

1. 필요한 값을 저장하고 필요할 때마다 그 값을 쉽게 바꿀 수 있다.
2. 변수의 이름을 통하여 어떤 값인지 예측할 수 있다.
3. 유지보수가 쉽다

변수 사용 예시를 들어 보겠다.

아래 구구단을 출력할때

console.log(3*1)
console.log(3*2)
console.log(3*3)
console.log(3*4)
console.log(3*5)
console.log(3*6)
console.log(3*7)
console.log(3*8)
console.log(3*9)

동일하게 반복되는 데이터(3)을 변수(num)로 대체하고 변수에 해당 데이터값을 저장할 수 있다.

let num = 5
console.log(num*1) // 5
console.log(num*2) // 10
console.log(num*3) // 15
console.log(num*4) // 20
console.log(num*5) // 25
console.log(num*6) // 30
console.log(num*7) // 35
console.log(num*8) // 40
console.log(num*9) // 45

위 내용이 무엇을 의미하느냐.

• 컴퓨터에는 데이터 보관함이 존재하는데
• 보관함의 크기는 동일하다
• 각 보관함의 이름 = 변수(데이터의 이름표임)
• 이름(변수)을 통해 보관된 데이터 사용할 수 있다(재활용)

변수 선언과 할당 방법

let myname; //변수 선언
myname = 'steve'; //myname이라는 변수에 steve라는 값을 할당

let myname = 'steve'; //선언과 할당을 함께 할 수 있음

• let은 재할당은 가능하지만 재선언은 불가능하다.

ex)
let sum = 1; // 이때 sum의 값은 1
sum = 2 // 재할당을 통해 sum은 2가 된다
let sum = 4 // 이렇게 재선언을 하면 안된다!

2. 타입

• 타입은 원시 자료형과 참조 자료형으로 나눠져 있다.
• 원시 자료형이란 하나의 정보만 담고 있는 것이다.

 number(숫자), string(문자), boolean(참, 거짓), undefined, null, symbol

• 참조 자료형이란 하나의 주제는 있지만 여러개의 정보를 담고 있는 것이다.

배열([]), 객체({}), 함수(function)

• 자바스크립트에선 타입을 확인 하는 방법이 있는데 typeof를 활용하여 특정값의 타입을 확인할 수 있다.

console.log(typeof 42);
// expected output: "number"

console.log(typeof 'blubber');
// expected output: "string"

console.log(typeof true);
// expected output: "boolean"

console.log(typeof undeclaredVariable);
// expected output: "undefined"

3. 함수

• 함수는 코드의 묶음, 즐겨찾기 버튼이다
• 따라서 함수는 기능의 단위라고 볼 수 있다
• 구체적인 입력값과 출력값을 가질 수 있고(mapping)
• 호출 후에는 반드시 돌아온다(return) (-->함수 내부에서 return을 하지 않은 경우, 출력값이 undefined)

함수 사용

여기서 param1를 '매개변수'라고 하고 param의 괄호 안의 값 10을 전달인자라고 한다.

let result = param(10);
// result를 적용 시켜보면
function param(param1){ // param(10) 
console.log(param1); // 10
return param1; // 10
}

함수의 선언 방법

1. 함수 선언식

// 함수 선언
function hello (name) {
    console.log(`Hello, ${name}!`);
}

// 함수 실행
hello('Jon');    // Hello, Jon!

2. 함수 표현식

// 함수 표현식
const hello = function (name = 'Hong') {
    console.log(`Hello, ${name}!`);
}

함수 표현식은 변수처럼 다뤄지기 때문에 코드 내에서 선언한 이후에만 함수를 호출할 수 있습니다. 이를 '호이스팅' 되지 않는다고 합니다. 반면 함수 선언식으로 함수를 만든 경우 함수의 위치와 상관없이 어디서든 호출 할 수 있습니다.
3. 화살표 함수

• 화살표 함수란 function이라는 키워드 없이 fat arrow =>를 이용해 함수를 생성하는 방법

const hello = (name) => {
    console.log(`Hello, ${name}!`);
}