26

could you please tell me how to check typeof of variable in typescript + angular ?

import { Component } from '@angular/core';

interface Abc {
  name : string
}
@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {
  name = 'Angular 6';
  a:Abc= {
  name:"sss"
  }

  constructor(){
    console.log(typeof this.a)
   // console.log(this.a instanceof Abc) 
  }
}

It should give true and false

https://stackblitz.com/edit/angular-jfargi?file=src/app/app.component.ts

user944513
  • 12,247
  • 49
  • 168
  • 318
  • Possible duplicate of [Why does 'instanceof' in TypeScript give me the error "'Foo' only refers to a type, but is being used as a value here."?](https://stackoverflow.com/questions/46703364/why-does-instanceof-in-typescript-give-me-the-error-foo-only-refers-to-a-ty) – David Jul 05 '18 at 11:43
  • for `true` / `false` you have to check it against some value – Mohd Tabish Baig Jul 05 '18 at 11:43

6 Answers6

36

Interfaces are erased at runtime so there will be no trace of the interface in any runtime call. You can either use a class instead of an interface (classes exist at runtime and obey instanceof 

class Abc {
    private noLiterals: undefined;
    constructor(public name: string) { }
}
@Component({
    selector: 'my-app',
    templateUrl: './app.component.html',
    styleUrls: ['./app.component.css']
})
export class AppComponent {
    name = 'Angular 6';
    a: Abc = new Abc( "sss")

    constructor() {
        console.log(this.a instanceof Abc) // Will be true 
    }
}

Or you can do structural checking to see if the properties of Abc are present at runtime in the object:

export class AppComponent {
    name = 'Angular 6';
    a: Abc = { name: "sss" }

    constructor() {
        console.log('name' in this.a) // Will be true 
    }
}
Bobby
  • 33
  • 4
Titian Cernicova-Dragomir
  • 230,986
  • 31
  • 415
  • 357
  • Instead of testing `'name' in this.a`, given `this.a` follows an interface, one could: `const myInterface = this.a as MyInterface; console.log(myInterface.name)` – Jose Alban Sep 20 '21 at 10:50
  • structural check works, however instanceof for class-es is a bit tricky. They only work if you initialize the variable with the new keyword. If initialized as an object, it won't fly. See: https://stackblitz.com/edit/angular-vz9oyw?file=src%2Fapp%2Fapp.component.ts – Neophyte Jul 25 '23 at 09:48
31

just use typeof(variable); so in your case:

console.log(typeof(this.a));
Florian Ludewig
  • 4,338
  • 11
  • 71
  • 137
8

Try 'instanceof' or 'is':

a instanceof Abc;

See also: Class type check with typescript

zerocewl
  • 11,401
  • 6
  • 27
  • 53
5

For basic types (string, number, etc) you can check like this:

if( typeof(your_variable) === 'string' ) { ... }

octavian09
  • 139
  • 1
  • 3
3

Interfaces only exist at compile-time and are removed after compilation, so that code makes no sense at run-time. If you try so it will always return false.

Have a look here -

constructor(){
    console.log(typeof(this.a), '---');
    console.log(this.instanceOfA(this.a)); 
  }

  instanceOfA(object: any): object is ABc {
    return 'member' in object;
  }

Working Example

For more in details refer here -

Pardeep Jain
  • 84,110
  • 37
  • 165
  • 215
0

try this

  console.log(typeof (this.specialProviderSelected));

we can check type of variable like as string, number, object etc

  if((typeof (this.specialProviderSelected)) === 'string') {
     action here...
    }
   if((typeof (this.specialProviderSelected))  === 'number') {
     action here...
    }
    if((typeof (this.specialProviderSelected))  === 'object') {
     action here...
    }
Trilok Singh
  • 1,227
  • 12
  • 10