> For the complete documentation index, see [llms.txt](https://sandeepamaranath.gitbook.io/notes/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://sandeepamaranath.gitbook.io/notes/languages-and-frameworks/typescript/classes-and-interfaces.md).

# Classes and Interfaces

Classes and interfaces (OOP)

## Classes and Objects

<figure><img src="https://1944679227-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MVEiPUp08kYt33g51v7%2Fuploads%2FgnsxaIHHbRG4dbhcNrGw%2Fimage.png?alt=media&amp;token=5e3f07fb-6133-4e1c-a710-9adcd0eada25" alt=""><figcaption></figcaption></figure>

We have name attribute. We can also add some methods (functions) to this Department class.

### this keyword

<figure><img src="https://1944679227-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MVEiPUp08kYt33g51v7%2Fuploads%2Fczeb095OplBQ0q4pleAj%2Fimage.png?alt=media&amp;token=47ca7593-2ef7-422a-b739-a490599800fa" alt=""><figcaption></figcaption></figure>

<figure><img src="https://1944679227-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MVEiPUp08kYt33g51v7%2Fuploads%2FDSzfaY1hXOSPeOwMElGg%2Fimage.png?alt=media&amp;token=03bb0d0d-910a-4b01-8afe-4db919520864" alt=""><figcaption></figcaption></figure>

So one way we can solve this is by using name inside newAccounting like this to solve 'this' keyword

<figure><img src="https://1944679227-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MVEiPUp08kYt33g51v7%2Fuploads%2FWBIjLotpy5ypk91rmhzl%2Fimage.png?alt=media&amp;token=6e6ce6c0-72fc-4a53-8dbd-b085355eb81c" alt=""><figcaption></figcaption></figure>

<figure><img src="https://1944679227-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MVEiPUp08kYt33g51v7%2Fuploads%2FwiHjYMG4x5y7eBjhj47n%2Fimage.png?alt=media&amp;token=27cb1279-1019-4c02-8c5b-2976995c7667" alt=""><figcaption></figcaption></figure>

<figure><img src="https://1944679227-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MVEiPUp08kYt33g51v7%2Fuploads%2FSNBxgtvOaOigDnGrYvGt%2Fimage.png?alt=media&amp;token=d62371dc-dce9-4830-ae3d-d9ffad34e200" alt=""><figcaption></figcaption></figure>

<figure><img src="https://1944679227-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MVEiPUp08kYt33g51v7%2Fuploads%2Fs2oZaFsg4DG7MIarw7Yo%2Fimage.png?alt=media&amp;token=02a24d8e-230c-4c2a-a221-1edef8150ca2" alt=""><figcaption></figcaption></figure>

So the idea is, caller variable (or object whose is calling the method) should take care that the 'this' keyword is implemented properly. It's responsibility of caller to check if that prop (eg. name) exists which is required by the method. To avoid that compilation error, we have added the this parameter and we have set it's type to Department class, saying that, whatever  attributes department class has, make sure you provide that in caller so that `this` inside the describe method won't fail.

### private and public access modifiers

Let's say we define employees array in Department class

<figure><img src="https://1944679227-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MVEiPUp08kYt33g51v7%2Fuploads%2FGzoDue0CzT34UeRENuwp%2Fimage.png?alt=media&amp;token=346545e3-9883-4d05-a249-72df704d5d1b" alt=""><figcaption></figcaption></figure>

and we have a method to add employees from within the class

Let's add method to add employees and also to print them

<figure><img src="https://1944679227-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MVEiPUp08kYt33g51v7%2Fuploads%2FLjbwydbT8wXoAs2EIIql%2Fimage.png?alt=media&amp;token=3f6c1e9c-3ef4-4742-a72d-46e423a8307d" alt=""><figcaption></figcaption></figure>

Now, to add and print employees we can call these methods on instance

<figure><img src="https://1944679227-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MVEiPUp08kYt33g51v7%2Fuploads%2FurRHhOokovOpw429xnO4%2Fimage.png?alt=media&amp;token=d40cf6dd-623a-422e-95db-47604161b832" alt=""><figcaption></figcaption></figure>

<figure><img src="https://1944679227-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MVEiPUp08kYt33g51v7%2Fuploads%2F6PuTtinEqFmHTeRpRPtP%2Fimage.png?alt=media&amp;token=59cfc696-30e5-49e0-9edd-627ab86a1141" alt=""><figcaption></figcaption></figure>

One problem we have here is that, we can add employees by not calling `addEmployee()` inside the class on instance methods. For example, we could do

<figure><img src="https://1944679227-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MVEiPUp08kYt33g51v7%2Fuploads%2FEWE8RFRh8RUJ34Ygzm9D%2Fimage.png?alt=media&amp;token=305f7b1b-90f2-467d-8cd5-4d9244cca4b8" alt=""><figcaption></figcaption></figure>

<figure><img src="https://1944679227-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MVEiPUp08kYt33g51v7%2Fuploads%2FRj612rbQrplAddO2qmF5%2Fimage.png?alt=media&amp;token=eb61c88e-519a-4b97-a9dd-6f2601b42458" alt=""><figcaption></figcaption></figure>

When building this, we should better avoid multiple ways of adding an employee and do it one single way to avoid confusion. May be there is a validation that happens when we call addEmployee() before it actually adds an employee and we might not get those validations on directly adding it to array.&#x20;

So to avoid adding employee from outside, we can make employees variable private so that this cannot be accessed like this `instance.employees[2] = 'anna'`

<figure><img src="https://1944679227-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MVEiPUp08kYt33g51v7%2Fuploads%2FNITos9nJo1lCtnjX8prg%2Fimage.png?alt=media&amp;token=fd8f951d-bab2-442e-9473-9f091e135977" alt=""><figcaption></figcaption></figure>

<figure><img src="https://1944679227-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MVEiPUp08kYt33g51v7%2Fuploads%2FoyGkMJ61rgv0E9GUnGpR%2Fimage.png?alt=media&amp;token=70e3b75c-6694-4918-909f-1565df04b47f" alt=""><figcaption></figcaption></figure>

### Shorthand way of writing classes

<figure><img src="https://1944679227-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MVEiPUp08kYt33g51v7%2Fuploads%2FFk2Gez7oNTPCupNBu26p%2Fimage.png?alt=media&amp;token=2d53976a-f5c3-4dab-9498-8c7e26d040bc" alt=""><figcaption></figcaption></figure>

### readonly modifier

Similar to access modifiers private and public we learnt above. Let's say we have a field that's not only private but also should not be changed once assigned inside the class. For example, id shouldn't change after initialization, for this we can use readonly modifier.<br>

<figure><img src="https://1944679227-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MVEiPUp08kYt33g51v7%2Fuploads%2FhrSOIddPxK8FjEjKvq6k%2Fimage.png?alt=media&amp;token=dea9e51d-cf8b-4624-b148-bbc610e2b267" alt=""><figcaption></figcaption></figure>

Just like private and public, readonly is only understood by TS and doesn't exist in JS.&#x20;

<figure><img src="https://1944679227-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MVEiPUp08kYt33g51v7%2Fuploads%2FhR70QOsR30CL4W67tj5r%2Fimage.png?alt=media&amp;token=2aece5d7-c1f5-4039-894b-57218b6b58cb" alt=""><figcaption></figcaption></figure>

## Quiz

<figure><img src="https://1944679227-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MVEiPUp08kYt33g51v7%2Fuploads%2FVzZZ7RqXvkUu9AzS6XOY%2Fimage.png?alt=media&amp;token=dd166442-8336-4478-9cdd-60458cfa5a81" alt=""><figcaption></figcaption></figure>

<figure><img src="https://1944679227-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MVEiPUp08kYt33g51v7%2Fuploads%2FP7A5XghHvj5w9aWcieSH%2Fimage.png?alt=media&amp;token=0b73e42d-ab9a-4709-abfb-54f72c20b4fd" alt=""><figcaption></figcaption></figure>

<figure><img src="https://1944679227-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MVEiPUp08kYt33g51v7%2Fuploads%2FZCY33KzZSoyNAGHXp6ID%2Fimage.png?alt=media&amp;token=95f9e806-87fb-49b9-97b1-5825e08377dc" alt=""><figcaption></figcaption></figure>

<figure><img src="https://1944679227-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MVEiPUp08kYt33g51v7%2Fuploads%2FKUITxmtF5sVQGgweXP2k%2Fimage.png?alt=media&amp;token=b3eefd3b-032c-45b9-8cac-1a0b1a30df6f" alt=""><figcaption></figcaption></figure>

## Inheritance
