Scribd
Upload
10 views

7- Angular - Type Scripts (OOP)

Uploaded by

b42a0dc98d
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
10 views

7- Angular - Type Scripts (OOP)

Uploaded by

b42a0dc98d
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 32

Angular

Framework
Sayed Taha, PhD
Contents
• What is the Angular?
• Single-Page-Applications
• Angular Development Timeline
• IDE and tools.
• TypeScript-in-action
• Angular-in-action.
TypeScript as Object Oriented Programming
• In TypeScript you can :-
• Define classes
• Define Interfaces
• Apply OOP concepts: encapsulation, inheritance, and
polymorphism
• Define abstract methods, and abstract classes
Classes
• Classes are defined as below:
class <name>{
//constructors
//attributes
// member methods
}
• File name may not match the class name.
Classes
• Constructers are defined using constructor() method.
• Refer to the member attributes and methods using this.
• Create new instance/object using new
• Refer to the object members via (dot) operator.
Classes
Classes: Access Modifiers
• TypeScript access modifiers are:
• public: default and make property/method accessible anywhere.
• Protected : make property/method accessible within the class and its Childs
• Private: make property/method accessible only within the class.
Classes: Access Modifiers
Classes: Access Modifiers
Encapsulation : using accessors
• Accessors typically are performing the setter/getter methods job
for private attributes
Encapsulation : using accessors
• Accessors allow accessing the attributes directly without
the use of set/get methods.
• Private attribute may take any name;
• Setters have no return types even void
• Conventionally, attributes starts with ( _ ).
Encapsulation : using accessors
• Compilation errors
tsconfig.ts
• Compilation errors
Encapsulation : using accessors
Accessors are available on ES5 +
tsconfig.ts configurations file
Holds are compilation options for your project
Generate it via tsc - - init
Now you can set all options right here and compile wohle project files using tsc command
Parameter Properties
• Allows defining the member attributes by passing
them as parameters to the constructor
• Minimizes the code
Parameter Properties
• Complete example
Modularizing Our Code
• Till now we’re using our classes in the same file
• In real-time projects, files are used in different files

Uses
Product

ShoppingCart

Uses
Category
Modules
• This is going to achieved by:
• Export the source class
• Import it in the user file (use relative path + file name without extension)
Sub-classing
• Type script supports sub-classing / inheritance.
• Define the super class contains the common attributes and behavior
• Only single class inheritance are supported using extends keyword
• Calling super class members is possible using super keyword
• Implementing multiple interfaces is allowed
• Super constructor call MUST be the first line in the sub-class
constructor.
Sub-classing
Sub-classing
Sub-classing
Sub-classing
Sub-classing
• Array of super type can store any of its sub-types
Abstract Class
• Same in other OOP
• Abstract class is defined using abstract keyword.
• Contains at least one abstract method which defined also using
abstract keyword
• You cannot instantiate an abstract class
• Any class extends abstract class must implements its abstract methods
Abstract Class
Abstract Class
Abstract Class
Interfaces
• Interface is a contract that contains only abstract methods
• Class can implement an interface using implements keyword
• Class must implement all methods of the interface to be
concert otherwise it will be abstract
Interfaces
End of TypeSctipt In-Action

You might also like