JavaScript에서 "arguments"객체를 배열로 변환하려면 어떻게해야합니까?

argumentsJavaScript 의 객체는 이상한 사마귀입니다. 대부분의 상황에서 배열처럼 작동하지만 실제로 는 배열 객체 가 아닙니다 . 그 이후 완전히 다른 정말 뭔가 , 그것에서 유용한 기능이없는 Array.prototype등 forEach, sort, filter,와 map.

간단한 for 루프를 사용하여 arguments 객체에서 새 배열을 구성하는 것은 간단합니다. 예를 들어이 함수는 인수를 정렬합니다.

function sortArgs() {
    var args = [];
    for (var i = 0; i < arguments.length; i++)
        args[i] = arguments[i];
    return args.sort();
}

그러나 이것은 매우 유용한 JavaScript 배열 함수에 액세스하기 위해 수행해야하는 다소 불쌍한 일입니다. 표준 라이브러리를 사용하여 기본 제공 방법이 있습니까?

나머지 매개 변수를 사용하는 ES6

ES6를 사용할 수있는 경우 다음을 사용할 수 있습니다.

나머지 매개 변수

function sortArgs(...args) {
  return args.sort(function (a, b) { return a - b; });
}

document.body.innerHTML = sortArgs(12, 4, 6, 8).toString();

링크 에서 읽을 수 있듯이

rest 매개 변수 구문을 사용하면 무한한 수의 인수를 배열로 나타낼 수 있습니다.

...구문 이 궁금하면 Spread Operator 라고하며 여기에서 더 읽을 수 있습니다 .

Array.from ()을 사용하는 ES6

Array.from 사용 :

function sortArgs() {
  return Array.from(arguments).sort(function (a, b) { return a - b; });
}

document.body.innerHTML = sortArgs(12, 4, 6, 8).toString();

Array.from Array-like 또는 Iterable 객체를 Array 인스턴스로 변환하기 만하면됩니다.

ES5

실제로 arguments 객체에 Array의 slice함수를 사용 하면 표준 JavaScript 배열로 변환됩니다. Array의 프로토 타입을 통해 수동으로 참조하면됩니다.

function sortArgs() {
    var args = Array.prototype.slice.call(arguments);
    return args.sort();
}

왜 이것이 작동합니까? ECMAScript 5 문서 자체 에서 발췌 한 내용은 다음과 같습니다.

참고 :이 slice기능은 의도적으로 일반적입니다. 이 값이 Array 객체 일 필요는 없습니다 . 따라서 방법으로 사용하기 위해 다른 종류의 객체로 전송할 수 있습니다. slice함수가 호스트 객체에 성공적으로 적용될 수 있는지 여부 는 구현에 따라 다릅니다.

따라서 속성 slice이있는 모든 항목에서 편리하게 작동합니다.lengtharguments

경우 Array.prototype.slice너무 많은 당신을 위해 입의, 당신은 약간 배열 리터럴을 사용하여 축약 할 수 있습니다 :

var args = [].slice.call(arguments);

그러나 나는 이전 버전이 더 명시 적이라고 생각하는 경향이 있으므로 대신 선호합니다. 배열 리터럴 표기법을 남용하면 해키 느낌이 들고 이상하게 보입니다.

또한 참조 가치가 이 블루 버드 약속 라이브러리 위키 페이지를 하는 방법을 관리하는 방법을 보여줍니다 arguments함수 최적화 할 수있는 방법으로 배열로 객체를 V8 자바 스크립트 엔진 아래를 :

function doesntLeakArguments() {
    var args = new Array(arguments.length);
    for(var i = 0; i < args.length; ++i) {
        args[i] = arguments[i];
    }
    return args;
}

이 방법은에 유리하게 사용됩니다 var args = [].slice.call(arguments);. 저자는 또한 빌드 단계가 자세한 정보를 줄이는 방법을 보여줍니다.

function sortArgs(){ return [].slice.call(arguments).sort() }

// Returns the arguments object itself
function sortArgs(){ return [].sort.call(arguments) }

일부 배열 메소드는 의도적으로 대상 객체가 실제 배열 일 필요가 없도록 만들어졌습니다. 대상에는 length 및 index 라는 이름의 속성 만 있으면됩니다 (0 이상의 정수 여야 함).

[].sort.call({0:1, 1:0, length:2}) // => ({0:0, 1:1, length:2})

사용하다:

function sortArguments() {
  return arguments.length === 1 ? [arguments[0]] :
                 Array.apply(null, arguments).sort();
}

Array(arg1, arg2, ...) 보고 [arg1, arg2, ...]

Array(str1) 보고 [str1]

Array(num1)num1요소 가있는 배열을 반환

인수 수를 확인해야합니다!

Array.slice 버전 (느리게) :

function sortArguments() {
  return Array.prototype.slice.call(arguments).sort();
}

Array.push 버전 (슬라이스보다 느리고 빠름) :

function sortArguments() {
  var args = [];
  Array.prototype.push.apply(args, arguments);
  return args.sort();
}

버전 이동 (느리지 만 작은 크기가 더 빠름) :

function sortArguments() {
  var args = [];
  for (var i = 0; i < arguments.length; ++i)
    args[i] = arguments[i];
  return args.sort();
}

Array.concat 버전 (가장 느림) :

function sortArguments() {
  return Array.prototype.concat.apply([], arguments).sort();
}

jQuery를 사용하는 경우 다음과 같은 의견을 쉽게 기억할 수 있습니다.

function sortArgs(){
  return $.makeArray(arguments).sort();
}

ECMAScript 6에서는과 같은 못생긴 해킹을 사용할 필요가 없습니다 Array.prototype.slice(). 대신 스프레드 구문 ( ...)을 사용할 수 있습니다 .

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

이상하게 보일지 모르지만 상당히 간단합니다. 단지 arguments'요소를 추출 하여 배열에 다시 넣습니다. 여전히 이해하지 못하는 경우 다음 예를 참조하십시오.

console.log([1, ...[2, 3], 4]);
console.log([...[1, 2, 3]]);
console.log([...[...[...[1]]]]);

IE 11과 같은 일부 구형 브라우저에서는 작동하지 않으므로 이러한 브라우저를 지원하려면 Babel 을 사용해야합니다 .

다음은 인수를 배열로 변환하는 몇 가지 방법의 벤치 마크 입니다.

저에 관해서는, 소량의 논쟁에 대한 가장 좋은 해결책은 다음과 같습니다.

function sortArgs (){
  var q = [];
  for (var k = 0, l = arguments.length; k < l; k++){
    q[k] = arguments[k];
  }
  return q.sort();
}

다른 경우 :

function sortArgs (){ return Array.apply(null, arguments).sort(); }

ECMAScript 6 spread operator를 사용하여 후행 매개 변수를 배열에 바인딩하는 것이 좋습니다 . 이 솔루션을 사용하면 arguments객체 를 만질 필요가 없으며 코드가 단순화됩니다. 이 솔루션의 단점은 대부분의 브라우저에서 작동하지 않으므로 대신 Babel과 같은 JS 컴파일러를 사용해야합니다. 후드 아래에서 Babel arguments은 for 루프가있는 배열로 변환 됩니다.

function sortArgs(...args) {
  return args.sort();
}

ECMAScript 6을 사용할 수없는 경우 @Jonathan Fingland와 같은 다른 답변을 살펴 보는 것이 좋습니다.

function sortArgs() {
    var args = Array.prototype.slice.call(arguments);
    return args.sort();
}

로다시 :

var args = _.toArray(arguments);

행동 :

(function(){ console.log(_.toArray(arguments).splice(1)); })(1, 2, 3)

생산 :

[2,3]

를 사용 Array.from()하여 배열과 같은 객체 (예 arguments:)를 인수로 사용하여 배열로 변환합니다.

(function() {
  console.log(Array.from(arguments));
}(1, 2, 3));

IE 11과 같은 일부 구형 브라우저에서는 작동하지 않으므로 이러한 브라우저를 지원하려면 Babel 을 사용해야합니다 .

function sortArg(){
var args = Array.from(arguments); return args.sort();
}

 function sortArg(){
    var args = Array.from(arguments); 
    return args.sort();
    }
 
 console.log(sortArg('a', 'b', 1, 2, '34', 88, 20, '19', 39, 'd', 'z', 'ak', 'bu', 90));

또 다른 대답.

흑 마법 주문 사용 :

function sortArguments() {
  arguments.__proto__ = Array.prototype;
  return arguments.slice().sort();
}

Firefox, Chrome, Node.js, IE11은 정상입니다.

사용해보십시오 Object.setPrototypeOf()

설명 : 설정 prototype의 arguments에Array.prototype

function toArray() {
  return Object.setPrototypeOf(arguments, Array.prototype)
} 

console.log(toArray("abc", 123, {def:456}, [0,[7,[14]]]))

설명 :의 각 색인을 가져 와서 arguments항목을 배열의 해당 색인에있는 배열에 놓으 십시오 .

대신 사용할 수 있습니다 Array.prototype.map()

function toArray() {
  return [].map.call(arguments, (_,k,a) => a[k])
} 

console.log(toArray("abc", 123, {def:456}, [0,[7,[14]]]))

설명 :의 각 색인을 가져 와서 arguments항목을 배열의 해당 색인에있는 배열에 놓으 십시오 .

for..of 고리

function toArray() {
 let arr = []; for (let prop of arguments) arr.push(prop); return arr
} 

console.log(toArray("abc", 123, {def:456}, [0,[7,[14]]]))

또는 Object.create()

설명 : 오브젝트를 작성하고의 각 인덱스에서 오브젝트의 특성을 항목으로 설정하십시오 arguments. prototype생성 된 객체 세트Array.prototype

function toArray() {
  var obj = {};
  for (var prop in arguments) {
    obj[prop] = {
      value: arguments[prop],
      writable: true,
      enumerable: true,
      configurable: true
    }
  } 
  return Object.create(Array.prototype, obj);
}

console.log(toArray("abc", 123, {def: 456}, [0, [7, [14]]]))

깨끗하고 간결한 솔루션은 다음과 같습니다.

function argsToArray() {
  return Object.values(arguments);
}

// example usage
console.log(
  argsToArray(1, 2, 3, 4, 5)
  .map(arg => arg*11)
);

Object.values( )배열로 객체의 값을 반환하고, 이후 arguments객체, 그것은 본질적으로 변환됩니다 arguments배열의 도우미의 모든 기능과 같은과 따라서를 제공, 배열로 map, forEach,filter , 등

Benshmarck 3 방법 :

function test()
{
  console.log(arguments.length + ' Argument(s)');

  var i = 0;
  var loop = 1000000;
  var t = Date.now();
  while(i < loop)
  {
      Array.prototype.slice.call(arguments, 0); 
      i++;
  }
  console.log(Date.now() - t);


  i = 0,
  t = Date.now();
  while(i < loop)
  {
      Array.apply(null, arguments);
      i++;
  }
  console.log(Date.now() - t);

  i = 0,
  t = Date.now();
  while(i < loop)
  {
      arguments.length == 1 ? [arguments[0]] : Array.apply(null, arguments);
      i++;
  }
  console.log(Date.now() - t);
}

test();
test(42);
test(42, 44);
test(42, 44, 88, 64, 10, 64, 700, 15615156, 4654, 9);
test(42, 'truc', 44, '47', 454, 88, 64, '@ehuehe', 10, 64, 700, 15615156, 4654, 9,97,4,94,56,8,456,156,1,456,867,5,152489,74,5,48479,89,897,894,894,8989,489,489,4,489,488989,498498);

결과?

0 Argument(s)
256
329
332
1 Argument(s)
307
418
4
2 Argument(s)
375
364
367
10 Argument(s)
962
601
604
40 Argument(s)
3095
1264
1260

즐겨 !

나머지 매개 변수는 잘 작동하지만 arguments어떤 이유로 든 계속 사용하려면 다음 을 고려하십시오.

function sortArgs() {
  return [...arguments].sort()
}

[...arguments]에 대한 대안으로 간주 될 수 있으며 Array.from(arguments)완벽하게 작동합니다.

ES7 대안은 배열 이해입니다.

[for (i of arguments) i].sort()

정렬하기 전에 인수를 처리하거나 필터링하려는 경우 가장 쉽습니다.

[for (i of arguments) if (i % 2) Math.log(i)].sort()

 function x(){
   var rest = [...arguments]; console.log(rest);return     
   rest.constructor;
 };
 x(1,2,3)

나는 간단한 파괴 기술을 시도

Arguments 객체는 함수 본문 내에서만 사용할 수 있습니다. Arguments Object를 배열처럼 인덱싱 할 수 있지만 배열은 아닙니다. 길이 이외의 배열 속성이 없습니다.

// function arguments length 5
function properties(a,b,c,d,e){
var function_name= arguments.callee.name
var arguments_length= arguments.length;
var properties_length=  properties.length; 
var function_from= properties.caller.name;
console.log('I am the function name: '+ function_name);
console.log('I am the function length, I am function spacific: '+ properties_length); 
console.log('I am the arguments length, I am context/excution spacific: '+ arguments_length);
console.log('I am being called From: '+  function_from );
}

// arguments 3
function parent(){
properties(1,2,3);
}

//arguments length 3 because execution spacific
parent();

이 예제에서 볼 수 있듯이 배열처럼 색인을 생성 할 수 있지만 :

function add(){

var sum=0;

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

sum = sum + arguments[i];

}

return sum;

}

console.log(add(1,2,3));

그러나 Arguments 객체는 배열이 아니며 length 이외의 다른 속성이 없습니다.

arguments 객체를 Arguments 객체에 액세스 할 수있는 배열로 변환 할 수 있습니다.

함수 본문 내에서 arguments 객체에 액세스 할 수있는 방법은 여러 가지가 있으며 여기에는 다음이 포함됩니다.

1. Array.prototoype.slice.call 메서드를 호출 할 수 있습니다.

Array.prototype.slice.call (인수)

function giveMeArgs(arg1,arg2){

var args = Array.prototype.slice.call(arguments);
return args
}

console.log( giveMeArgs(1,2));

2. 배열 리터럴을 사용할 수 있습니다

[] .slice.call (인수).

function giveMeArgs(arg1,arg2){

var args = [].slice.call(arguments);

return args;

}

console.log( giveMeArgs(1,2) );

3. 당신은 휴식을 사용할 수 있습니다 ...

function giveMeArgs(...args){

return args;

}

console.log(giveMeArgs(1,2))

4. 당신은 확산을 사용할 수 있습니다 [...]

function giveMeArgs(){

var args = [...arguments];
return args;

}

console.log(giveMeArgs(1,2));

5. Array.from ()을 사용할 수 있습니다

function giveMeArgs(){

var args = Array.from(arguments);

return args;

}

console.log(giveMeArgs(1,2));

인수로 재사용 할 수있는 함수를 만들 수 있습니다. 가장 간단한 함수는 다음과 같습니다.

function sortArgs() {
  return [...arguments].sort();
}

sortArgs('ali', 'reza', 1, 2, 'a'); //[1, 2, "a", "ali", "reza"];

ES6 이상 에서 스프레드 구문을 사용할 수 있습니다 ...

그러나 ES5 이하 버전과 호환되는 것을 사용하려면을 사용할 수 Array.prototype.slice.call있으므로 코드는 다음과 같습니다.

function sortArgs() {
  return Array.prototype.slice.call(arguments).sort();
}

sortArgs('ali', 'reza', 1, 2, 'a'); //[1, 2, "a", "ali", "reza"];

예 Array.from를 들어 인수 를 사용 하거나 반복 하여 새 배열에 할당하는 예제와 같이 다른 방법도 있습니다 .

이것은 매우 오래된 질문이지만 이전 솔루션보다 입력하기가 쉽고 외부 라이브러리에 의존하지 않는 솔루션이 있다고 생각합니다.

function sortArguments() {
  return Array.apply(null, arguments).sort();
}