Mastering Typescript: The ultimate guide to efficiently managing, storing, and retrieving Objects

Question

Mastering Typescript: The ultimate guide to efficiently managing, storing, and retrieving Objects

Currently exploring typescript and aiming to construct a storage object.

The desired structure of the object is as follows:

workoutResults: array { 
    workoutResult {
        dateOfWorkout: string
        rounds: array {
            sets:array {
                repeats: number;
                weight: number;
                duration: number;
            }
        }
    }
}

I intend to maintain a log of past workouts while also having access to the most recent workout results when initiating a new session.

While experimenting with interfaces, I encountered an issue:

interface WorkoutResult {
    workoutDate: string;
    workoutSet: WorkoutSet;
}

interface WorkoutSet {
}

export class WorkoutDoPage {

    private workoutResults: Array<WorkoutResult>;

    constructor(private nav: NavController, private navParams: NavParams, public exerciseData: ExerciseData) {

        var testDate: any = new Date();

        this.workoutResults.push(testDate);

        console.log(this.workoutResults);

    }

}

An error arises: Cannot read property 'push' of undefined.

Your guidance would be greatly appreciated :)

How can I effectively implement this data structure in typescript?

angularjs angular typescript ionic-framework ionic2

Answer 1

Answer №1

To properly set up your array, you need to initialize it either after declaration or in the constructor:

private workoutResults: Array<WorkoutResult> = [];

Alternatively, you can do it in the constructor like this:

constructor(private nav: NavController, private navParams: NavParams, public exerciseData: ExerciseData) {

    var testDate: any = new Date();
    this.workoutResults = [];
    this.workoutResults.push(testDate);

    console.log(this.workoutResults);

}

If you want to have sub arrays, consider using interfaces like so:

interface WorkoutSet {
  repeats: number;
  weight: number;
  duration: number;
}

interface WorkoutRounds {
  rounds: WorkoutSet[];
}

interface WorkoutResults {
  dateOfWorkout: string;
  rounds: WorkoutRounds[];
}
workoutResults: WorkoutResults[] = [];

You can then push complete objects containing this data into the WorkoutResults array.

Answer 2

To properly set up your array, you need to initialize it either after declaration or in the constructor:

private workoutResults: Array<WorkoutResult> = [];

Alternatively, you can do it in the constructor like this:

constructor(private nav: NavController, private navParams: NavParams, public exerciseData: ExerciseData) {

    var testDate: any = new Date();
    this.workoutResults = [];
    this.workoutResults.push(testDate);

    console.log(this.workoutResults);

}

If you want to have sub arrays, consider using interfaces like so:

interface WorkoutSet {
  repeats: number;
  weight: number;
  duration: number;
}

interface WorkoutRounds {
  rounds: WorkoutSet[];
}

interface WorkoutResults {
  dateOfWorkout: string;
  rounds: WorkoutRounds[];
}
workoutResults: WorkoutResults[] = [];

You can then push complete objects containing this data into the WorkoutResults array.

Mastering Typescript: The ultimate guide to efficiently managing, storing, and retrieving Objects

Answer №1

Similar questions

Initiating change notification when utilizing service communication

CDK Drag and Drop capability for lists within lists

AngularJS bespoke provider leading to "Provider not found" error

Discovering the Error Message within the Error Object transmitted by NodeJS to Angular

Error: Import statement cannot be used outside a module (@cucumber/cucumber) while using Node.JS, Playwright, and Cucumber framework

AngularJS not responding to double quotes in encoded format

Expo background fetch initialized but not activated

When trying to use `slug.current` in the link href(`/product/${slug.current}`), it seems to be undefined. However, when I try to log it to the console, it is displaying correctly

What is the best way to implement Angular translation for multiple values in a typescript file, while also incorporating parameters?

Guide to accessing a URL using location services

Having trouble with ng-hide and ng-show not functioning when a radio button is clicked

Resolving route data in Angular 2 and above

Limit function parameter types to object keys

How to send a Django form using Django REST framework and AngularJS

Retrieve a single user using a query in the GraphQL platform

Challenges with flex in AngularJS's Material Design layout

AngularJS directive for handling email input with separate values for displaying the email and storing it in

What is the best way to incorporate an automatic scroll to the following section on a single page website

Avoid obtaining cookies within the TRPC environment

a feature in mongoose that automatically increments versions when creating a new document