0
0
Typescriptprogramming~10 mins

Tuple type definition in Typescript - Step-by-Step Execution

Choose your learning style9 modes available
Concept Flow - Tuple type definition
Define tuple type with fixed elements
Declare variable with tuple type
Assign values matching tuple types
Access tuple elements by index
Use tuple values in code
This flow shows how to define a tuple type, declare a variable with it, assign values, and access elements by their fixed positions.
Execution Sample
Typescript
type Person = [string, number];
let p: Person = ["Alice", 30];
console.log(p[0]);
console.log(p[1]);
Defines a tuple type Person with a string and a number, assigns values, and prints each element.
Execution Table
StepActionEvaluationResult
1Define tuple type Person as [string, number]Type createdPerson = [string, number]
2Declare variable p of type PersonVariable declaredp: Person
3Assign p = ["Alice", 30]Check types: string and numberp = ["Alice", 30]
4Access p[0]Retrieve first element"Alice"
5Access p[1]Retrieve second element30
6Print p[0]Output to consoleAlice
7Print p[1]Output to console30
8End of codeNo more stepsExecution stops
💡 All tuple elements accessed and printed, execution ends.
Variable Tracker
VariableStartAfter AssignmentFinal
pundefined["Alice", 30]["Alice", 30]
Key Moments - 3 Insights
Why must the tuple have exactly two elements with specific types?
Because the tuple type Person is defined as [string, number], so p must have exactly two elements: first a string, then a number, as shown in execution_table step 3.
Can I assign p = [30, "Alice"] instead?
No, because the tuple expects the first element to be a string and the second a number. Swapping types would cause a type error, as the assignment check in step 3 shows.
What happens if I access p[2]?
Accessing p[2] is invalid because the tuple only has two elements (indexes 0 and 1). This would cause a runtime error or TypeScript warning, not shown in the execution_table because it is not valid.
Visual Quiz - 3 Questions
Test your understanding
Look at the execution_table, what is the value of p after step 3?
A["Alice"]
B[30, "Alice"]
C["Alice", 30]
Dundefined
💡 Hint
Check the 'Result' column in row with Step 3 in execution_table.
At which step does the code print the number 30?
AStep 7
BStep 5
CStep 6
DStep 4
💡 Hint
Look at the 'Action' and 'Result' columns for steps printing values in execution_table.
If you tried to assign p = ["Bob", "thirty"], what would happen?
AAssignment succeeds with no error
BType error because second element is not a number
CRuntime error when accessing elements
DTuple length error
💡 Hint
Refer to step 3 where assignment checks types of tuple elements.
Concept Snapshot
Tuple type definition syntax:
type Name = [Type1, Type2, ...];
Declare variable: let v: Name;
Assign values matching types and order.
Access elements by index: v[0], v[1].
Tuple length and types are fixed.
Full Transcript
This example shows how to define a tuple type in TypeScript with fixed types and length. We define a type Person as a tuple with a string and a number. Then we declare a variable p of that type and assign it values matching the types and order. We access each element by its index and print it. The execution table traces each step: defining the type, declaring the variable, assigning values, accessing elements, and printing them. The variable tracker shows how p changes from undefined to the assigned tuple. Key moments clarify why the order and types matter and what happens if you try invalid assignments or access. The quiz tests understanding of the tuple's fixed structure and behavior. The snapshot summarizes the syntax and rules for tuple types in TypeScript.