CodeBlanks Logo Icon CodeBlanks
Login Register

Object type

Learn to explicitly write object types.

Object type

An object type describes the shape of an object: which properties it has and what their types are. Property names and types are written inside curly braces.

let kisi: { ad: string; yas: number } = {
  ad: "Ali",
  yas: 25
};

The object type checks the value's structure at compile time.

Object type matching

The object value must match the type exactly: all required properties must be present with the correct types. A missing property or wrong type causes a compile error. Extra properties are also not accepted.

let p: { x: number; y: number } = {
  x: 3,
  y: 4
};  // valid

The object type must match the value's shape exactly.

Practice Define an object with a type annotation

Declare a variable named kisi with type { ad: string; yas: number } and value { ad: "Ayşe", yas: 28 }. Print the value of kisi.ad with console.log.

Starter code

index.ts
// kisi adında bir nesne tanımla
// tür ad ve yas özellikleri içersin (ad dize, yas sayı)
// değer olarak ad "Ayşe", yas 28 kullan
// kisi.ad değerini yazdır

Sample solution

index.ts
let kisi: { ad: string; yas: number } = { ad: "Ayşe", yas: 28 };
console.log(kisi.ad);

Expected output

Ayşe

Questions and answers

Review the lesson questions together with their answers. To test yourself, solve the lesson interactively.

1 What does <code>{ ad: string; yas: number }</code> describe?

  • An object type with ad (string) and yas (number) properties Correct answer
  • An array with two elements
  • A function with two parameters
  • A tuple of string and number

Explanation: Property names and types inside curly braces describe an object's shape; <code>ad: string; yas: number</code> is an object type with two properties.

2 Complete the object property type

Question 
let nokta: { x: number; y: ____ } = { x: 3, y: 4 };
Answer 
let nokta: { x: number; y: number } = { x: 3, y: 4 };

Explanation: Since the value is <code>{ x: 3, y: 4 }</code>, the <code>y</code> property is also a number; the correct type is <code>number</code>. <code>string</code> and <code>boolean</code> do not accept a number.

3 Object type concepts

Term Meaning
{ ad: string } ad property of type string
{ x: number; y: number } x and y number properties
Object type Describing an object's shape
{ yas: number } yas property of type number

All lessons in Beginner

1 TypeScript intro and setup

  1. What is TypeScript?
  2. Why TypeScript?
  3. tsc compiler
  4. tsconfig basics
  5. Summary - TypeScript basics

2 Primitive types

  1. string type
  2. number type
  3. boolean type
  4. let and const
  5. Summary - Primitive types

3 Arrays

  1. Array type
  2. Array methods
  3. readonly arrays
  4. Multidimensional arrays
  5. Summary - Arrays

4 Tuples

  1. What is a tuple?
  2. Tuple usage
  3. readonly tuple
  4. Summary - Tuple

5 Enums

  1. Numeric enum
  2. String enum
  3. const enum
  4. Enum members
  5. Summary - Enum

6 any, unknown, never

  1. any type
  2. unknown type
  3. never type
  4. void type
  5. Summary - Special types

7 Type annotation

  1. Variable annotation
  2. Parameter annotation
  3. Return type annotation
  4. Summary - Type annotation

8 Type inference

  1. Basic inference
  2. Inference with const
  3. Best common type
  4. Summary - Type inference

9 Objects

  1. Object type
  2. Optional properties
  3. Readonly properties
  4. Summary - Objects

10 Functions

  1. Function declaration
  2. Optional and default params
  3. Rest params
  4. Function overloads
  5. Summary - Functions

11 Arrow functions

  1. Arrow syntax
  2. this with arrow
  3. Arrow type
  4. Summary - Arrow functions

12 Interfaces

  1. What is an interface?
  2. Property types
  3. Interface vs type alias
  4. Summary - Interfaces

13 Type alias

  1. What is a type alias?
  2. Composition with alias
  3. Alias vs interface
  4. Summary - Type alias

14 Union and intersection

  1. Union types
  2. Intersection types
  3. Literal types
  4. Summary - Union & intersection

15 null and undefined

  1. null vs undefined
  2. Optional chaining
  3. Nullish coalescing
  4. Summary - null & undefined

16 Strict mode

  1. strict: true
  2. strictNullChecks
  3. strictFunctionTypes
  4. Summary - Strict mode

17 Project: Shopping cart

  1. Cart design
  2. Add product
  3. Total calculation
  4. Apply discount
  5. Integration

18 Project: Todo CLI

  1. Task model
  2. Add and list
  3. Completion
  4. Filtering
  5. Integration

19 Project: Library

  1. Book model
  2. Add and search
  3. Borrow
  4. Return
  5. Integration

20 Beginner final

  1. Challenge 1: Types
  2. Challenge 2: Functions
  3. Challenge 3: Unions
  4. Challenge 4: Mini app