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

[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.

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

 


방문 감사합니다. (즐겨찾기 등록: Ctrl + D)

분류 제목
Basic JS - Common Mistakes -
Basic JS - Performance -
Basic JS - Reserved Words -
Basic JS - Versions -
Basic JS - JSON (제이슨) - 데이터 전송 위한 가벼운 자료 형식.
Form JS - Forms - 폼양식 유효성 제어
Form JS - Forms API - 폼유효성
Object JS - Object - 객체개념(=객체의미=객체정의) ★ 3
Object JS - Object Property - 객체속성 ★
Object JS - Object Methods - 객체메서드 ★
Object JS - Object Accessors - 객체접근자 (Getter/Setter = 게러/세러 = 게터/세터… 2
Functions JS - Function Definition - 함수선언방법 + 함수호출방법 ★★★ (= 함수구문 + 함수특…
Functions JS - Function Parameter/argument - 함수 (매개변수/독립변수) ※ 변수 종류 ※ …
Functions JS - Function Invocation - 함수호출방법1 = (함수방식 + 메서드방식 + 함수생성자방…
Functions JS - call() 메서드 - 함수호출방법2 (= call메서드 = 콜메서드)
DOM JS - DOM (= 돔 = 문서객체모델) 정의
DOM JS - Method - 메서드 (= HTML 요소에 대한 수행 작업)
DOM JS - Document - 문서객체
DOM JS - Element Selector - 주요 요소선택자 (= 객체찾기) ※ JS외부링크호출 주의사항
DOM JS - HTML - 내용입력/내용변경/속성값변경(=속성값입력)
3/67
목록
찾아주셔서 감사합니다. Since 2012