[JS] Function-여러 인자와 if문

Now, Sophia·2021년 9월 2일
1

TIL_JAVASCRIPT

목록 보기
14/15
post-thumbnail

Function에서 인자(argument)를 받아 매개변수(parameter)를 통해 데이터를 가공하고 전달 할 수 있다.

	function one(num) {
	  let result = num + 2
	  return result 
    }
	console.log(one(2)); // 4;
// '2' 라는 인자를 'num' 이라는 매개변수를 통해 가공되는 것이다.

여러 인자가 있는 경우

	function two(num1,num2,num3) {
	  let result = num1 + num2 + num3
	  return result 
    }
	console.log(one(2,4,6)); // 12;

여러 인자를 조건에 따라 가져오기


처음에 단순하게 if문에 인자를 추가하면 되겠지 하고 생각했다.


function meetAt(year, month, date) {
  if (year) {
    return `${year}`
  }
  else if (year, month) {
    return `${year}${month}`
  }
  else if (year, month, date) {
    return `${year}/${month}/${date}`
  }
}

그러나 결과값은 ${year}년 만 나오는 것이다...😱😭
혹시 백틱을 잘못썼나해서 수정도 해보고.. 오타가 있나 다시 다 확인해 봤는데도 else if 들이 적용이 안되길래 argument의 갯수나 순서로 값을 나타내는 방법이 뭐 있나 구글링을 해봤다.
역시나 방법이 있었다.!

"가변인자 함수"를 이용하면 되는데 기본적인 방법은 "arguments" 객체를 사용하는 것이다.

🧐? arguments 객체는 내가 만드는건가? 이게 뭐지?

MDN : arguments 객체는 함수에 전달된 인수에 해당하는 Array 형태의 객체입니다.

뭐라구요..?

MDN : arguments 객체는 모든 함수 내에서 이용 가능한 지역 변수입니다. arguments 객체를 사용하여 함수 내에서 모든 인수를 참조할 수 있으며, 호출할 때 제공한 인수 각각에 대한 항목을 갖고 있습니다. 항목의 인덱스는 0부터 시작합니다.

즉, argument의 갯수를 배열 형태의 객체에 담아둔 것이다.
이거는 함수 내에서 쓰이는 지역 변수이고, 지역 변수라면은 함수 밖에서 쓸 수 없다는 뜻이었다.

MDN : arguments 객체는 Array가 아닙니다. Array와 비슷하지만, length 빼고는 pop()과 같은 어떤 Array 속성도 없습니다. 그러나 실제 Array로 변환할 수 있습니다

arguments 는 배열처럼 다른 메소드를 쓸 수 없다는 것이다.

MDN : 당신이 형식상 받기로 선언된 것보다 많은 인수로 함수를 호출하는 경우, arguments 객체를 사용할 수 있습니다. 이 기법은 가변 인수가 전달될 수 있는 함수에 유용합니다.

즉, 내 문제에는 arguments 객체를 이용하라는 것이다.

많은 인수로 함수를 호출하는 경우 ===> arguments 객체

arguments.length 를 쓸 수 있다고 하기에 요소의 갯수에 따라 값을 나오도록 바꿨다.!
.
.
.
.
🧙‍♀️ 또로롱
이런 마법 같은 일이...!


function meetAt(year, month, date) {
  if (arguments.length === 1) {
    return `${year}`
  }
  else if (arguments.length === 2) {
    return `${year}${month}`
  }
  else if (arguments.length === 3) {
    return `${year}/${month}/${date}`
  }
}

원하는 값이 나왔다.
여러인자에 대한 함수를 풀다가 덕분에 arguments 객체를 알게 되었다.
이런 얼마나 또 능률치가 올라가는가... 하고 감탄하던 차에 글을 봤다.
나와 같은 문제로 고민하신 분들이었다.
... 더 효율적으로 가독성 좋게 쓰신 분이 있었다.

더 멋지게 쓰신 분! 감동을 주신 분!


function meetAt(year, month, date) {
  if (date) {
    return `${year}/${month}/${date}`
  }
  else if (month) {
    return `${year}${month}`
  }
  else if (year) {
    return `${year}`
  }
}

내가 구글링을 잘했던 건지 더욱 간결하게 쓴 코드를 보게 되었다.
저렇게 간단하게 된다고?!😮😲
감탄을 금치 않을 수가 없었다.

그리고 이 글 덕분에 왜 나의 코드에서 year 값만 나왔는지 이해했다.
함수는 이미 if 문에서 year 의 조건을 충족했기 때문에, 값을 return 하면서 종료가 된 것이다.

그래서 역순으로 조건을 거는 거였다.
대박.....🥺 너무 대단하신거 아닌가요?
조건문을 이해한다고 생각했는데... 이래서 기본! 기초! 를 잘 알아야 한다고 항상 느끼는 것 같다.😭😭

profile
Whatever you want

0개의 댓글