Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

TypeScript - Named arguments? [duplicate]

I'm trying to learn both TypeScript and Angular (and thus JavaScript).

Going through the Angular tutorials, I see they do stuff like this:

In normal javascript:

function CreateCtrl($scope, $location, Project){
// do stuff
}

For full example, see the "Wire up a backend" project.js example on the Angular homepage.

The kicker is, those parameters could be in any order (or not there at all), and Project is actually a user defined variable/type. The Angular framework is able to map the parameters to actual objects.

So now to Typescript, how can I recreate this type of functionality? I would like to describe Angular's behavior in some way, to let me wrap it in Typescript (strongly type this flexible property injection).

like image 203
JasonS Avatar asked Feb 18 '13 08:02

JasonS


People also ask

How do you solve duplicate function implementation TypeScript?

The error "Duplicate function implementation" occurs when we define an implementation for a function with the same name multiple times in the same file. To solve the error, rename the second function or use overloads by specifying multiple signatures, not multiple implementations.

Can you overload methods in TypeScript?

Function overloading in TypeScript lets you define functions that can be called in multiple ways. Using function overloading requires defining the overload signatures: a set of functions with parameter and return types, but without a body. These signatures indicate how the function should be invoked.

What is named parameter in TypeScript?

Even though there is technically no such thing as a named parameter in TypeScript (or JavaScript), the language offers a syntax that makes it possible to use a very similar functionality! Named arguments make life much easier. They allow you to play with function arguments almost like you play with letters in Scrabble.


1 Answers

There is an AngularJS type definition on Definitely Typed that lets you use Angular from TypeScript.

If I was creating a definition for an existing function such as this (in the absence of named arguments), I would probably either define them in a specific order (even though I know they could be passed in varying orders in plain JavaScript) or create a set of function overloads that matched the possibilities I wanted to expose, like this:

interface Example {
    ($scope: bool, $location: string, Project: number): void;
    ($location: string, $scope: bool, Project: number): void;
    (Project: number, $scope: bool, $location: string): void;
}

declare var example: Example;

When I attempt to call example( I get intellisense with the three options and if I don't use one of these combinations I get a compiler warning.

In JavaScript, named arguments are normally created with an object, so if I was writing a new method that could accept arguments in this way I would do this...

interface ExampleArguments {
    scope: bool;
    location: string;
    project: number;
}

var example = function (exampleArguments: ExampleArguments) {

};

example({ scope: true, project: 4, location: 'hi' });

Which is statically typed and checked in TypeScript.

like image 111
Fenton Avatar answered Oct 19 '22 09:10

Fenton