다른 자바 스크립트 함수로 인수 전달


386

나는 성공하지 않고 다음을 시도했다.

function a(args){
    b(arguments);
}

function b(args){
    // arguments are lost?
}

a(1,2,3);

함수 a에서 arguments 키워드를 사용하여 인수 배열에 액세스 할 수 있습니다. 함수 b에서는 손실됩니다. 내가 시도하는 것처럼 다른 자바 스크립트 함수에 인수를 전달하는 방법이 있습니까?


3
@ BobStein-VisiBone 합의. 또한 실제로 배열 arguments은 아니지만 배열과 같은 의미를 구현 하는 객체 이므로 실제로는 실제 배열과 동일한 방식으로 사용할 수 있는지 전혀 알 수 없습니다.
Jules

@Jules는 여전히 몇 년이 지난 후에도 재개 투표를 했습니다. 다른 사람의 귀중한 작업을 태워 버리는 배지는 무엇입니까? 돌아 다니는 많은 사람들.
Bob Stein

답변:


542

다음 과 같이 function에서 .apply()동일한 액세스 권한을 갖는 데 사용하십시오 .argumentsb

function a(){
    b.apply(null, arguments);
}
function b(){
   alert(arguments); //arguments[0] = 1, etc
}
a(1,2,3);​

여기서 테스트 할 수 있습니다 .


21
@Brett-배열로 복사 한 다음 전달하기 전에 조작 할 수 있습니다.var copy = [].slice.call(arguments); <remove what you want> myFunc.apply(this, copy);
Nick Craver

18
그러나 apply이것을 이와 같이 사용 b하면 (예를 들어 객체의 일부 내부 기능인 경우) 범위가
줄어들 수 있습니다.

3
@vsync 좋은 지적이지만 문제를 쉽게 해결할 수 있습니다. 적용 할 첫 번째 인수로 객체를 전달하십시오.
Tad Lispy

11
"args"와 "arguments"를 함께 사용하는 것은 의미가 없습니다 ...
친구

3
그러나 "this"는 원래 b가 아닌 다른 것으로 변경 될 수 있습니다.
trusktr

223

스프레드 연산자

spread 연산자를 사용하면 여러 인수 (함수 호출) 또는 여러 요소 (배열 리터럴)가 필요한 위치에서 표현식을 확장 할 수 있습니다.

ECMAScript ES6는보다 실용적인 방식으로이를 수행 할 수있는 새로운 연산자를 추가했습니다. ... Spread Operator .

apply방법 을 사용하지 않는 예 :

function a(...args){
  b(...args);
  b(6, ...args, 8) // You can even add more elements
}
function b(){
  console.log(arguments)
}

a(1, 2, 3)

Note 브라우저가 여전히 ES5를 사용하는 경우이 스 니펫은 구문 오류를 리턴합니다.

편집자 주 : 스 니펫 사용하기 때문에 console.log(), 당신이 있어야 브라우저의 JS 콘솔을 열은 결과를 볼 수 -가 없을 것입니다 아무 의 페이지 결과.

이 결과가 표시됩니다.

스프레드 연산자 인수 예제 이미지

간단히 말해, 배열을 사용하는 경우 스프레드 연산자를 다양한 목적으로 사용할 수 있으므로 함수 인수에도 사용할 수 있습니다. 공식 문서에서 설명한 유사한 예제를 볼 수 있습니다. Rest 매개 변수


6
이것은 매우 훌륭한 연산자이며 실제로 사용하기를 기대합니다. 그러나 아직 발생하지 않습니다. 스프레드 연산자를 이미 지원하는 유일한 브라우저는 현재 FF입니다. 완전한 최신 데이터는 호환성 표를 참조하십시오. kangax.github.io/compat-table/es6/#spread_%28...%29_operator
TMG

10
왜 사용해서는 안됩니까? babel로 변환하기가 비교적 쉽고 새로운 기능을 모두 사용할 수 있으며 이전 브라우저와 훨씬 더 호환됩니다.
adgelbfish 2017

이것은 화살표 연산자로 정의 된 기능에서 작동하기 때문에 첫 번째 솔루션보다 낫습니다.
sarfata

당신은 필요가없는 ...args에서 a기능. 당신은 인수가없는 함수를 만들어에게 전달할 수 b...arguments
cronoklee

1
이 대답을 읽는 사람에게 : @의 cronoklee의 의견과는 달리, 명시 적으로 지정 ...args으로 a중첩 된 기능이있는 경우 입력의 중요 할 수있다.
Arshia001

81

다른 답변이 제공되지 않는다는 설명은 원래 인수 여전히 사용할 수 있지만 arguments객체 의 원래 위치에는 있지 않다는 것입니다 .

arguments목적 함수에 제공된 각각의 실제 파라미터에 대해 하나 개의 요소를 포함한다. 당신이 호출 할 때 a번호 : 세 개의 인수를 공급 1, 2등을, 3. 을 arguments포함 [1, 2, 3]합니다.

function a(args){
    console.log(arguments) // [1, 2, 3]
    b(arguments);
}

b그러나을 호출하면 정확히 하나의 인수 ( a's argumentsobject) 를 전달 합니다. 그래서 arguments포함 [[1, 2, 3]]입니다 (즉, 하나의 요소 aarguments원래 인수로를 포함하는 속성이 객체를, a).

function b(args){
    // arguments are lost?
    console.log(arguments) // [[1, 2, 3]]
}

a(1,2,3);

@Nick이 시연 한 것처럼 호출에서 apply설정된 arguments객체 를 제공하는 데 사용할 수 있습니다 .

다음과 같은 결과를 얻습니다.

function a(args){
    b(arguments[0], arguments[1], arguments[2]); // three arguments
}

그러나 apply일반적인 경우에는 올바른 해결책입니다.


당신은 항상 통과 this해야 apply합니까?
Flimm

1
@ Flimm— 그렇습니다. 인수는 두 번째 인수이므로 첫 번째 인수에는 무언가가 있어야합니다 ( null 일 수 있음 ).
RobG

0

이 시도

function global_func(...args){
  for(let i of args){
    console.log(i)
  }
}


global_func('task_name', 'action', [{x: 'x'},{x: 'x'}], {x: 'x'}, ['x1','x2'], 1, null, undefined, false, true)




//task_name
//action
//(2) [{...},
//    {...}]
//    {
//        x:"x"
//    }
//(2) [
//        "x1",
//        "x2"
//    ]
//1
//null
//undefined
//false
//true
//func
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.