JSFiddle - React, Tailwind, and code Playground

by davidcl64

JavaScript

var fields = ["id", "nam", "last_login"];

var User = (function () {
    function User(id, nam) {
        Object.defineProperty(this, '__', // Define property for field values   
            { value: {} }
        );

        for (var p in fields) {
            this.__[fields[p]] = undefined;
        }
        
        this.id = id;
        this.nam = nam;
    }


    (function define_fields(fields) {
        fields.forEach(function (field_name) {
            Object.defineProperty(User.prototype, field_name, {
                enumerable: true,
                get: function () {
                    return this.__[field_name];
                },
                set: function (new_value) {
                    // some business logic goes here 
                    this.__[field_name] = new_value;
                }
            });
        });
    })(fields);

    return User;
})();


var user1 = new User(1, "Thomas");
var user2 = new User(2, "John");

document.write('user2: ' + user2.id + '  ' + user2.nam + '<br/>'); // 2, John
document.write('user1: ' + user1.id + '  ' + user1.nam + '<br/>'); // 2, John

document.write('user1.__: ' + JSON.stringify(user1.__) + '<br/>');

user1.__ = 123;


document.write('user1.__: ' + JSON.stringify(user1.__) + ' Not changed !! <br/>');

document.write('Side effect that properties are not discoverable : <br/>');
document.write('&emsp;user1 keys : ' + JSON.stringify(Object.keys(user1)) + '<br/>');

document.write('&emsp;For in enumeration: <br/>');

for (var p in user1) document.write('&emsp;&emsp;' + p + ' : ' + user1[p] + '<br/>')

document.write('Properties CAN be found using the hidden __ : <br/>');
document.write('&emsp;' + JSON.stringify(user1.__) + '<br/>');
document.write('&emsp;user1.__ keys : ' + Object.keys(user1.__).join(', ') + '<br/>');

Object.keys(user1.__).forEach(function (v) {
    document.write('&emsp;&emsp;' + v + ' : ' + user1[v] + '<br/>');
});