how can a var have a value and then be unassigned in the same console.log message?

Question

I'm probably missing something obvious, I have a value which is assigned to this.theValue. Logging this value straight away shows that this.theValue has a value. Later on this value is magically undefined. If I however log the following console.log(this, this.theValue) then the first one shows that theValue exists, but this.theValue is undefined.

This is what it looks like:

/*global define, window */
define([
    'competitor/show/CompetitorLabelColours',
    'competitor/show/CompetitorLabelText'
], function(
    CompetitorLabelColours,
    CompetitorLabelText
) {
    'use strict';

    let CompetitorLabelFactory = function(parameterSet) {
        this.parameterSet = parameterSet;

        this.labeltext = new CompetitorLabelText(parameterSet);
        this.labelColours = new CompetitorLabelColours(parameterSet);

        console.log(this, this.labelText); //here none of them is undefined

        this.scale = 0.5;
        this.scaleLabel = 0.5;
        this.opacity = 0.8;
    };

    ...

    CompetitorLabelFactory.prototype.update = function (competitor, entity) {
        return {
            ...
            labelTextRefresh: () => {
                console.log(this, this.labelText); // here this.labelText is undefined
                entity.label.text = this.labelText.updateText(competitor);
            }
            ...
        }
    };

    ...

    return CompetitorLabelFactory;
});

Any ideas what I'm missing?

I have searched my entire project and this variable is never reassigned.

Answer 1

I see a case difference in the definition of labelText, you assign a value to labeltext, so it is undefined when you log it