<p dir="auto">See <a href="http://babeljs.io/repl/#?experimental=true&amp;evaluate=true&amp;loose=false&amp;spec=false&amp;playground=false&amp;code=function%20autobind%28target%2C%20key%2C%20descriptor%29%20%7B%0A%20%20var%20fn%20%3D%20descriptor.value%3B%0A%20%20delete%20descriptor.value%3B%0A%20%20delete%20descriptor.writable%3B%0A%20%20descriptor.get%20%3D%20function%20%28%29%20%7B%0A%20%20%20%20return%20this%5Bkey%5D%20%3D%20fn.bind%28this%29%3B%0A%20%20%7D%3B%0A%7D%0A%0Aclass%20Person%20%7B%0A%20%20first%20%3D%20%22Sebastian%22%3B%0A%20%20last%20%3D%20%22McKenzie%22%3B%0A%0A%20%20%40autobind%0A%20%20getFullName%28%29%20%7B%0A%20%20%20%20return%20%60%24%7Bthis.first%7D%20%24%7Bthis.last%7D%60%3B%0A%20%20%7D%0A%7D%0A%0Aconsole.log%28new%20Person%28%29.getFullName%28%29%29%3B" rel="nofollow">demo code</a> which was taken straight from the blog post.</p>
<p dir="auto">The example from <a href="http://babeljs.io/blog/2015/03/31/5.0.0/" rel="nofollow">release notes</a> is not working for me with <code class="notranslate">babel --version // 5.1.13</code></p>
<p dir="auto">.babelrc</p>
<div class="highlight highlight-source-json notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="{
    &quot;stage&quot;: 0,
    &quot;optional&quot;: [
        &quot;es7.decorators&quot;
    ]
}"><pre class="notranslate">{
    <span class="pl-ent">"stage"</span>: <span class="pl-c1">0</span>,
    <span class="pl-ent">"optional"</span>: [
        <span class="pl-s"><span class="pl-pds">"</span>es7.decorators<span class="pl-pds">"</span></span>
    ]
}</pre></div>
<p dir="auto">decorators.js</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="function concat(...args) {
  let sep = args.pop();

  return function(target, key, descriptor) {
    descriptor.initializer = function() {
      return args.map(arg =&gt; this[arg]).join(sep);
    }
  }
}

function autobind(target, key, descriptor) {
  var fn = descriptor.value;
  delete descriptor.value;
  delete descriptor.writable;
  descriptor.get = function () {
    return this[key] = fn.bind(this);
  };
}

class Person {
  firstName = &quot;Sebastian&quot;;
  lastName = &quot;McKenzie&quot;;

  @concat(&quot;firstName&quot;, &quot;lastName&quot;, &quot; &quot;) fullName;
  @concat(&quot;lastName&quot;, &quot;firstName&quot;, &quot;, &quot;) formalName;

  @autobind
  getFullName() {
    return `${this.first} ${this.last}`;
  }
}

console.log(new Person().firstName)
console.log(new Person().lastName)
console.log(new Person().fullName)
console.log(new Person().formalName)
console.log(new Person().getFullName)

assert(new Person().fullName, &quot;Sebastian McKenzie&quot;);
assert(new Person().formalName, &quot;McKenzie, Sebastian&quot;);
assert(new Person().getFullName.call(null), &quot;Sebastian McKenzie&quot;);"><pre class="notranslate"><span class="pl-k">function</span> <span class="pl-en">concat</span><span class="pl-kos">(</span>...<span class="pl-s1">args</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
  <span class="pl-k">let</span> <span class="pl-s1">sep</span> <span class="pl-c1">=</span> <span class="pl-s1">args</span><span class="pl-kos">.</span><span class="pl-en">pop</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span>

  <span class="pl-k">return</span> <span class="pl-k">function</span><span class="pl-kos">(</span><span class="pl-s1">target</span><span class="pl-kos">,</span> <span class="pl-s1">key</span><span class="pl-kos">,</span> <span class="pl-s1">descriptor</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
    <span class="pl-s1">descriptor</span><span class="pl-kos">.</span><span class="pl-en">initializer</span> <span class="pl-c1">=</span> <span class="pl-k">function</span><span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
      <span class="pl-k">return</span> <span class="pl-s1">args</span><span class="pl-kos">.</span><span class="pl-en">map</span><span class="pl-kos">(</span><span class="pl-s1">arg</span> <span class="pl-c1">=&gt;</span> <span class="pl-smi">this</span><span class="pl-kos">[</span><span class="pl-s1">arg</span><span class="pl-kos">]</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">join</span><span class="pl-kos">(</span><span class="pl-s1">sep</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
    <span class="pl-kos">}</span>
  <span class="pl-kos">}</span>
<span class="pl-kos">}</span>

<span class="pl-k">function</span> <span class="pl-en">autobind</span><span class="pl-kos">(</span><span class="pl-s1">target</span><span class="pl-kos">,</span> <span class="pl-s1">key</span><span class="pl-kos">,</span> <span class="pl-s1">descriptor</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
  <span class="pl-k">var</span> <span class="pl-s1">fn</span> <span class="pl-c1">=</span> <span class="pl-s1">descriptor</span><span class="pl-kos">.</span><span class="pl-c1">value</span><span class="pl-kos">;</span>
  <span class="pl-k">delete</span> <span class="pl-s1">descriptor</span><span class="pl-kos">.</span><span class="pl-c1">value</span><span class="pl-kos">;</span>
  <span class="pl-k">delete</span> <span class="pl-s1">descriptor</span><span class="pl-kos">.</span><span class="pl-c1">writable</span><span class="pl-kos">;</span>
  <span class="pl-s1">descriptor</span><span class="pl-kos">.</span><span class="pl-en">get</span> <span class="pl-c1">=</span> <span class="pl-k">function</span> <span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
    <span class="pl-k">return</span> <span class="pl-smi">this</span><span class="pl-kos">[</span><span class="pl-s1">key</span><span class="pl-kos">]</span> <span class="pl-c1">=</span> <span class="pl-s1">fn</span><span class="pl-kos">.</span><span class="pl-en">bind</span><span class="pl-kos">(</span><span class="pl-smi">this</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
  <span class="pl-kos">}</span><span class="pl-kos">;</span>
<span class="pl-kos">}</span>

<span class="pl-k">class</span> <span class="pl-v">Person</span> <span class="pl-kos">{</span>
  <span class="pl-c1">firstName</span> <span class="pl-c1">=</span> <span class="pl-s">"Sebastian"</span><span class="pl-kos">;</span>
  <span class="pl-c1">lastName</span> <span class="pl-c1">=</span> <span class="pl-s">"McKenzie"</span><span class="pl-kos">;</span>

  @<span class="pl-en">concat</span><span class="pl-kos">(</span><span class="pl-s">"firstName"</span><span class="pl-kos">,</span> <span class="pl-s">"lastName"</span><span class="pl-kos">,</span> <span class="pl-s">" "</span><span class="pl-kos">)</span> <span class="pl-c1">fullName</span><span class="pl-kos">;</span>
  @<span class="pl-en">concat</span><span class="pl-kos">(</span><span class="pl-s">"lastName"</span><span class="pl-kos">,</span> <span class="pl-s">"firstName"</span><span class="pl-kos">,</span> <span class="pl-s">", "</span><span class="pl-kos">)</span> <span class="pl-c1">formalName</span><span class="pl-kos">;</span>

  @<span class="pl-s1">autobind</span>
  <span class="pl-en">getFullName</span><span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
    <span class="pl-k">return</span> <span class="pl-s">`<span class="pl-s1"><span class="pl-kos">${</span><span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-c1">first</span><span class="pl-kos">}</span></span> <span class="pl-s1"><span class="pl-kos">${</span><span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-c1">last</span><span class="pl-kos">}</span></span>`</span><span class="pl-kos">;</span>
  <span class="pl-kos">}</span>
<span class="pl-kos">}</span>

<span class="pl-smi">console</span><span class="pl-kos">.</span><span class="pl-en">log</span><span class="pl-kos">(</span><span class="pl-k">new</span> <span class="pl-v">Person</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-c1">firstName</span><span class="pl-kos">)</span>
<span class="pl-smi">console</span><span class="pl-kos">.</span><span class="pl-en">log</span><span class="pl-kos">(</span><span class="pl-k">new</span> <span class="pl-v">Person</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-c1">lastName</span><span class="pl-kos">)</span>
<span class="pl-smi">console</span><span class="pl-kos">.</span><span class="pl-en">log</span><span class="pl-kos">(</span><span class="pl-k">new</span> <span class="pl-v">Person</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-c1">fullName</span><span class="pl-kos">)</span>
<span class="pl-smi">console</span><span class="pl-kos">.</span><span class="pl-en">log</span><span class="pl-kos">(</span><span class="pl-k">new</span> <span class="pl-v">Person</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-c1">formalName</span><span class="pl-kos">)</span>
<span class="pl-smi">console</span><span class="pl-kos">.</span><span class="pl-en">log</span><span class="pl-kos">(</span><span class="pl-k">new</span> <span class="pl-v">Person</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-c1">getFullName</span><span class="pl-kos">)</span>

<span class="pl-en">assert</span><span class="pl-kos">(</span><span class="pl-k">new</span> <span class="pl-v">Person</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-c1">fullName</span><span class="pl-kos">,</span> <span class="pl-s">"Sebastian McKenzie"</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
<span class="pl-en">assert</span><span class="pl-kos">(</span><span class="pl-k">new</span> <span class="pl-v">Person</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-c1">formalName</span><span class="pl-kos">,</span> <span class="pl-s">"McKenzie, Sebastian"</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
<span class="pl-en">assert</span><span class="pl-kos">(</span><span class="pl-k">new</span> <span class="pl-v">Person</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-c1">getFullName</span><span class="pl-kos">.</span><span class="pl-en">call</span><span class="pl-kos">(</span><span class="pl-c1">null</span><span class="pl-kos">)</span><span class="pl-kos">,</span> <span class="pl-s">"Sebastian McKenzie"</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div>
<p dir="auto">When after compilation <code class="notranslate">babel descriptors.js -o compiled.js</code> and running <code class="notranslate">node compiled.js</code> I'm getting the following error</p>
<div class="highlight highlight-source-shell notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="$ node scripts/compileds.js
Sebastian
McKenzie

,
/Users/marcin.kumorek/projects/es6-today/scripts/compileds.js:32
    return this[key] = fn.bind(this);
                     ^
TypeError: Cannot set property getFullName of #&lt;Person&gt; which has only a getter
    at Person.descriptor.get (/Users/marcin.kumorek/projects/es6-today/scripts/compileds.js:32:22)
    at Object.&lt;anonymous&gt; (/Users/marcin.kumorek/projects/es6-today/scripts/compileds.js:75:25)
    at Module._compile (module.js:460:26)
    at Object.Module._extensions..js (module.js:478:10)
    at Module.load (module.js:355:32)
    at Function.Module._load (module.js:310:12)
    at Function.Module.runMain (module.js:501:10)
    at startup (node.js:129:16)
    at node.js:814:3"><pre class="notranslate">$ node scripts/compileds.js
Sebastian
McKenzie

,
/Users/marcin.kumorek/projects/es6-today/scripts/compileds.js:32
    <span class="pl-k">return</span> this[key] = fn.bind(this)<span class="pl-k">;</span>
                     ^
TypeError: Cannot <span class="pl-c1">set</span> property getFullName of <span class="pl-c"><span class="pl-c">#</span>&lt;Person&gt; which has only a getter</span>
    at Person.descriptor.get (/Users/marcin.kumorek/projects/es6-today/scripts/compileds.js:32:22)
    at Object.<span class="pl-k">&lt;</span>anonymous<span class="pl-k">&gt;</span> (/Users/marcin.kumorek/projects/es6-today/scripts/compileds.js:75:25)
    at Module._compile (module.js:460:26)
    at Object.Module._extensions..js (module.js:478:10)
    at Module.load (module.js:355:32)
    at Function.Module._load (module.js:310:12)
    at Function.Module.runMain (module.js:501:10)
    at startup (node.js:129:16)
    at node.js:814:3</pre></div>
<p dir="auto">There are two issues here:</p>
<ul dir="auto">
<li>first the output from console.logs are wrong (fullName returns '' and formalName ',')</li>
<li>second the <a class="user-mention notranslate" data-hovercard-type="organization" data-hovercard-url="/orgs/autoBind/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://github.com/autoBind">@autoBind</a> is not working correctly resulting in a TypeError</li>
</ul>
<p dir="auto">I'm running <code class="notranslate">node -v0.12</code></p>