• 회원가입
  • 로그인
  • 구글아이디로 로그인

[Functions] JS - Function Parameter/argument - 함수 (매개변수/독립변수) ※ 변수 종류 ※ Arguments (아규먼츠) 객체

JS 함수는 함수 매개변수 값 (= 독립변수 = 인자)를 체크 안 함.

 

 

매개변수 (parameter)

 

함수 정의할 때 ( ) 안에 독립변수를 받기 위해 미리 나열해 둔 변수.

 


 

function homzzang(a, b, c) {

  // 실행코드

}

 

 

독립변수 (argument) = 전달인자 = 인자

 

함수를 호출할 때 함수 안에 실제로 전달되는 값을 의미.

 


 

echo homzzang(1,2,3);

 

 

매개변수 규칙

 

1.

JS 함수 선언 시, 매개변수의 데이터타입을 지정 안 함.

2.

JS 함수는 전달된 독립변수의 데이터타입을 체크 안 함.

3.
JS 함수는 전달된 독립변수 개수를 체크 안 함.

 

  

매개변수 기본값

 

1.

JS 함수 선언 시 선언된 매개변수 개수보다 적은 수의 독립변수가 전달된 경우,

독립변수가 누락된 매개변수는 undefined 상태가 됨.

 

2.

가끔 괜찮기도 하지만, 되도록이면 매개변수 기본값을 설정하는 게 바람직함.


ECMAScript 2015 이후

 

<p id="demo"></p>


<script>

function homzzang(x=3, y=0) {

  return x * y;

}

document.getElementById("demo").innerHTML = homzzang(3);

</script>

 

결과보기


EScript 2015 전

 

<p id="demo"></p>


<script>

function homzzang(x, y) {

  if (y === undefined) {

    y = 0;

  }  

  return x * y;

}

document.getElementById("demo").innerHTML = homzzang(3);

</script>

 

 

결과보기

 

Arguments 객체

 

1.

JS 함수엔 Arguments 라고 하는 내장 객체 존재.

 

2.

Arguments 객체는 함수 호출 시 전달 된 독립변수를 배열 형태로 갖음.

 

3.

Arguments 객체 활용해 함수 호출 시 전달된 독립변수의 크기 비교 가능.
(예) 값이 가장 큰 독립변수, 값이 가장 작은 독립변수, 독립변수의 평균 등.

 

4.
JS 함수 선언 시 선언된 매개변수 개수보다 훨씬 많은 수의 독립변수 받을 시,
arguments 라는 객체를 활용해 받을 수 있음.  (아래 예제들 참고)

 


독립변수의 최고값 구하기

 

<p id="demo"></p>


<script>

function homzzang() {

  var i;

  var max = -Infinity;

  for(i = 0; i < arguments.length; i++) {

    if (arguments[i] > max) {

      max = arguments[i];

    }

  }

  return max;

document.getElementById("demo").innerHTML = homzzang(3, 4, 5);

</script>

 

결과보기


독립변수 합계 구하기

 

<p id="demo"></p>


<script>

function homzzang() {

  var i;

  var sum = 0;

  for(i = 0; i < arguments.length; i++) {

    sum += arguments[i];

  }

  return sum;

}

document.getElementById("demo").innerHTML = homzzang(3,4,5);

</script>

 

결과보기

관련글 https://homzzang.com/b/tag-1143

 

 

※ 독립변수는 값에 의해 전달

 

1.

독립변수는 함수 호출 시 함수로 전달된 값을 말하며,

JS 함수는 독립변수의 위치가 아니라 값을 인식할 뿐임.


2.

함수가 독립변수 변경해도, 매개변수 원래값은 불변.

 

3.

독립변수 변경은 함수 외부에 표시 (반영)되지 않음.

 

 

※ 객체는 참조로 전달

 

1.

JS에서 객체 참조는 값(value)이라서, 

객체는 참조(reference)로 전달되는 것처럼 동작.

 

2.

함수가 객체 속성 변경하면 객체 원래 값이 변경됨.

 

3.

객체 속성에 대한 변경 사항은 함수 외부에 표시(반영)됨.

 



분류 제목
Basic JS - Date Method - JS날짜메서드
Basic JS - Array - JS배열 ★★★★★
Basic JS - Array Method - JS배열메서드
Basic JS - Sorting Array - JS배열정렬
Basic JS - Booleans() 메서드 - JS참거짓판단 (= JS참거짓메서드 = JS블린메서드 = JS불린즈메…
Basic JS - Comparison and Logical Operator - JS비교연산자 / JS논리연산자
Basic JS - if...else 조건문 구문 ★ (= 이프 엘스 조건문 = 이프문) ※ 시간 조건문
Basic JS - Switch 조건문 구문 (= 스위치문 = 스위치조건문)
Basic JS - for반복문 ★★★★★ - (JS포반복문 = for문 = JS포문) ※ 가변 배열키
Basic JS - While 반복문 구문 (= While문 = While반복문 = 와일문 = 와일반복문)
Basic JS - Break - 반복문중단 (= 브레이크) ★ / Continue - 반복문건너뛰기 (= 컨티뉴) ★…
Basic JS - Type Conversion - 데이터타입변환 (= 데이터유형변환 = 데이터타입변경 = 데이터유형변…
Basic JS - Bitwise Operations -
Basic JS - Regular Expressions -
Basic JS - Errors - Throw and Try to Catch (에러 처리 구문)
Basic JS - Debugging (디버깅/디버그) - (에러/오류) 찾기/제거 방법
Basic JS - Hoisting (호이스팅) - 변수선언끌어올리기 (= 변수선언위치변경)
Basic JS - Use Strict - 엄격모드 ★★★
Basic JS - Style Guide and Coding Conventions -
Basic JS - Best Practices (올바른코딩)
2/67
목록
찾아주셔서 감사합니다. Since 2012