Что нужно сделать, чтобы использовать оператор распространения в TypeScript

Question

У меня есть этот пример функции:

const spreadingArray(arg1, arg2){
   return arg1 + arg2;
}
const numbers = [4,5];

spreadArray(...numbers); // return 9
spreadArray.apply(this, numbers); // return 9
spreadArray(4, 5); // return 9

Эти три примера функции должны возвращать один и тот же результат. Но у меня ошибка при запуске ng serve:

TS2556: ожидается 2 аргумента, но получено 0 или более.

Если я комментирую первый spreadArray(...numbers) и запускаю ng serve, он прекрасно компилируется, я снова удаляю комментарий, и он автоматически перекомпилируется с ошибкой, но он уже скомпилирован, поэтому он продолжает работать, и код работает. Это заставляет меня думать, что это синтаксическая ошибка, потому что в конце angular знает, как скомпилировать в es5 wish в этом случае .apply(this, numbers). Примечание: проблема здесь не в том, почему я должен использовать оператор распространения, а в том, почему TypeScript не понимает этого. Я хочу использовать его, потому что это просто Javascript ES6. Я использую @ angular / cli 6.1.5, @angular 6.1.4 и пробовал использовать узлы 8.10 и 9.11 и машинописный текст 2.7.2 и 2.9.2.

ОБНОВЛЕНИЕ: реальный пример этой ... функции: введите описание изображения здесь

Answer 1

Как видно из пар ответов, неясно, чего вы пытаетесь достичь с помощью функции spreadingArray, но передача аргумента, подобного ... числам, не будет соответствовать требованию точных двух аргументов функции.

Так что, может быть, вы можете пойти на расщепление и взять 0-й и 1-й индексы:

        this.spreadingArray(numbers[0], numbers[1]);  // return 9
        this.spreadingArray.apply(this, numbers); // return 9
        this.spreadingArray(4, 5); // return 9

Или вы можете изменить свою функцию spreadingArray, как показано ниже:

spreadingArray(...args:number[]): number { 
   return args.reduce(function(total, number){
    return total + number;
}, 0);
}

Рабочий код:

/** TYPESCRIPT CODE 
class Test {
    test() {
        console.log(this.spreadingArray(...numbers));  // return 9
        console.log(this.spreadingArray.apply(this, numbers)); // return 9
        console.log(this.spreadingArray(4, 5)); // return 9
    }

    

spreadingArray(...args:number[]): number { 
   return args.reduce(function(total, number){
    return total + number;
}, 0);
}

}

const numbers = [4, 5];




let test = new Test();

let button = document.createElement('button');
button.textContent = "Test Output";
button.onclick = function() {
    test.test();
}

document.body.appendChild(button);
**/
/** Generated Javascript code **/

var Test = /** @class */ (function() {
  function Test() {}
  Test.prototype.test = function() {
    console.log(this.spreadingArray.apply(this, numbers)); // return 9
    console.log(this.spreadingArray.apply(this, numbers)); // return 9
    console.log(this.spreadingArray(4, 5)); // return 9
  };
  Test.prototype.spreadingArray = function() {
    var args = [];
    for (var _i = 0; _i < arguments.length; _i++) {
      args[_i] = arguments[_i];
    }
    return args.reduce(function(total, number) {
      return total + number;
    }, 0);
  };
  return Test;
}());
var numbers = [4, 5];
var test = new Test();
var button = document.createElement('button');
button.textContent = "Test Output";
button.onclick = function() {
  test.test();
};
document.body.appendChild(button);

Answer 2

Проблема в наборе текста.

Если вы пишете const numbers = [4,5];, это равняется написанию const number: number[] = [4,5], поэтому, когда вы передаете numbers методу spreadingArray, компилятор не может проверить, передаете ли вы два значения или нет, и выдает исключение.

Чтобы решить проблему, вы должны определить правильный тип для numbers в виде массива из двух чисел:

const numbers: [number, number] = [4,5];

Или изменение метода spreadingArray для принятия атрибута расширения:

function spreadingArray(...values: number[]){
   return values.reduce((prev, current) => prev + current, 0);
}

Answer 3

Я не эксперт по машинописи, но, похоже, проблема вызвана тем, что у вас есть 2 параметра в функции spreadingArray, но динамическое число аргументов, поступающих от вызова функции. Попробуйте удалить параметры из сигнатуры функции и использовать вместо этого объект arguments. Документы на arguments можно найти здесь.

const spreadingArray() {
   return arguments.reduce(function(acc, next) { return acc + next; }, 0);
}