Что такое массив arguments?

Массив arguments в JavaScript

arguments — это специальный объект, похожий на массив, который автоматически создаётся внутри каждой функции и содержит все аргументы, передённые функции. Это устаревший способ работы с аргументами, но важно его понимать.

Как работает arguments

function sum(a, b, c) {
  console.log(arguments); // [10, 20, 30]
  console.log(arguments[0]); // 10
  console.log(arguments[1]); // 20
  console.log(arguments[2]); // 30
  console.log(arguments.length); // 3
}

sum(10, 20, 30);

Важные характеристики arguments

1. Это НЕ настоящий массив

function test(a, b) {
  console.log(Array.isArray(arguments)); // false
  console.log(typeof arguments); // 'object'
  console.log(arguments instanceof Array); // false
}

test(1, 2);

2. Есть свойство length

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

printAll(1, 2, 3, 4); // Выведет 1, 2, 3, 4

3. Можно преобразовать в массив

function convertToArray() {
  // Способ 1: Array.from()
  const arr1 = Array.from(arguments);
  
  // Способ 2: ...rest
  const arr2 = [...arguments];
  
  // Способ 3: slice()
  const arr3 = Array.prototype.slice.call(arguments);
  
  console.log(Array.isArray(arr1)); // true
}

convertToArray(1, 2, 3);

Реальные примеры использования

Пример 1: Функция с переменным количеством аргументов

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

logMessages('Hello', 'World', '!'); // Hello, World, !
logMessages('Single message'); // Single message
logMessages('One', 'Two', 'Three', 'Four'); // Все 4 аргумента

Пример 2: Суммирование любого количества чисел

function sum() {
  let total = 0;
  for (let i = 0; i < arguments.length; i++) {
    total += arguments[i];
  }
  return total;
}

console.log(sum(1, 2, 3)); // 6
console.log(sum(1, 2, 3, 4, 5)); // 15
console.log(sum(10, 20)); // 30

Пример 3: Функция со скрытыми параметрами

function greet(greeting, name) {
  // Явные параметры
  console.log(`${greeting}, ${name}!`);
  
  // Скрытые параметры (если передали больше)
  if (arguments.length > 2) {
    console.log('Extra arguments:');
    for (let i = 2; i < arguments.length; i++) {
      console.log(`  ${arguments[i]}`);
    }
  }
}

greet('Hello', 'John', 'Extra1', 'Extra2');
// Output:
// Hello, John!
// Extra arguments:
//   Extra1
//   Extra2

Современный подход — Rest параметры (вместо arguments)

arguments — старый способ:

function oldWay(a, b) {
  console.log(arguments); // Pseudo-array
}

oldWay(1, 2, 3);

Rest параметры — новый способ (ES6+):

// Намного яснее и удобнее!
function newWay(a, b, ...rest) {
  console.log(a); // 1
  console.log(b); // 2
  console.log(rest); // [3, 4, 5] - настоящий массив!
}

newWay(1, 2, 3, 4, 5);

Сравнение arguments и rest параметров

function withArguments() {
  console.log(arguments); // Pseudo-array [1, 2, 3]
  console.log(typeof arguments[0]); // 'number'
  // Нужно преобразовывать в массив для методов
  const arr = Array.from(arguments);
  return arr.map(x => x * 2);
}

function withRest(...numbers) {
  console.log(numbers); // [1, 2, 3] - настоящий массив
  console.log(typeof numbers[0]); // 'number'
  // Можно сразу использовать методы массива
  return numbers.map(x => x * 2);
}

console.log(withArguments(1, 2, 3)); // [2, 4, 6]
console.log(withRest(1, 2, 3)); // [2, 4, 6]

Ограничения arguments

1. Не работает со стрелочными функциями

const arrow = () => {
  console.log(arguments); // ReferenceError!
};

arrow(1, 2, 3);

// Нужно использовать rest:
const goodArrow = (...args) => {
  console.log(args); // [1, 2, 3]
};

goodArrow(1, 2, 3);

2. arguments в callback функциях указывает на callback, не на родительскую

function wrapper() {
  const numbers = [1, 2, 3];
  
  numbers.forEach(function(num) {
    console.log(arguments); // Аргументы forEach callback, не wrapper!
  });
}

wrapper(10, 20); // В callback arguments не будет [10, 20]

Практические примеры в реальном коде

Пример 1: Логирование с форматированием

function log() {
  // Старый способ
  const time = new Date().toISOString();
  let message = `[${time}] `;
  
  for (let i = 0; i < arguments.length; i++) {
    message += arguments[i];
    if (i < arguments.length - 1) message += ' ';
  }
  
  console.log(message);
}

log('User', 'logged in'); // [2024-04-02T12:30:45.123Z] User logged in

// Лучше использовать rest:
function logBetter(...args) {
  const time = new Date().toISOString();
  console.log(`[${time}]`, ...args);
}

logBetter('User', 'logged in');

Пример 2: Функция с опциональными параметрами

function createUser(name, email, role) {
  return {
    name: name || arguments[0],
    email: email || arguments[1],
    role: role || arguments[2] || 'user',
    argsCount: arguments.length
  };
}

const user = createUser('John', 'john@example.com');
console.log(user);
// { name: 'John', email: 'john@example.com', role: 'user', argsCount: 2 }

Когда ещё встречается arguments

// В методах Object
Object.defineProperty(window, 'accessArguments', {
  value: function() {
    return arguments; // arguments используется для получения параметров
  }
});

// В старом коде и библиотеках
function legacyFunction() {
  if (arguments.length === 0) {
    // Ничего не передано
  }
}

Вывод

arguments — это инструмент из прошлого JavaScript:

• Создаётся автоматически в каждой функции
• Содержит все переданные аргументы
• Это pseudo-array, не настоящий массив
• Не работает со стрелочными функциями
• Пригодится при чтении старого кода

В современном коде используй Rest параметры:

// Вместо arguments
function old() {
  console.log(arguments);
}

// Используй rest
function modern(...args) {
  console.log(args);
}

Рest параметры яснее, безопаснее и работают везде. Но понимание arguments важно для собеседований и чтения legacy-кода.