Javascript 정리(3)

✅ Function(함수) - 데이터 받기

👉 데이터를 전달 받는 함수의 정의
(매개변수를 지정하여 원하는 인자값을 계속 넣을 수 있게 한다)

function alertSuccess(name) {
  alert(name + " 님 로그인 되었습니다.");
}
// name이라는 매개변수를 지정하였다.
alertSuccess("이워크");   // '이워크 님 로그인 되셨습니다.'
alertSuccess("김워크");   // '김워크 님 로그인 되셨습니다.'
alertSuccess("송워크");   // '송워크 님 로그인 되셨습니다.'
// 원하는 인자를 매개변수에 넣어 각각 다른 값을 호출할 수 있다.

❗ 함수 내부에서 인자로 받은 변수에 새로운 값을 넣으면 안 된다.

function alertSuccess(name) {   
  let name = "leedev";   // 함수 내부에서 매개변수에 값을 넣으면 안된다.
  return(name + "님 로그인 성공!"); 
}
// 위와 같이 함수 내부에서 인자로 받은 변수(name)에 새로운 값("leedev")을 넣으면 안 된다!
// 인자(parameter)에 실제로 어떤 데이터가 전달될지는, 호출할 때 결정하는 것이다. (아래처럼 함수를 호출할때)

alertSuccess("leedev"); 

function isbiggerThanHundred(myNumber) {
    if (myNumber >100){
      return("크다!");
    }
    if (myNumber <=100){
      return("작다!");
    }
}
console.log(isbiggerThanHundred(100));  // '작다!' 호출
// 매개변수(parameter) = myNumber
// 인자(argument) = 100

---

✅ Function(함수) - parameter, argument

👉 매개 변수
함수를 정의 하면서, 함수 선언식의 괄호()안에 어떤 변수명 을 쓰면, 그걸 매개변수 라고 부른다. 매개 변수는 실제로 함수 안쪽에서 변수와 같은 역할을 하게 된다. 함수가 호출될 때 값(인자)을 전달받게 되면 매개 변수에 값이 정의된다.
👉 인자
어떤 함수를 호출하면서, 호출문의 괄호()안에 어떤 값 또는 값이 정의된 변수를 쓰면, 그걸 인자 라고 부른다.
❗ 함수에서 매개변수를 적어둔 상태라면, 호출시 인자로 전달한 값은 매개변수를 통해 사용 가능

// doubleNumber 함수 선언식
function doubleNumber(myNumber) {   // 호출시 전달받은 값을 myNumber 라는 변수명으로 함수 안쪽에서 사용하겠다.
  let myResult = myNumber * 2
  return myResult
}

// doubleNumber 함수 호출문
doubleNumber(3); // doubleNumber를 호출하면서 값(인자) 3을 전달해주겠다.
// 변수를 통한 doubleNumber 함수 호출문
let someNumber = 42
doubleNumber(someNumber); // doubleNumber를 호출하면서 값 42를 전달

/* 
함수 `halfNumber` 를 선언하고 구현하세요. 숫자로 된 인자 하나를 받습니다.
받은 값을 2로 나눈 결과를 리턴합니다. 매개변수 이름은 마음대로 정해서 사용합니다.
*/

function halfNumber(number) {
    return number/2;
}


/* 
함수 `halfAndAddNumber`를 선언하고 구현하세요.숫자로 된 인자 하나를 받습니다.
1번 문제에서 만들었던 `halfNumber`를 호출하면서, 인자로 받았던 값을 다시 `halfNumber` 함수에 전달해줍니다.
`halfNumber`의 리턴결과를 함수 안쪽에서 변수명 `result`에 정의합니다.
'result'에 1을 더한 값을 리턴합니다.
*/

function halfAndAddNumber(number) {
    let result = halfNumber(number)+1;
    return result;
}

// 함수 호출
halfAndAddNumber(10);   // 6

---

✅ Function(함수) - 여러 인자

👉 복수의 매개변수에 복수의 인자를 전달할 수 있다.

// 2개의 매개변수
function eventResult(month, name) {
  console.log(month + "월의 당첨자는 " + name + "입니다.");
}

// 함수 호출(2개 인자 전달)
eventResult(3, "leedev");

// 3월의 당첨자는 leedev입니다.

/* 
`meetAt` 함수를 만들어주세요. 인자를 세개 받습니다.
1. 첫번째 인자는 년도에 해당하는 숫자입니다.
2. 두번째 인자는 월에 해당하는 숫자입니다.
3. 세번째 인자는 일에 해당하는 숫자입니다.
년도 인자만 받았을 경우 → `"1234년"` 과 같은 형식의 문자열을 리턴 해주세요.
년도,월 인자를 받았을 경우 → 년도와 월을 조합해서 `"1234년 5월"` 과 같은 형식의 문자열을 리턴 해주세요.
년도,월,일 인자를 전부 받았을 경우 → 년도,월,일을 조합해서 `"1234/5/6"` 과 같은 형식의 문자열을 리턴 해주세요.
*/

function meetAt(year, month, date) {
    if(year, month, date) {
      return year + "/" + month + "/" + date + "/";
    }
    if(year, month) {
      return year + "년" + month + "월";
    }
    if(date) {
      return year + "년";
    }
}
meetAt(2021, 1 , 1);   // 2021/1/1
meetAt(2021, 1);   // 2021년1월
meetAt(2021);   // 2021년
// 매개변수의 자리는 3개이다. 인자를 1개 넣어주면 첫번째 if문에는 해당이 안되서 pass
// 두번째 if문에도 해당이 안되서 pass
// 세번째 if문에 인자1개 값이 들어가서 return하고 종료.


// 만약 if문의 순서를 바꿔준다면?
function meetAt(year, month, date) {
    if(year) {
      return year + "년";
    }
    if(year, month) {
      return year + "년" + month + "월";
    }
    if(year, month, date) {
      return year + "/" + month + "/" + date + "/";
    }
}
meetAt(2021, 1 , 1);  // 2021년
// 최소 인자 1개를 첫번째 if문에서 충족하기 때문에 바로 return되고 종료된다.
// 따라서 인자 3개가 들어갈 수 있는 조건부터 써준다.
// (=인자가 1개면 충족되지 않기 때문에 다음 if문으로 넘어갈 수 있다)

---

✅ Function(함수) - 데이터 반환(return)

👉 return은 함수를 호출했을 때, 함수가 값을 반환한다는 뜻
👉 return을 생략하면 함수는 undefined를 반환

function eventDate(month, name) {   
  console.log(month, name);   // eventDate 함수 안에 return이 없다. 
}  

let result = eventDate("3", "이개발"); // 함수를 호출한 결과를 result에 담아서
console.log("eventDate 호출 값은" + result); // 'eventDate 호출 값은 undefined' 라고 호출된다.

👉 함수 내부에서 다른 함수 호출하기

function getTax(price) {
  return price * 0.1;
}

function calculateTotal(price) {
  return price + getTax(price);  // getTax(price) 함수 호출
}

let result = calculateTotal(3500);  // 함수가 실행되는 시점, 함수 호출함
console.log(result);

/* 
`getTotal` 함수를 만들어주세요! `getTotal` 함수는 가격을 2개 받아서 calculateTotal 호출 반환값을 더해서 리턴하는 함수입니다.
1. `getTotal` 이라는 이름의 함수를 만들어주세요. 가격정보 2개를 인자로 받습니다.
2. 인자이름은 원하는대로 지어주셔도 됩니다.
3. `getTotal` 함수에서 인자로 받은 가격으로 각각 `calculateTotal` 함수를 호출해주세요. 그리고 그 결과값을 더해서 반환해주세요.
참고)
`getTax` 함수는 가격의 tax를 구하는 함수입니다.
`calculateTotal` 함수는 상품의 가격에 tax를 더한 값을 구하는 함수입니다.
`getTotal` 함수는 두 상품의 가격을 더해서 반환하는 함수입니다.
*/

function getTax(price) {
   return price * 0.1;
}
function calculateTotal(price) {
   return price + getTax(price);
}
function getTotal(price1, price2) {
    return calculateTotal(price1) + calculateTotal(price2);
}

getTotal(500, 900);  // 1540
// getTax(price) 함수식을 만든 뒤, calculateTotal(price)함수에 호출한다.
// getTotal(price1, price2) 함수에는 매개변수를 2개를 넣는다. 각 매개변수는 calculateTotal(price)함수에 인자가 전달되어서 호출될 수 있다.