aboutsummaryrefslogtreecommitdiff
path: root/files/pt-br/web/javascript/reference/operators/property_accessors
diff options
context:
space:
mode:
authorPeter Bengtsson <mail@peterbe.com>2020-12-08 14:42:52 -0500
committerPeter Bengtsson <mail@peterbe.com>2020-12-08 14:42:52 -0500
commit074785cea106179cb3305637055ab0a009ca74f2 (patch)
treee6ae371cccd642aa2b67f39752a2cdf1fd4eb040 /files/pt-br/web/javascript/reference/operators/property_accessors
parentda78a9e329e272dedb2400b79a3bdeebff387d47 (diff)
downloadtranslated-content-074785cea106179cb3305637055ab0a009ca74f2.tar.gz
translated-content-074785cea106179cb3305637055ab0a009ca74f2.tar.bz2
translated-content-074785cea106179cb3305637055ab0a009ca74f2.zip
initial commit
Diffstat (limited to 'files/pt-br/web/javascript/reference/operators/property_accessors')
-rw-r--r--files/pt-br/web/javascript/reference/operators/property_accessors/index.html189
1 files changed, 189 insertions, 0 deletions
diff --git a/files/pt-br/web/javascript/reference/operators/property_accessors/index.html b/files/pt-br/web/javascript/reference/operators/property_accessors/index.html
new file mode 100644
index 0000000000..2931effbdb
--- /dev/null
+++ b/files/pt-br/web/javascript/reference/operators/property_accessors/index.html
@@ -0,0 +1,189 @@
+---
+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="Compatibilidade_entre_navegadores">Compatibilidade entre 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>