How does this TypeScript function parameter work

Question

I found this code online and trying to understand it.

public searchFunctionFactory($index: any): (text: Observable<string>) => Observable<any[]> {


    //Create a function that considers the specified $index parameter value
    let getCities = (text$: Observable<string>) => 
        text$
            .debounceTime(300)
            .distinctUntilChanged()
            .switchMap( query => {

                //some logic involving $index here
                //...

                //query.length < 2 ? [] : this.apiService.getCities(query).catch(() => {
                //return Observable.of([]);
            });

    //Return that "custom" function, which will in turn be called by the ngbTypescript component
    return getCities;
}

My question revolves around the method signature.

public searchFunctionFactory($index: any): (text: Observable<string>) => Observable<any[]>

I understand

$index: any is an input parameter of type Any.

The function returns Observable an observable of any.

But what is : (text: Observable<string>)

Is it a second parameter?

If its a second parameter shouldn't it be

public searchFunctionFactory($index: any ,text: Observable<string>) => Observable<any[]>

That is actually a function that returns a function, and it is TypeScript code, not JavaScript. — Herohtar
– Herohtar, Commented Apr 24, 2019 at 3:17

CertainPerformance · Accepted Answer · 2019-04-24 03:19:38Z

1

That indicates that the return value of the searchFunctionFactory function is a function which takes a parameter of text, whose type is Observable<string>, and calling that function returns an Observable<any[]>. It's a higher-order function.

public searchFunctionFactory($index: any): (text: Observable<string>) => Observable<any[]> {
                        /*   ^^^^^^^^^^^   searchFunctionFactory parameter */
public searchFunctionFactory($index: any): (text: Observable<string>) => Observable<any[]> {
  /* searchFunctionFactory return value     ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ */

As comment notes, this is not Javascript syntax, but Typescript syntax.

So, if you call

const result = searchFunctionFactory(someVar);

result will be of the type

(text: Observable<string>) => Observable<any[]>

and you could then call it with

const resultTwo = result(someOtherVar)

to get a value whose type is Observable<any[]>.

answered Apr 24, 2019 at 3:19

CertainPerformance

373k55 gold badges354 silver badges359 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

jhon.smith Over a year ago

Thank you so much for the explanation .can i call it like this const result = searchFunctionFactory(someVar)(someOtherVar)()

CertainPerformance Over a year ago

Don't think so. You could do searchFunctionFactory(someVar)(someOtherVar), thereby calling the returned function immediately, but that returned function does not return a function as well (it returns an Observable), so you couldn't call it too. const observableOfAny = searchFunctionFactory(someVar)(someOtherVar)

jhon.smith Over a year ago

Hi Thanks again so it would be on the lines of const observableOfAny = searchFunctionFactory(someVar) and then the usual routine observableOfAny.subscribe(() => do something) ?

CertainPerformance Over a year ago

What searchFunctionFactory returns is a function, not a observerable - you'd have to call the returned function to get the observable of any. searchFunctionFactory(someVar)(someOtherVar) and then you can call .subscribe or whatever you want on that observable

Collectives™ on Stack Overflow

How does this TypeScript function parameter work

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related