2014-04-27 3 views
4

확인이 fiddle 또는 아래의 코드 오버로드의 개념 :자바 스크립트에

function abc(s) { 
    console.log('in abc(s)'); 
} 

function abc(s, t) { 
    console.log('in abc(s,t)'); 
} 

abc('1'); 

이 질문의 출력은 in abc(s,t)

사람이 여기 왜 세드릭 설명해 주시겠습니까 항상입니까?

+5

두 번째 함수 선언이 첫 번째 함수 선언을 완전히 덮어 씁니다. 그 이유는 JS에서 오버로딩과 같은 개념이 없다는 것입니다. – m90

+0

정의 된 최신 함수는 심볼 테이블 – thefourtheye

+0

에서 이전 함수를 덮어 씁니다. 따라서 마지막 함수를 항상 호출합니까 ?? – SharpCoder

답변

4

먼저 JavaScript에서 메소드 오버로드가 지원되지 않습니다 (@ 6502 workaround 참조). 이전 덮어 되었기 때문에

둘째, 당신은 자바 스크립트, 경험하는지 설명하기 위해,합니다 (같은 이름) 마지막으로 선언 된 함수가 호출 될 때, 그것은 JavaScript Hoisting에 관한 것이다.

다시 출력 결과를 함수 선언의 순서를 볼보십시오 : 자바 스크립트에서

function abc(s, t) { 
    console.log('in abc(s,t)'); 
} 

function abc(s) { 
    console.log('in abc(s)'); 
} 

abc('1'); 
6

는 과부하 개념이 없습니다.

그러나 arguments 값을 사용하여 전달 된 인수의 수를 확인하는 함수를 작성할 수 있습니다.

function foo(s, t) { 
    if (arguments.length == 2) { 
     ... 
    } else { 
     ... 
    } 
} 

기능이 서명에 기대하지만이 undefined로 수신 호출에 의해 전달되지 않도록 모든 인수. arguments[i]과 함께 전달 된 n 번째 인수에 액세스하여 variadic 함수를 작성할 수도 있습니다. 그러나 arguments은 자바 스크립트 배열이 아니므로 모든 배열 메소드를 사용할 수있는 것은 아닙니다.

오류없이 동일한 기능을 여러 번 재정의 할 수 있다는 것은 규칙이 이상하므로 설명하기가 약간 복잡합니다.

간단한 설명은 생각할 수 있습니다. function은 Python에서와 같이 실행 가능한 명령문이므로 마지막 함수 정의가 우선합니다. 다른 파이썬에서, 다음과 같은 법적 자바 스크립트 코드입니다 그러나, 이것은 잘못된 것입니다 : 물론에 두 줄을 입력 : 스크립트에서 (정의를 선행하는 선에서 함수를 호출 할 수 있습니다 즉

console.log(square(12)); 
function square(x) { return x*x; } 

Javascript 콘솔이 작동하지 않음).

좀 더 정확한 설명은 컴파일러가 먼저 모든 함수 정의 (마지막 승리)를 구문 분석 한 다음 코드 실행을 시작한다는 것입니다. 어떤 경우에 실제로 발생하는 구현에 의존이기 때문에 당신이 if 내부 function들 넣지 마십시오 (내가 미친 IE에 대해 이야기 아니지만, 심지어는 FF와 크롬은 다른 일을 할 것) 경우 정신 모델은 작동합니다. 그냥하지 마.

당신은 형태

var square = function(x) { return x*x; } 

를 사용할 수 있으며이 경우에는 흐름이 통과 할 때 실행되는 변수에 "함수 표현식"의 간단한 과제이다 (그래서 다른 장소 괜찮은지 다른 if 브랜치 내부의 함수를 구현하지만 구현을 지정하기 전에 함수를 호출 할 수는 없습니다.자바 스크립트

+0

참고 사항 : 'arguments.forEach (func)'를 할 수는 없지만 여전히 [[] .forEach.call (arguments, func)'할 수 있습니다. –

1

는 특정 이름으로 하나의 함수가 동일한 이름을 가진 복수의 함수가 선언되는 경우, 마지막으로 선언 한 활성 상태 일 것.

당신은 그러나 함수에 전달되는 인수를 테스트하고 오버로드를 처리하도록 설계 기능 행동의 같은 종류의 많은 구현할 수 있습니다. 사실, 어떤 경우에는 더 많은 것을 할 수 있습니다. 특정 예에서

:

function abc(s, t) { 
    // test to see if the t argument was passed 
    if (t !== undefined) { 
     console.log('was called as abc(s,t)'); 
    } else { 
     console.log('was called as abc(s)'); 
    } 
} 

abc('1');  // outputs 'was called as abc(s)' 
abc('1', '2'); // outputs 'was called as abc(s,t)' 

, 당신은 훨씬 더 창의적 (유용한), 많이 얻을 수 있습니다.

예를 들어 jQuery .css() 메서드는 5 가지 방법으로 호출 할 수 있습니다.

.css(propertyName) 
.css(propertyNames) 
.css(propertyName, value) 
.css(propertyName, function(index, value)) 
.css(properties) 

.css()있어서 내부 코드는 따라서 정확하게 행할 어떤 동작 부르고되고있는 방법을 알아내는 타입과 인수의 수를 조사한다. 이 작업을 수행 할 수있는 방법에

살펴 보자는 사용되는이 기능의 5 개 형태를 알아낼 수 있습니다 :

css: function(prop, value) { 
    // first figure out if we only have one argument 
    if (value === undefined) { 
     if (typeof prop === "string") { 
      // we have a simple request for a single css property by string name 
      // of this form: .css(propertyName) 
     } else if (Array.isArray(prop)) { 
      // we have a request for an array of properties 
      // of this form: .css(propertyNames) 

     } else if (typeof prop === "object") { 
      // property-value pairs of css to set 
      // of this form: .css(properties) 
     } 
    } else { 
     if (typeof value === "function") { 
      // of this form: .css(propertyName, function(index, value)) 
     } else { 
      // of this form: .css(propertyName, value) 
     } 
    } 
} 

또한 선택적 인수를 구현할 수 있습니다. 예를 들어, jQuery의 .hide()은 많은 양식을 허용 할 수 있습니다. 양식 중 하나는 .hide([duration ] [, complete ])이고 기간 및 완료 기능은 모두 선택 사항입니다. 아무 것도 전달하지 않고 지속 시간 또는 완료 및 완료 콜백 함수를 전달할 수 있습니다. 즉 다음과 같이 구현 될 수있다 :

hide: function(duration, fn) { 
    // default the duration to zero if not present 
    duration = duration || 0; 
    // default the completion function to a dummy function if not present 
    fn = fn || function() {}; 

    // now the code can proceed knowing that there are valid arguments for both 
    // duration and fn whether they were originally passed or not 
} 
나는이 변수 인수를 사용하는 가장 유용한 방법 중 하나를 찾을 수

코드가 다른 인수 형식의 다양한 지원 할 수 있도록되어 있는지에 상관없이 어떤 상태 당신의 주장 때문에 당신이 그들을 보편적 인 유형으로 변환하지 않고도 가질 수 있도록 전달할 수 있습니다. 예를 들어, 자바 스크립트 this implementation of a set object에서 .add() 방법은 인수의 서로 다른 형태의 모두를 수행 할 수 있습니다

s.add(key) 
s.add(key1, key2, key3) 
s.add([key1, key2, key3]) 
s.add(key1, [key8, key9], key2, [key4, key5]) 
s.add(otherSet)    // any other set object 
s.add(arrayLikeObject)  // such as an HTMLCollection or nodeList 

을이 두 가변 인자를 허용하고 각 인수에 대해 서로 다른 유형의 번호를 받아서 것 전달 된 것을 토대로 적응하십시오. 따라서 키 배열, 키 배열, 다른 배열 집합, 의사 배열 또는 그 유형의 혼합을 통해 집합을 초기화 할 수 있습니다. 내부적으로 코드는 함수에 전달 된 각 인수를 반복하고 인수의 유형을 확인한 다음 그에 따라 작동합니다.

이 수행하는 방법에 대한 자세한 정보를 원하시면 코드 here on GitHub을 볼 수 있습니다.