What is the method for writing private properties in JavaScript?

Traditionally, JavaScript did not have a built-in way to create truly private properties within objects or classes. Developers often used conventions like prefixing property names with an underscore (e.g., `_myPrivateProperty`) to indicate that a property should be treated as private, but this was just a naming convention; the property was still accessible from outside the object.

However, with the introduction of ES6 (ECMAScript 2015) and later ES2019 (ECMAScript 2019) there are now more robust methods for creating private properties. The most common method now uses 'Symbol' and 'WeakMaps'. Using 'Symbol', private properties can be created but they are not completely hidden because they can be exposed using Object.getOwnPropertySymbols. To overcome that and provide real private properties, 'WeakMaps' can be used.

Here's how you can achieve private properties using 'WeakMap' in JavaScript:

                            
                                class MyClass {
                                    constructor(){
                                        // Private property using WeakMap
                                        const privateData = new WeakMap();
                                        privateData.set(this,{_myPrivateProperty: "this is my private property"});
                                        this.getPrivate = () => {
                                            return privateData.get(this)._myPrivateProperty
                                        }
                                    }
                                }

                                const myInstance = new MyClass()
                                console.log(myInstance.getPrivate())
                                console.log(myInstance.privateData) // undefined
                            
                        

In this example, `privateData` is a WeakMap that stores private data associated with each instance of the `MyClass`. We use `this` as the key in the WeakMap. This approach ensures that the property is truly private, it is not accessible from outside the class, which was not possible before. Because the variable that has the private data is scoped only for the class, the data cannot be reached. If it was a simple variable inside the class, the instance could have accessed the data (e.g. using instance.privateData)

Another way to have real private properties in JavaScript is using the '#' prefix. For example: '#myPrivateProperty'.

This approach enforces that a private property is only accessible from the class in which it's defined and provides a more readable and consistent approach to private properties than the older approaches.

In summary, while conventions like underscores existed before to simulate privacy, real private properties are now made possible in JavaScript through 'WeakMaps' and '#' prefix, these are more robust solutions and provide encapsulation.

Learn more about this