Typescript and spread operator?

前端 未结 3 962
爱一瞬间的悲伤
爱一瞬间的悲伤 2020-12-09 07:43
function foo(x:number, y:number, z:number) { 
   console.log(x,y,z);
}
var args:number[] = [0, 1, 2];

foo(...args);

Why am i getting getting this

相关标签:
3条回答
  • 2020-12-09 08:02

    So there is a little clause you may have missed:

    Type checking requires spread elements to match up with a rest parameter.

    Without Rest Paramater

    But you can use a type assertion to go dynamic... and it will convert back to ES5 / ES3 for you:

    function foo(x:number, y:number, z:number) { 
     console.log(x,y,z);
    }
    var args:number[] = [0, 1, 2];
    
    (<any>foo)(...args);
    

    This results in the same apply function call that you'd expect:

    function foo(x, y, z) {
        console.log(x, y, z);
    }
    var args = [0, 1, 2];
    foo.apply(void 0, args);
    

    With Rest Parameter

    The alternative is that it all works just as you expect if the function accepts a rest parameter.

    function foo(...x: number[]) { 
     console.log(JSON.stringify(x));
    }
    var args:number[] = [0, 1, 2];
    
    foo(...args);
    
    0 讨论(0)
  • 2020-12-09 08:18
    function foo(x:number, y:number, z:number) { 
      console.log(x,y,z);
    }
    var args:[number, number,number] = [0, 1, 2];
    foo(...args);
    

    You can try this. Personally, I think it is the answer that best fits your question scenario.

    0 讨论(0)
  • 2020-12-09 08:24

    I think @Fenton explains it very well but I would like to add some more documentation and possible solutions.

    Solutions:

    Function overload. I prefer this solution in this case because it keeps some kind of type safety and avoids ignore and any. The original method and function call does not need to be rewritten at all.

    function foo(...args: number[]): void
    function foo(x: number, y: number, z: number) {
      console.log(x, y, z);
    }
    var args: number[] = [0, 1, 2];
    
    foo(...args);
    

    Use @ts-ignore to ignore specific line, TypeScript 2.3

    function foo(x: number, y: number, z: number) {
      console.log(x, y, z);
    }
    var args: number[] = [0, 1, 2];
    // @ts-ignore
    foo(...args);
    

    Use as any.

    function foo(x: number, y: number, z: number) {
      console.log(x, y, z);
    }
    var args: number[] = [0, 1, 2];
    
    (foo as any)(...args);
    

    Link with documentation regarding the spread operator:

    https://www.typescriptlang.org/docs/handbook/release-notes/typescript-2-1.html

    Discussions regarding this:

    https://github.com/Microsoft/TypeScript/issues/5296 https://github.com/Microsoft/TypeScript/issues/11780 https://github.com/Microsoft/TypeScript/issues/14981 https://github.com/Microsoft/TypeScript/issues/15375

    0 讨论(0)
提交回复
热议问题