자바스크립트 함수에 다양한 수의 인수를 보내는 것이 가능합니까?

자바스크립트 함수에 다양한 수의 인수를 보내는 것이 가능합니까?

배열에서 다양한 수의 인수를 자바스크립트 함수로 보내는 것이 가능합니까?

var arr = ['a','b','c']

var func = function()
{
    // debug 
    alert(arguments.length);
    //
    for(arg in arguments)
        alert(arg);
}

func('a','b','c','d'); // prints 4 which is what I want, then 'a','b','c','d'
func(arr); // prints 1, then 'Array'

저는 최근에 파이썬을 많이 썼는데, 바그를 받아 보낼 수 있는 것은 멋진 패턴입니다.

def func(*args):
   print len(args)
   for i in args:
       print i

func('a','b','c','d'); // prints 4 which is what I want, then 'a','b','c','d'
func(*arr) // prints 4 which is what I want, then 'a','b','c','d'

자바스크립트에서 인수 배열로 처리할 배열을 보낼 수 있습니까?

업데이트: ES6부터 함수 호출 시 스프레드 구문을 사용할 수 있습니다.

func(...arr);

ES6에서도 인수를 배열로 처리할 경우 매개 변수 목록에서 다음과 같은 분산 구문을 사용할 수 있습니다.

function func(...args) {
  args.forEach(arg => console.log(arg))
}

const values = ['a', 'b', 'c']
func(...values)
func(1, 2, 3)

또한 처음 두 인수를 개별적으로 수신하고 나머지 인수를 배열로 수신하려는 경우와 같이 일반 매개 변수와 결합할 수 있습니다.

function func(first, second, ...theRest) {
  //...
}

함수가 얼마나 많은 인수를 예상하는지 알 수 있도록 유용할 수 있습니다.

var test = function (one, two, three) {}; 
test.length == 3;

하지만 어쨌든 당신은 임의의 수의 논쟁을 통과할 수 있습니다.

은 스레드스구다합 "트위프다"보다 입니다.apply▁the▁▁to우▁and정경.this함수 호출의 값입니다. 이것이 방법입니다.

다음은 이전의 방법인 적용 예입니다.

var arr = ['a','b','c'];

function func() {
  console.log(this); // 'test'
  console.log(arguments.length); // 3

  for(var i = 0; i < arguments.length; i++) {
    console.log(arguments[i]);
  }

};

func.apply('test', arr);

요즘에는 사용만 권장합니다.apply배열에서 임의의 수의 인수를 전달하고 다음을 설정해야 하는 경우에만this 가치.apply는 takes입니다.this첫로 value를 지정합니다. 만약 가 "value", "value"를 한다면, 될 것입니다.null,this는 키워내창전개를역체참(조)니다합 안에 있는 를 가리킵니다.func으로 'use strict사용하거나 에서는 strict 'use strict'를 사용할 때,null사용됩니다.

또한 개체는 실제로 배열이 아니므로 다음을 통해 변환할 수 있습니다.

var argsArray = Array.prototype.slice.call(arguments);

ES6의 경우:

const argsArray = [...arguments] // or Array.from(arguments)

하지만 당신은 거의 사용하지 않습니다.arguments요즘은 확산 구문 덕분에 직접 객체를 사용할 수 있습니다.

실제로 자바스크립트 함수에 원하는 만큼의 값을 전달할 수 있습니다.명시적으로 명명된 매개 변수는 처음 몇 개의 값을 얻지만 모든 매개 변수는 인수 배열에 저장됩니다.

인수 배열을 "unpacked" 형식으로 전달하려면 apply를 사용하면 됩니다(c.f).기능적 Javascript):

var otherFunc = function() {
   alert(arguments.length); // Outputs: 10
}

var myFunc = function() {
  alert(arguments.length); // Outputs: 10
  otherFunc.apply(this, arguments);
}
myFunc(1,2,3,4,5,6,7,8,9,10);

스플랫 및 스프레드 연산자는 자바스크립트의 다음 버전인 ES6의 일부입니다.지금까지는 파이어폭스만 지원합니다.이 코드는 FF16+에서 작동합니다.

var arr = ['quick', 'brown', 'lazy'];

var sprintf = function(str, ...args)
{
    for (arg of args) {
        str = str.replace(/%s/, arg);
    }
    return str;
}

sprintf.apply(null, ['The %s %s fox jumps over the %s dog.', ...arr]);
sprintf('The %s %s fox jumps over the %s dog.', 'slow', 'red', 'sleeping');

스프레드에 대한 어색한 구문을 기록합니다. sprintf('The %s %s fox jumps over the %s dog.', ...arr);아직 지원되지 않습니다.여기에서 ES6 호환성 표를 찾을 수 있습니다.

또한 ES6 추가 기능인 를 사용합니다.사용.for...in어레이의 경우에는 좋지 않습니다.

ES2015 기준으로 두 가지 방법이 있습니다.

그arguments

이 개체는 함수에 내장되어 있으며 함수의 인수를 적절하게 참조합니다.그러나 기술적으로는 어레이가 아니므로 일반적인 어레이 작업은 해당 어레이에서 작동하지 않습니다.은 제된방다같음습다니과은법안을 사용하는 것입니다.Array.from또는 스프레드 연산자를 사용하여 배열을 만듭니다.

다른 답변에서 다음과 같이 언급하는 것을 보았습니다.slice.그러지마세요.최적화를 방지합니다(소스: MDN).

Array.from(arguments)
[...arguments]

하지만, 저는 주장하고 싶습니다.arguments함수가 입력으로 받아들이는 것을 숨기기 때문에 문제가 있습니다.arguments함수는 일반적으로 다음과 같이 작성됩니다.

function mean(){
    let args = [...arguments];
    return args.reduce((a,b)=>a+b) / args.length;
}

때때로 함수 헤더는 C와 같은 방식으로 인수를 문서화하기 위해 다음과 같이 작성됩니다.

function mean(/* ... */){ ... }

하지만 그것은 드문 일입니다.

문제가 되는 이유에 대해서는 C를 예로 들 수 있습니다.C는 K&R C로 알려진 언어의 고대 ANSI 이전 방언과 역호환됩니다. K&R C는 함수 프로토타입이 빈 인수 목록을 가질 수 있도록 합니다.

int myFunction();
/* This function accepts unspecified parameters */

는 ANSIC의 합니다.varargs(... ), 및void빈 인수 목록을 지정합니다.

int myFunction(void);
/* This function accepts no parameters */

로 많은사실선기언다니합능을수로로 합니다.unspecified 목록 (인수 목록int myfunction();), 함수가 0개의 인수를 가질 것으로 예상할 때.함수가 인수를 허용하기 때문에 엄밀히 말하면 버그입니다.그들 중 아무 수나.

된 적한절.varargsC의 함수는 다음과 같은 형식을 취합니다.

int myFunction(int nargs, ...);

그리고 자바스크립트는 실제로 이것과 비슷한 것을 가지고 있습니다.

산포 연산자 / 휴식 매개변수

사실 이미 스프레드 연산자를 보여드렸습니다.

...name

이는 매우 다양하며 함수의 인수 목록("휴게 매개변수")에서 사용하여 다음과 같이 문서화된 방식으로 변수를 지정할 수 있습니다.

function mean(...args){
    return args.reduce((a,b)=>a+b) / args.length;
}

또는 람다 식으로:

((...args)=>args.reduce((a,b)=>a+b) / args.length)(1,2,3,4,5); // 3

저는 스프레드 연산자를 훨씬 더 선호합니다.깨끗하고 자체 문서화되어 있습니다.

그apply두 의 인수를 합니다; 함 두 인 를 사 니 합 다 객 체this에는 바인딩되고 인수는 배열로 표시됩니다.

some_func = function (a, b) { return b }
some_func.apply(obj, ["arguments", "are", "here"])
// "are"

그것은 그것이라고 불립니다.splat교환입니다.다음을 사용하여 JavaScript에서 수행할 수 있습니다.apply:

var arr = ['a','b','c','d'];
var func = function() {
    // debug 
    console.log(arguments.length);
    console.log(arguments);
}
func('a','b','c','d'); // prints 4 which is what I want, then 'a','b','c','d'
func(arr); // prints 1, then 'Array'
func.apply(null, arr); 

ES6를 사용하면 다음에 대한 정지 매개 변수를 사용할 수 있습니다.varagrs인수 목록을 사용하여 배열로 변환합니다.

function logArgs(...args) {
    console.log(args.length)
    for(let arg of args) {
        console.log(arg)
    }
}

이것은 변수 인수에 대한 정수와 정수에 대한 배열의 합계를 계산하기 위한 샘플 프로그램입니다.이게 도움이 되길 바랍니다.

var CalculateSum = function(){
    calculateSumService.apply( null, arguments );
}

var calculateSumService = function(){
    var sum = 0;

    if( arguments.length === 1){
        var args = arguments[0];

        for(var i = 0;i<args.length; i++){
           sum += args[i]; 
        }
    }else{
        for(var i = 0;i<arguments.length; i++){
           sum += arguments[i]; 
        }        
    }

     alert(sum);

}


//Sample method call

// CalculateSum(10,20,30);         

// CalculateSum([10,20,30,40,50]);

// CalculateSum(10,20);

(function(window) {
  var proxied = window.alert;
  window.alert = function() {
    return proxied.apply(window, arguments);
  };
}(this));

alert(13, 37);

변수 개수의 인수를 한 함수에서 다른 함수로 전달(이 질문의 중복으로 표시해서는 안 됨)에서 여기로 리디렉션된 사용자:

자바스크립트 1.8.5 이후로, 한 함수에서 다른 함수로 다양한 수의 인수를 전달하려고 한다면 간단하게 호출할 수 있습니다.apply()과 함께 합니다.arguments매개변수:

var caller = function()
{
    callee.apply( null, arguments );
}

var callee = function()
{
    alert( arguments.length );
}

caller( "Hello", "World!", 88 ); // Shows "3".

참고: 첫 번째 인수는 다음과 같습니다.this사용할 매개 변수입니다. 싱패null는 글로벌 컨텍스트에서 함수를 호출합니다. 즉, 어떤 개체의 메서드 대신 글로벌 함수로 호출합니다.

이 문서에 따르면 ECMA스크립트 5 사양은 다음과 같이 정의되었습니다.apply()엄격하게 배열 대신 "일반 배열 유사 개체"를 가져오는 방법입니다.따라서, 당신은 직접 통과할 수 있습니다.arguments두 번째 함수에 나열합니다.

Chrome 28.0, Safari 6.0.5 및 IE 10에서 테스트되었습니다.이 JS Fiddle을 사용해 보세요.

예, 변수 개수의 인수를 함수에 전달할 수 있습니다.사용할 수 있습니다.apply.

예:

var arr = ["Hi","How","are","you"];

function applyTest(){
    var arg = arguments.length;
    console.log(arg);
}

applyTest.apply(null,arr);

함수가 배열 인수 또는 변수 인수에 반응하기를 원하십니까?후자의 경우 다음을 시도합니다.

var func = function(...rest) {
  alert(rest.length);

  // In JS, don't use for..in with arrays
  // use for..of that consumes array's pre-defined iterator
  // or a more functional approach
  rest.forEach((v) => console.log(v));
};

하지만 배열 인수를 처리하려면

var fn = function(arr) {
  alert(arr.length);

  for(var i of arr) {
    console.log(i);
  }
};

언급URL : https://stackoverflow.com/questions/1959040/is-it-possible-to-send-a-variable-number-of-arguments-to-a-javascript-function