EDUCBA

EDUCBA

MENUMENU
  • Free Tutorials
  • Free Courses
  • Certification Courses
  • 600+ Courses All in One Bundle
  • Login
Home Software Development Software Development Tutorials TypeScript Tutorial TypeScript Object Type
Secondary Sidebar
TypeScript Tutorial
  • Type of Union
    • TypeScript Object Type
    • TypeScript type check
    • TypeScript promise type
    • TypeScript JSON type
    • TypeScript Union Types
    • TypeScript typeof
    • TypeScript Types
  • TypeScript Basic and Advanced
    • What is TypeScript?
    • Typescript Examples
    • TypeScript Versions
    • TypeScript Operators
    • JavaScript dump object
    • JavaScript get Method
    • Webpack ReactJS
    • Code Generator JavaScript
    • JavaScript Projects
    • Call Stack JavaScript
    • JavaScript Projects GitHub
    • JavaScript Filter Function
    • JavaScript nan
    • JavaScripttimestamp
    • TypeScript loop
    • CoffeeScript
    • TypeScript Webpack
    • setTimeout TypeScript
    • DHTMLX
    • CoffeeScript for loop
    • TypeScript number
    • JavaScript export module
    • TypeScript string contains
    • TypeScript Inheritance
    • TypeScript get
    • TypeScript undefined
    • TypeScript Global Variable
    • TypeScript Dictionary
    • TypeScript Generic
    • TypeScript Cast Object
    • TypeScript Optional Parameters
    • TypeScript? switch
    • TypeScript promise
    • TypeScript tuple
    • TypeScript Hashmap
    • TypeScript let
    • TypeScript Getter
    • TypeScript Pattern Matching
    • TypeScript number to string
    • TypeScript substring
    • TypeScript?lambda
    • TypeScript UUID
    • TypeScript JSDoc
    • TypeScript Decorators
    • Typescript for loop
    • TypeScript HTTP Request
    • TypeScript Abstract Class
    • TypeScript Question Mark
    • TypeScript Nullable
    • TypeScript reduce
    • TypeScript Mixins
    • TypeScript keyof
    • TypeScript string to number
    • TypeScript JSON parse
    • TypeScript const
    • TypeScript declare module
    • TypeScript String
    • TypeScript filter
    • TypeScript Multiple Constructors
    • TypeScript? Set
    • TypeScript string interpolation
    • TypeScript instanceof
    • TypeScript JSON
    • TypeScript Arrow Function
    • TypeScript generator
    • TypeScript namespace
    • TypeScript default parameter
    • TypeScript cast
    • TypeScript babel
    • Typescript Key-Value Pair
    • TypeScript if
    • TypeScript keyof Enum
    • TypeScript wait
    • TypeScript Optional Chaining
    • TypeScript JSX
    • TypeScript Version Check
    • TypeScript Unit Testing
    • TypeScript Handbook
    • TypeScript module
    • TypeScript Extend Interface
    • TypeScript npm
    • TypeScript pick
    • TypeScript Interface Default Value
    • JavaScript import module
    • Obfuscate Javascript
    • TypeScript basics
    • setInterval TypeScript
  • TypeScript Array
    • TypeScript Array of Objects
    • Methods TypeScript Array
    • TypeScript remove item from array
    • TypeScript add to array
    • TypeScript Array Contains
  • Function Of Array
    • TypeScript Function Interface
    • TypeScript Functions
    • TypeScript Export Function
    • TypeScript function return type

TypeScript Object Type

TypeScript Object Type

Introduction to TypeScript Object Type

TypeScript object type is type of any non-primitive values. TypeScript has introduced new type called as object with version 2.2. It represents all non-primitive types. There are some Primitive types such as string, number, bigint, null, boolean, symbol, undefined. All other types are considered to be non-primitive types. With this object type, use can not access any properties of value. Basically, in JavaScript, data is grouped and passed data through objects. In similar way, in TypeScript, this concept is represented through object types. Here we will see the syntax of declaration and how is it used for implementing logics.

Syntax:

Start Your Free Software Development Course

Web development, programming languages, Software testing & others

Given below is the syntax of how TypeScript object type is declared:

All in One Software Development Bundle(600+ Courses, 50+ projects)
Python TutorialC SharpJavaJavaScript
C Plus PlusSoftware TestingSQLKali Linux
Price
View Courses
600+ Online Courses | 50+ projects | 3000+ Hours | Verifiable Certificates | Lifetime Access
4.6 (86,198 ratings)

let <object_name> : object;
object_name = {
param1: value1,
param2: value2,
param3: value3,
param4: value4
};

Here, we are declaring an object type in TypeScript and passing some parameters to it. These object types can be anonymous or can be even used by interfaces or type alias.

Examples of TypeScript Object Type

Given below are the examples mentioned:

Example #1

Declaration.

Code:

let student: object;
student = {
name: 'Karthik',
rollNo: 25,
age: 12,
standard: '6B'
};
console.log('Here are the details of Student with Roll. 25', student);

Output:

TypeScript Object Type 1

So here we have declared it, as student and passed 4 parameters to the student object, thereby printing the values on console. Here, if user tries to assign any primitive value directly to object student, we will get an error as ‘Type “X” is not assignable to type student’.

Basically, TypeScript objects such as student in the above example has fixed list of properties. And hence if user tries to access property that does not exist with object student, we will get an error:

‘Property “X” does not exist on type ‘student’.

Let us see the above two errors practically.

Example #2

TypeScript object type: basic errors.

Code:

let student: object;
student = {
name: 'Karthik',
rollNo: 25,
age: 12,
standard: '6B'
};
student='26';
console.log('Here are the details of Student', student);
console.log('Here are the details of Student', student.schoolName);

Output:

TypeScript Object Type 2

So here the first error, we had assigned a string value to the object and hence not assignable error.

The second error is as schoolName parameter does not exist with object type student and hence does not exist error.

In TypeScript, user can be able to specify properties of the object type. It should be first declared with type of each parameter passed to the object.

Syntax:

let student: {
name: string;
rollNo: number;
age: number;
standard: string;
schoolName: string;
};

Example #3

With specified parameters.

Code:

let student: {
name: string;
rollNo: number;
age: number;
standard: string;
} = {
name: 'Karthik',
rollNo: 25,
age: 12,
standard: '6B'
};
console.log('Here are the details of Student', student);

Output:

with specified parameters

There is no change in the output based compared to Example 1, but there is a difference in implementation as here we have specifically declared the parameters.

TypeScript also has property modifiers, i.e., each property of an object can specify whether the property can be optional. Most of the time, users find it difficult to deal with objects with property sets. In such cases, user can mark them as optional by adding question mark at the end of the property name like for e.g., name? : string;

Interface is also a way to describe the property type of a TypeScript object. Declaring object is fine but the type of each property is not defined in Example 1. If user wants to use this object with any function and forgets to pass on all the parameters, there might be a chance of getting garbage value and hence to prevent garbage values, TypeScript uses an interface for object types.

Example #4

With Interface.

Code:

interface Employee {
name: string,
empID: number,
designation: string,
company: string,
yearsExp: number
}
let empInfo = (emp: Employee):string => {
return `Employee ${emp.name} with ${emp.empID}
has been promoted as ${emp.designation} in ${emp.company} based on her experience of ${emp.yearsExp} years.`
}
let emp = {
name: "Riya",
empID: 7632,
designation: "TA",
company: "Virtusa",
}
console.log(empInfo(emp))

Output:

with Interface

So based on the Interface theory, here one of the parameter is not assigned to any value i.e. yearsExp and hence it is undefined in the output.

Below is the error:

error

Conclusion

We have seen the syntax of it, how it is declared and how is it used in programming. We have also seen another syntax where type of the parameter is provided so that there will be no confusion in assigning values to parameters. We have also seen few examples which will help to understand concept in a better way, also seen what kind of errors user would face while programming.

Recommended Articles

This is a guide to TypeScript Object Type. Here we discuss the introduction and examples of TypeScript object type respectively. You may also have a look at the following articles to learn more –

  1. TypeScript Functions
  2. TypeScript Operators
  3. TypeScript Versions
  4. What is TypeScript?
0 Shares
Share
Tweet
Share
Primary Sidebar
Footer
About Us
  • Blog
  • Who is EDUCBA?
  • Sign Up
  • Live Classes
  • Corporate Training
  • Certificate from Top Institutions
  • Contact Us
  • Verifiable Certificate
  • Reviews
  • Terms and Conditions
  • Privacy Policy
  •  
Apps
  • iPhone & iPad
  • Android
Resources
  • Free Courses
  • Java Tutorials
  • Python Tutorials
  • All Tutorials
Certification Courses
  • All Courses
  • Software Development Course - All in One Bundle
  • Become a Python Developer
  • Java Course
  • Become a Selenium Automation Tester
  • Become an IoT Developer
  • ASP.NET Course
  • VB.NET Course
  • PHP Course

ISO 10004:2018 & ISO 9001:2015 Certified

© 2022 - EDUCBA. ALL RIGHTS RESERVED. THE CERTIFICATION NAMES ARE THE TRADEMARKS OF THEIR RESPECTIVE OWNERS.

EDUCBA
Free Software Development Course

C# Programming, Conditional Constructs, Loops, Arrays, OOPS Concept

*Please provide your correct email id. Login details for this Free course will be emailed to you

By signing up, you agree to our Terms of Use and Privacy Policy.

EDUCBA Login

Forgot Password?

By signing up, you agree to our Terms of Use and Privacy Policy.

EDUCBA
Free Software Development Course

Web development, programming languages, Software testing & others

*Please provide your correct email id. Login details for this Free course will be emailed to you

By signing up, you agree to our Terms of Use and Privacy Policy.

EDUCBA

*Please provide your correct email id. Login details for this Free course will be emailed to you

By signing up, you agree to our Terms of Use and Privacy Policy.

Let’s Get Started

By signing up, you agree to our Terms of Use and Privacy Policy.

This website or its third-party tools use cookies, which are necessary to its functioning and required to achieve the purposes illustrated in the cookie policy. By closing this banner, scrolling this page, clicking a link or continuing to browse otherwise, you agree to our Privacy Policy

Loading . . .
Quiz
Question:

Answer:

Quiz Result
Total QuestionsCorrect AnswersWrong AnswersPercentage

Explore 1000+ varieties of Mock tests View more