S1. 변수, 함수, 조건문

노션으로 보기

Javascript

• Javascript는 ‘동적언어’
• 변수를 선언할 때 데이터타입을 따로 선언하지 않아도, 변수에 할당된 값에 따라 동적으로 타입을 지정

→ 변수에 어떤 데이터타입을 할당해도 에러가 발생하지 않음.

chapter1. 변수

변수 : 각 보관함에 붙인 이름을 의미, 재사용성

데이터 보관함(메모리)의 크기는 모두 동일

변수의 선언과 할당

• 변수를 선언 = 데이터 보관함에 데이터를 넣을 공간을 확보하는 것을 의미(선언 !== 할당 같지 않음)
• 변수의 선언과 할당은 → 반복적으로 사용해야 하는 값을 데이터 보관함에 저장하기 위함

💡 선언 : **let** myname;

• 선언은 한번만 함.

💡 할당 : myname **=** ‘steve’;

• 할당은 myname에 ‘steve’라는 값을 대입하는 것
• 즉 여기서 = 는 할당 연산자

💡 변수명엔 공백을 쓸 수 없다.

• 따라서 보통 단어의 첫글자를 대문자로 쓴다.

let sum = 1 ;
sum = sum +2 ; //여기서 = 는 같다는 의미가 아닌, 대입의 의미!

chapter2. 타입

단일형(원시자료형)

**number** : 숫자

**string** : 문자열 ( ‘ ‘, “ “ 사용)

• 문자열에선 ‘ “, “ ‘ 혼용 불가

• But, “내가 말한 ‘이민형’ 그 아이 있잖아 “ ⇒ 같이 감싸서 사용은 가능(그 반대도 가능하다)

**boolean** : True / False 반환

console.log(!0 === true) //true -> true = 0으로 형변환
console.log(!0) //true

**undefined** : 아무것도 할당하지 않았을 때

• 아무것도 할당하지 않은 ㅂ젼수는 undefined가 할당된다(초기화)

**null :** 변수값이 없다는 것을 의도적으로 명시할 때 사용

let ar = ‘Hoho’

ar = null //이전에 할당된 값을 비우고 싶을 때

function : 함수

자료자료형

• 위 타입이 서로 섞인 타입(compound)

**array** : 배열

let fruits = ['banana', 'apple', 'pinaapple'] ;

object : 객체

let person {name : 'steve', age : 32, isStudent : true} ;

특정한 값의 타입 확인하기

• 특정 값의 타입을 잘 모를 때

typeof 연산자 사용법

💡 typeof 값 ;

console.log(typeof 1) // number
console.log(typeof '1') //string
console.log(typeof (1<2)) //boolean

chapter3. 함수

• 함수 : 작은 기능의 단위
• 함수는 항상 출력값을 반환함(return) ⇒ 함수의 결과 도출을 위해선 ruturn문이 반드시 필요
• 함수 그 자체(func)와 함수의 호출(func())은 다름!

How to use 함수

1. 선언(declaration)

function cal(param1, param2) {
 console.log(param1 + parma2)'
  return param1 * 10 ;
 }

1. 호출(call)

cal(10, 20)

→ 결과 100

함수를 이용하여 구구단 출력하기

function multablePrinter(num) {  //muntanleprint함수는 num이라는 수를 매개변수로 받음
console.log(num * 1);
console.log(num * 2);
console.log(num * 3);
console.log(num * 4);
console.log(num * 5);
console.log(num * 6);
console.log(num * 7);
console.log(num * 8);
console.log(num * 9);
}

multablePrint(2) //()내부에 숫자값을 인자로 전달 -> 구구단 2단
multablePrint(3) //3단
//..
multablePrint(9)

함수 선언 방법

1. 함수선언식

function getTriangleArea(base, height) {     //여기서 function도 키워드!
 let tTriangleArea = (base * height) /2 ;
 return TriangleArea
}

1. 함수표현식

const getTriangleArea = function(base, height) {
 let tTriangleArea = (base * height) /2 ;
 return TriangleArea
}

• const(=let) getTriangleArea → 변수를 선언
• 이 변수에 ‘function(base, height)’ 라는 익명함수를 할당

1. 화살표 함수

• const getTriangleArea → 변수를 선언

const getTriangleArea = (base, height) => {
 let tTriangleArea = (base * height) /2 ;
 return TriangleArea;
}

• 화살표 함수의 특징

IF 함수의 본문(body)에 rerturn문만 있는 경우 → return과 중괄호{} 생략가능

//1)
const getTriangleArea = (base, height) => base * height /2 
getTriangleArea(3,4) //6, 정상작동

//2)
const getTriangleArea = (base, height) => {base * height /2}
getTriangleArea(3,4) //undefined 리턴

return문에서 *소괄호 *사용은 가능

const getTriangleArea = (base, height) => (base * height /2) 
getTriangleArea(3,4) //6, 정상작동

⇒ But, 함수 내 표현식이 2줄 이상인 경우 → return과 중괄호{}를 명시적으로 사용한는게 좋음

매개변수(parameter)와 전달인자(argument)

선언

function getTriangleArea(base, height) {

→ (base, height) : 매개변수

호출

getTriangleArea(3,4) //결과 6

→ (3,4) : 전달인자(매개변수에 할당되는 값)

---

복습

Pair Progamming : 연습문제

1. 함수 returnWordWithJoy의 첫번째 전달인자로, 문자열 “I love coding”를 넣어 호출하고, 그 결과 값을 변수 word에 할당하세요.

let word = returnWordWithJoy(

💡 **추가 공부** 💡 function도 객체(object)? 💡 Null과 undefined의 차이 💡 키워드 [var, let, const]의 차이 / var의 문제점은 무엇? let은 어떻게 보완했을까

• var은 옛날 방법

• let은 var가 가진 문제점을 보완한 신문법

  ⇒ var은 더 이상 사용하지 않음. 따라서 let을 쓰면 됨

• const(상수, constance)로 선언한 변수는 재할당이 불가능하다

  ⇒ 변하지 않은 상수를 사용할 때 const를 사용

const num3 = 3;
num 2 = 22;
num 3 = 33; //오류 => const는 변수 재할당 불가

💡 ==, === 차이 (===를 더 많이 사용, ==는 사용할 일 없음으로 그냥 이렇구나 하고 이해만!) 💡 **함수선언과 함수표현의 차이**

• let, const 변수 선언
• function 함수 선언문
• let, const 함수 표현식(함수 만들때, 변수 선언을 쓸 시)

💡 **매개변수, 전달인자**

• 매개변수(parameter)

  function foo(z,d) //z, d 는 함수 foo의 매개변수

• 전달인자(argument)

console.log(foo(100,200)) / /100, 200과 같이 함수를 호출할 때 ()안에 넣은 넣는 것이 전달인자

매개변수가 전달인자보다 많은 경우

(a,b,c)

(1,2) // 1, 2, undefined 로 호출

매개변수보다 전달인자가 많은 경우

(a,b)

(1,2,3) //1,2 만 호출