Are ES6 class private properties just syntactic sugar?

Using the # syntax we are able now to create private properties in ES6 classes like this:

class Person {
    #name;
    constructor(name) {
        this.#name = name;
    }
    getName() { return this.#name; }
}

let ron = new Person('ron')
ron.#name // undefined
ron.getName(); // ron

Previously, in ES5, private properties can be hardly ‘faked’ in the following way:

function Person(name) {
  var name = name;
  this.getName = function() {
    return name;
  }
}
(new Person('ron')).name // undefined
(new Person('ron')).getName() // ron

the above version is using the fact ‘var’ will not belong to ‘this’ of instances of Person. And so using the power of ‘closure’ getName has access to ‘name’. However, the problem with this is that this.getName() is not a part of the prototype chain so in order to add getName to the prototype we will have to do:

Person.prototype.getName = function() { return this.getName(); }

which is confusing and is smelling pretty bad.

another option is to do: (using ES6 symbols and still not using classes)

function Person(name) {
  const nameSymbol = Symbol();
  this[nameSymbol] = name;
  this.getName = function() {
    return this[nameSymbol];
  }
}

but still not solving the problem that getName is not a part of the prototype. Another problem is that using Object.getOwnPropertySymbols, this ‘fake’ private member is accessible.

another es5 option will be to use the ‘Revleaing module pattern’ and exposing a publicAPI like this:

const myEs5Module = (function () { 
  var _name = 'yos';
  function getName() {
    return _name;
  }
  const publicAPI = { getname };
  return publicAPI;
})();

but that is not a class or a constructor function, it’s more like a module.

So I would like to understand if ‘#’ syntax for private properties in ES6 classes is syntactic sugar and can be polyfilled in some way for function lovers like myself.

BTW: I read posts like the following: Private properties in JavaScript ES6 classes and still feel unsatisfied. also NOTE: I am not looking for ES6 modules / babel solution

Answer

Are ES6 class private properties just syntactic sugar?

No. They’re a fundamental addition to how objects work at an internal level. Private fields (as they’re called) are held in new slots in the object that didn’t exist before the proposal and are not accessible in other ways.

So I would like to understand if ‘#’ syntax for private properties in ES6 classes is syntactic sugar and can be polyfilled in some way for function lovers like myself.

You can’t use private properties without class syntax. (Future proposals may change that.) Instead, you’d have to keep doing what you’re doing (the closure solution) or use a WeakMap only your functions have access to keyed by the object the properties relate to.

You’ve done your own closure examples, so here’s your Person class using the WeakMap approach instead of private properties:

const Person = (() => {
    const names = new WeakMap();
    function Person(name) {
        names.set(this, name);
    }
    Person.prototype.getName = function getName() {
        return names.get(this);
    };
    return Person;
})();

let ron = new Person("ron")
console.log(ron.name);      // undefined
console.log(ron.getName()); // "ron"