this._helloDialog in OpenUI5 walkthrough

Question

I am new to JavaScript and OpenUI5. I was going through the walkthrough demo on the openUi5 website OpenUI5 walkthrough demo

I came through the below code:

sap.ui.define([
    "sap/ui/core/UIComponent",
    "sap/ui/model/json/JSONModel",
    "sap/ui/demo/wt/controller/HelloDialog"
], function(UIComponent, JSONModel, HelloDialog) {
    "use strict";
    return UIComponent.extend("sap.ui.demo.wt.Component", {
        metadata: {
            manifest: "json"
        },
        init: function() {
            // call the init function of the parent
            UIComponent.prototype.init.apply(this, arguments);
            // set data model
            var oData = {
                recipient: {
                    name: "World"
                }
            };
            var oModel = new JSONModel(oData);
            this.setModel(oModel);

            // set dialog
            this._helloDialog = new HelloDialog(this.getRootControl());
        },

        openHelloDialog: function() {
            this._helloDialog.open();
        }
    });
});

I have doubt in the line this._helloDialog = new HelloDialog(this.getRootControl());

If _helloDialog is not defined and we are using strict mode, then why does the system not throw message that _helloDialog is undefined?

Answer 1

_helloDialog is a property of this (the controller), and properties do not need to be initialized when creating an object.

 "use strict"
var example = {};
example.newProperty = "i am a new property"; //This is absolutely correct

undefinedVariable = 1; // This is going to throw an error

Strict mode prevents you from implicitly creating global variables (as undefinedVariable = 1; would do). But it is not going to prevent adding a property to an object.

If you are interested on preventing the creation of properties, I suggest reading Freeze vs Seal