---
title: Assessores de propriedade
slug: Web/JavaScript/Reference/Operators/Property_Accessors
translation_of: Web/JavaScript/Reference/Operators/Property_Accessors
---
<div>{{jsSidebar("Operators")}}</div>

<p>Os assessores de propriedade fornecem acesso as propriedades de um objeto usando a notação de ponto ou a notação de colchetes.</p>

<h2 id="Sintaxe">Sintaxe</h2>

<pre class="syntaxbox">object.property
object["property"]
</pre>

<h2 id="Descrição">Descrição</h2>

<p><span id="result_box" lang="pt"><span>Pode-se</span> <span>pensar em</span> <span>um objeto</span> <span>como uma matriz associativa</span></span> (a.k.a. <em>map</em>, <em>dictionary</em>, <em>hash</em>, <em>lookup table</em>). As chaves nesta matriz são os nomes das propriedades dos objetos. <span id="result_box" lang="pt"><span>É típico</span> <span>quando se fala de</span> <span>propriedades de um objeto</span> <span>para fazer uma</span> <span>distinção entre</span> <span>propriedades e métodos</span></span>. No entanto, a distinção entre propriedade/método é um pouco mais do que convenção. <span id="result_box" lang="pt"><span>Um método</span> <span>é simplesmente</span> <span>uma propriedade que</span> <span>pode ser chamada</span><span>, por exemplo</span><span>, se tiver</span> <span>uma referência</span> <span>a uma instância</span> <span>de <a href="https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Functions">Function</a></span> <span>como seu valor.</span></span></p>

<p>Há duas maneira de acessar propriedades: notação de ponto ou a notação de colchetes.</p>

<h3 id="Notação_de_ponto">Notação de ponto</h3>

<pre class="brush: js">get = object.property;
object.property = set;
</pre>

<p>Neste código, a propriedade deve ser um identificador válido, i.e. uma sequência de carácteres alfanuméricos, incluíndo também o underline ("<code>_</code>") e o cifrão ("<code>$</code>"), não pode começar com um número. Por exemplo, <code>object.$1</code> é valido, enquanto <code>object.1</code> não é.</p>

<pre class="brush: js">document.createElement('pre');
</pre>

<p>Aqui, o método chamado "createElement" <span class="short_text" id="result_box" lang="pt"><span>é recuperado do</span> <span>documento e</span> <span>é chamado.</span></span></p>

<p>Se você usar um método para um literal numérico e o literal numérico não tem expoente e nenhum ponto decimal, deixar de espaço em branco antes do ponto que precede a chamada de método para evitar que o ponto seja interpretado como um ponto decimal.</p>

<pre class="brush: js">77 .toExponential();
// ou
77
.toExponential();
// ou
(77).toExponential();
// ou
77..toExponential();
// ou
77.0.toExponential();
// porque 77. === 77.0, sem ambiguidade :p</pre>

<h3 id="Notação_de_colchete">Notação de colchete</h3>

<pre class="brush: js">get = object[property_name];
object[property_name] = set;
</pre>

<p><code>property_name</code> é uma string. A string não precisa ser um identificador válido; pode ser qualquer valor, e.g. "1foo", "!bar!", ou até " " (um espaço).</p>

<pre class="brush: js">document['createElement']('pre');
</pre>

<p>Isto faz exatamente a mesma coisa que o exemplo anterior.</p>

<p>Um espaço antes da notação de colchete é permitido.</p>

<pre class="brush: js">document ['createElement']('pre');</pre>

<h3 id="Nomes_de_propriedades"><span class="short_text" id="result_box" lang="pt"><span>Nomes de propriedades</span></span></h3>

<p><span class="short_text" id="result_box" lang="pt"><span>Nomes de propriedades</span></span> devem ser strings. Isto significa que objetos não-string não podem ser usados como chave em um objeto. Qualquer objeto não-string, incluindo um número, é <span class="short_text" id="result_box" lang="pt"><span>estereotipado</span></span> como uma string pelo método <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/toString">toString</a>.</p>

<pre class="brush: js">var object = {};
object['1'] = 'value';
console.log(object[1]);
</pre>

<p>A saída é "value", desde 1 é estereotipado como '1'.</p>

<pre class="brush: js">var foo = {unique_prop: 1}, bar = {unique_prop: 2}, object = {};
object[foo] = 'value';
console.log(object[bar]);
</pre>

<p>A saída também é "value", já que ambos foo e bar são convertidos para a mesma string. No motor de Javascript <a href="/en-US/docs/Mozilla/Projects/SpiderMonkey">SpiderMonkey</a>, esta string poderia ser "['object Object']".</p>

<h3 id="Ligação_de_método">Ligação de método</h3>

<p>Um método não é limitado ao objeto de quem é metodo. Especificamente, <code>this</code> não é fixo em um método, i.e., <code>this</code> não se referece necessariamente ao objeto contendo o método. Ao invés disso, <code>this</code> é "passado" pela função call. Veja <a href="https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Operators/this#Method_binding">method binding</a>.</p>

<h3 id="Nota_sobre_eval">Nota sobre <code>eval</code></h3>

<p>Novatos em JavaScript comentem muitas vezes o erro de usar <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/eval">eval</a> onde a notação de colchete pode ser usada no lugar. Por exemplo, a sintaxe a seguir é muitas vezes vista em muitos scripts.</p>

<pre class="brush: js">x = eval('document.forms.form_name.elements.' + strFormControl + '.value');
</pre>

<p><code>eval</code> é lento e deve ser evitado sempre que possível. Também, <code>strFormControl</code> would have to hold an identifier, which is not required for names and IDs of form controls. It is better to use bracket notation instead:</p>

<pre class="brush: js">x = document.forms["form_name"].elements[strFormControl].value;
</pre>

<h2 id="Especificações">Especificações</h2>

<table class="standard-table">
 <tbody>
  <tr>
   <th scope="col">Specification</th>
   <th scope="col">Status</th>
   <th scope="col">Comment</th>
  </tr>
  <tr>
   <td>{{SpecName('ESDraft', '#sec-property-accessors', 'Property Accessors')}}</td>
   <td>{{Spec2('ESDraft')}}</td>
   <td> </td>
  </tr>
  <tr>
   <td>{{SpecName('ES6', '#sec-property-accessors', 'Property Accessors')}}</td>
   <td>{{Spec2('ES6')}}</td>
   <td> </td>
  </tr>
  <tr>
   <td>{{SpecName('ES5.1', '#sec-11.2.1', 'Property Accessors')}}</td>
   <td>{{Spec2('ES5.1')}}</td>
   <td> </td>
  </tr>
  <tr>
   <td>{{SpecName('ES1', '#sec-11.2.1', 'Property Accessors')}}</td>
   <td>{{Spec2('ES1')}}</td>
   <td>Initial definition. Implemented in JavaScript 1.0.</td>
  </tr>
 </tbody>
</table>

<h2 id="Browser_compatibility">Compatibilidade com navegadores</h2>

<p>{{CompatibilityTable}}</p>

<div id="compat-desktop">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Chrome</th>
   <th>Firefox (Gecko)</th>
   <th>Internet Explorer</th>
   <th>Opera</th>
   <th>Safari</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
  </tr>
 </tbody>
</table>
</div>

<div id="compat-mobile">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Android</th>
   <th>Chrome for Android</th>
   <th>Firefox Mobile (Gecko)</th>
   <th>IE Mobile</th>
   <th>Opera Mobile</th>
   <th>Safari Mobile</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
  </tr>
 </tbody>
</table>
</div>

<h2 id="Veja_também">Veja também</h2>

<ul>
 <li>{{jsxref("Object")}}</li>
 <li>{{jsxref("Object/defineProperty")}}</li>
</ul>