title: Protected properties in ES6 classes (using Symbols?)
body: <p><strong>Question:</strong></p>
  
  <p>How would you implement protected properties in <code>ES6</code> classes in an elegant way? (<em>that can be accessed only from inside the child class</em>)</p>
  
  <blockquote>
    <p>I am not searching a response like "ES don't have protected/package
    properties". It is already known. I want a nice and cleaner workaround
    to emulate protected properties.</p>
  </blockquote>
  
  <p>I don't want to add <strong>security</strong>. Only a <strong>cleaner exposed interface</strong> to all the end users of the <code>API</code>. </p>
  
  <hr>
  
  <p><strong>Example:</strong></p>
  
  <p>I have the following <code>API</code>: (<em>node</em>)</p>
  
  <h2>my-class.js:</h2>
  
  <pre><code>let Symbols = {
      _secret: Symbol("_secret")
  };
  class MyClass {
      constructor() {
          this.public = "This is public";
          this[Symbols._secret] = "This is private";
      }
  }
  // Set the Symbols to a static propietry so any class can access it and extend it
  MyClass[Symbol.for("_Symbols")] = Symbols;
  module.exports = MyClass
  </code></pre>
  
  <h2>my-child-class.js:</h2>
  
  <pre><code>let MyClass = require("./my-class.js");
  
  // extends protected properties with own properties
  Symbols = Object.assign({}, MyClass[Symbol.for("_Symbols")] , {
      _childSecret = Symbol("_childSecret")
  });
  
  class MyChildClass extends MyClass {
      constructor() {
          super();
          this[Symbols._childSecret] = "This is also private";
          console.log(this[Symbols._secret]); //logs "this is private"
          console.log(this[Symbols._childSecret]); //logs "this is also private"
      }
  }
  // Set the Symbols to a static propietry so any class can access it and extend it
  MyClass[Symbol.for("_Symbols")] = Symbols;
  module.exports = MyChildClass;
  </code></pre>
  
  <p>To use the class: </p>
  
  <pre><code>let MyChildClass = require("./my-child-class.js");
  var c = new MyChildClass();
  </code></pre>
  
  <p><strong>The advantages:</strong></p>
  
  <ul>
  <li>The exposed <code>API</code> is cleaner. And the end user of the <code>API</code> can view the exposed methods.</li>
  </ul>
  
  <p><strong>The problem:</strong></p>
  
  <ul>
  <li><p>The code is "pretty" in the base class, but not that pretty in the child class. Is there any way to improve the order?</p></li>
  <li><p>Anyone that can access to <code>Symbol.for("_Symbols")</code> can access to all the protected/private properties of the API.  (<strong>EDIT:</strong> <em>I don't mind this. This is not a problem for me since if someone want to break the API accessing the internal symbols, it is they fault</em>)</p></li>
  </ul>