aboutsummaryrefslogtreecommitdiff
path: root/files/ca/learn/javascript
diff options
context:
space:
mode:
authorRyan Johnson <rjohnson@mozilla.com>2021-04-29 16:16:42 -0700
committerGitHub <noreply@github.com>2021-04-29 16:16:42 -0700
commit95aca4b4d8fa62815d4bd412fff1a364f842814a (patch)
tree5e57661720fe9058d5c7db637e764800b50f9060 /files/ca/learn/javascript
parentee3b1c87e3c8e72ca130943eed260ad642246581 (diff)
downloadtranslated-content-95aca4b4d8fa62815d4bd412fff1a364f842814a.tar.gz
translated-content-95aca4b4d8fa62815d4bd412fff1a364f842814a.tar.bz2
translated-content-95aca4b4d8fa62815d4bd412fff1a364f842814a.zip
remove retired locales (#699)
Diffstat (limited to 'files/ca/learn/javascript')
-rw-r--r--files/ca/learn/javascript/building_blocks/index.html42
-rw-r--r--files/ca/learn/javascript/client-side_web_apis/manipulating_documents/index.html148
-rw-r--r--files/ca/learn/javascript/index.html66
-rw-r--r--files/ca/learn/javascript/objects/index.html363
4 files changed, 0 insertions, 619 deletions
diff --git a/files/ca/learn/javascript/building_blocks/index.html b/files/ca/learn/javascript/building_blocks/index.html
deleted file mode 100644
index b1d2001c25..0000000000
--- a/files/ca/learn/javascript/building_blocks/index.html
+++ /dev/null
@@ -1,42 +0,0 @@
----
-title: JavaScript building blocks
-slug: Learn/JavaScript/Building_blocks
-translation_of: Learn/JavaScript/Building_blocks
----
-<div>{{LearnSidebar}}</div>
-
-<p class="summary">En aquest mòdul, continuem la nostra cobertura de totes les funcions fonamentals de JavaScript, centrant la nostra atenció en els tipus de bloc de codi que es troben sovint, com ara declaracions condicionals, bucles, funcions i esdeveniments. Ja heu vist aquestes coses al curs, però només de passada, aquí discutirem tot de manera detallada.</p>
-
-<h2 id="Prerequisits">Prerequisits</h2>
-
-<p>Abans de començar aquest mòdul, hauríeu d'estar familiaritzats amb els conceptes bàsics d'<a href="/en-US/docs/Learn/HTML/Introduction_to_HTML">HTML</a> i <a href="/en-US/docs/Learn/CSS/Introduction_to_CSS">CSS</a>, i hauireu d'haver treballat el mòdul anterior, <a href="/en-US/docs/Learn/JavaScript/First_steps">Primeres PAsses en JavaScript</a>.</p>
-
-<div class="note">
-<p><strong>Nota: </strong>Si esteu treballant en un ordinador / tauleta / altre dispositiu on no té la capacitat de crear els vostres propis fitxers, podeu provar (la majoria d') els exemples de codi en un programa de codificació en línia com ara <a href="http://jsbin.com/">JSBin</a> or <a href="https://thimble.mozilla.org/">Thimble</a>.</p>
-</div>
-
-<h2 id="Guides">Guides</h2>
-
-<dl>
- <dt><a href="/en-US/docs/Learn/JavaScript/Building_blocks/conditionals">Prenent decisions al teu codi - condicionals</a></dt>
- <dd>En qualsevol llenguatge de programació, el codi necessita prendre decisions i dur a terme accions d'acord amb els diferents inputs. Per exemple, en un joc, si el nombre de vides del jugador és 0, llavors s'acaba el joc. En una aplicació meteorològica, si es mira al matí, mostra un gràfic de la sortida del sol, però mostra estrelles i una lluna si és de nit. En aquest article explorarem com funcionen les estructures condicionals en JavaScript.</dd>
- <dt><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Looping_code">Programant bucles</a></dt>
- <dd>De vegades necessites realitzar una tasca més d'una vegada. Per exemple, mirant dins una llista de noms. En la programació, els bucles realitzen aquest treball molt bé. Aquí veurem estructures de bucle a JavaScript.</dd>
- <dt><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Functions">Funcions — blocs de codi reutilitzables</a></dt>
- <dd>Un altre concepte essencial de la programació és la funció. Les funcions us permeten emmagatzemar un fragment de codi que fa una única tasca dins d'un bloc definit, i després es crida a aquest codi quan es necessiti utilitzant un únic comandament curt, en lloc d'haver d'escriure el mateix codi diverses vegades. En aquest article explorarem conceptes fonamentals darrere de funcions com la sintaxi bàsica, com invocar i definir funcions, abast i paràmetres.</dd>
- <dt><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Build_your_own_function">Construeix la teva pròpia funció</a></dt>
- <dd>Amb la majoria de la teoria essencial tractada anteriorment, aquest article proporciona una experiència pràctica. Aquí practicareu amb la creació de la vostra pròpia funció personalitzada. Al llarg del camí, també explicarem alguns detalls útils sobre el tractament de funcions.</dd>
- <dt><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Return_values">Retorn de valors a les funcions</a></dt>
- <dd>L'últim concepte essencial que has de saber sobre una funció és el retorn de valors. Algunes funcions no retornen un valor significatiu després de la finalització, però d'altres ho fan. És important entendre quins són els seus valors, com utilitzar-los en el codi i com fer que les nostres pròpies funcions personalitzades retornin valors útils.</dd>
- <dt><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Events">Introducció als esdeveniments</a></dt>
- <dd>Els esdeveniments (Events) són accions que ocorren en el sistema que estam programant, on el sistema ens informa perquè puguem respondre d'alguna manera si ho desitjam. Per exemple, si l'usuari fa clic a un botó d'una pàgina web, potser vulgueu respondre a aquesta acció mostrant un quadre d'informació. En aquest article final anem a parlar sobre alguns conceptes importants que envolten els esdeveniments, i veure com funcionen en els navegadors.</dd>
-</dl>
-
-<h2 id="Avaluacions">Avaluacions</h2>
-
-<p>La següent avaluació comprovarà la comprensió dels aspectes bàsics de JavaScript que es detallen a les guies anteriors.</p>
-
-<dl>
- <dt><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Image_gallery">Image gallery</a></dt>
- <dd>Ara que hem examinat els fonaments bàsics de JavaScript, provarem els teus coneixements de bucles, funcions, condicionals i esdeveniments mitjançant la construcció d'un article bastant comú que veureu en molts llocs web: una galeria d'imatges amb Javascript.</dd>
-</dl>
diff --git a/files/ca/learn/javascript/client-side_web_apis/manipulating_documents/index.html b/files/ca/learn/javascript/client-side_web_apis/manipulating_documents/index.html
deleted file mode 100644
index 4250d46dea..0000000000
--- a/files/ca/learn/javascript/client-side_web_apis/manipulating_documents/index.html
+++ /dev/null
@@ -1,148 +0,0 @@
----
-title: JavaScript i CSS
-slug: Learn/JavaScript/Client-side_web_APIs/Manipulating_documents
-tags:
- - CSS
- - CSS:Getting_Started
- - Example
- - Guide
- - Intermediate
- - NeedsUpdate
- - Web
-translation_of: Learn/JavaScript/Client-side_web_APIs/Manipulating_documents
-translation_of_original: Web/Guide/CSS/Getting_started/JavaScript
-original_slug: Web/Guide/CSS/Inici_en_CSS/JavaScript
----
-<p>{{ CSSTutorialTOC() }}</p>
-
-<p>Aquesta és la primera secció de la Part II del <a href="/en/CSS/Getting_Started" title="https://developer.mozilla.org/en/CSS/Getting_Started">tutorial CSS</a>. La Part II conté alguns exemples que mostren l'abast de CSS utilitzat amb altres tecnologies web i Mozilla.</p>
-
-<p>Cada pàgina en la part II il·lustra com interactua amb CSS alguna altra tecnologia. Aquestes pàgines no estan dissenyades per ensenyar com utilitzar aquestes altres tecnologies. Aneu a altres tutorials per aprendre sobre elles en detall.</p>
-
-<p>En lloc d'això, aquestes pàgines estan dissenyades per il·lustrar els molts usos de CSS. Per utilitzar aquestes pàgines, heu de tenir algun coneixement de CSS, però no cal cap coneixement d'unes altres tecnologies.</p>
-
-<p>Secció anterior (Part I): <a href="/en/CSS/Getting_Started/Media" title="https://developer.mozilla.org/en/CSS/Getting_Started/Media">Mitjà</a><br>
- Secció següent: <a href="/en/CSS/Getting_Started/SVG_graphics" title="https://developer.mozilla.org/en/CSS/Getting_Started/SVG_graphics">SVG</a></p>
-
-<h3 id="Information:_JavaScript" name="Information:_JavaScript"><span id="result_box" lang="ca"><span>Informació</span><span>: JavaScript</span></span></h3>
-
-<p>JavaScript és un <em>llenguatge de programació</em>. JavaScript s'utilitza àmpliament per proporcionar interactivitat en els llocs web i aplicacions.</p>
-
-<p>JavaScript pot interactuar amb les fulles d'estil, permetent-li escriure programes que canvien l'estil d'un document de forma dinàmica.</p>
-
-<p>Hi ha tres maneres de fer això:</p>
-
-<ul>
- <li>Treballant amb la llista de fulles d'estil del document, per exemple: afegir, eliminar o modificar una fulla d'estil.</li>
- <li>Treballant amb les regles en una fulla d'estil, per exemple: afegir, eliminar o modificar una regla.</li>
- <li>Treballant amb un element individual en el DOM, modificant el seu estil independentment de les fulles d'estil del document.</li>
-</ul>
-
-<table style="background-color: #f4f4f4; border: 1px solid #3366bb; margin-bottom: 1em; padding: 1em; width: 100%;">
- <caption>Més detalls</caption>
- <tbody>
- <tr>
- <td>Per obtenir més informació sobre JavaScript, vegeu la pàgina de <a href="/en/JavaScript" title="en/JavaScript">JavaScript</a> en aquest wiki.</td>
- </tr>
- </tbody>
-</table>
-
-<h3 id="Action:_A_JavaScript_demonstration" name="Action:_A_JavaScript_demonstration"><span id="result_box" lang="ca"><span>Acció</span><span>:</span> <span>Una demostració</span> <span>de JavaScript</span></span></h3>
-
-<p>Feu un nou document HTML, <code>doc5.html</code>. Copieu i enganxeu el contingut d'aquí, assegurar-vos de deplaçar-vos per obtenir tota ella;</p>
-
-<div style="width: 48em;">
-<pre class="brush:html;">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-
-&lt;head&gt;
-&lt;title&gt;Mozilla CSS Getting Started - JavaScript demonstration&lt;/title&gt;
-&lt;link rel="stylesheet" type="text/css" href="style5.css" /&gt;
-&lt;script type="text/javascript" src="script5.js"&gt;&lt;/script&gt;
-&lt;/head&gt;
-
-&lt;body&gt;
-&lt;h1&gt;JavaScript sample&lt;/h1&gt;
-&lt;div id="square"&gt;&lt;/div&gt;
-&lt;button&gt;Click Me&lt;/button&gt;
-
-&lt;/body&gt;
-&lt;/html&gt;
-</pre>
-</div>
-
-<p>Feu una nova fulla d'estil CSS, <code>style5.css</code>. Copieu i enganxeu el contingut d'aquí:</p>
-
-<div style="width: 48em;">
-<pre class="brush:css;"> #square {
- width: 120px;
- height: 120px;
- border: 2px inset gray;
- margin-bottom: 1em;
- }
-
- button {
- padding: .5em 2em;
- }</pre>
-</div>
-
-<p>Feu un nou arxiu de text, <code>script5.js</code>. Copieu i enganxeu el contingut d'aquí:</p>
-
-<div style="width: 48em;">
-<pre class="brush:js;">// JavaScript demonstration
-var changeBg = function (event) {
-    console.log("method called");
-    var me = event.target
-    ,   square = document.getElementById("square");
-    square.style.backgroundColor = "#ffaa44";
-    me.setAttribute("disabled", "disabled");
-    setTimeout(function () { clearDemo(me) }, 2000);
-}
-
-function clearDemo(button) {
-    var square = document.getElementById("square");
-    square.style.backgroundColor = "transparent";
-    button.removeAttribute("disabled");
-}
-
-var button = document.querySelector("button");
-button.addEventListener("click", changeBg);
-console.log(button);
-</pre>
-</div>
-
-<p><span id="result_box" lang="ca"><span>Obriu el</span> <span>document</span> <span>en el navegador i</span> <span>premeu el</span> <span>botó</span> <span>o vegeu</span> <span>una mostra</span> <span>del treball</span> <span>a continuació.</span></span></p>
-
-<p>{{ EmbedLiveSample('Action:_A_JavaScript_demonstration', 320,320) }}</p>
-
-<div class="note"><strong>Notes importants</strong> sobre aquesta demostració:
-
-<ul>
- <li>El document HTML vincula la fulla d'estil com de costum, i també vincula  el script.</li>
- <li>L'script funciona amb elements individuals en el DOM. Modifica l'estil del cuadrat directament. Modifica l'estil del botó indirectament pel canvi d'un atribut.</li>
- <li>En JavaScript, <code>document.getElementById("square")</code> és similar en funció al selector CSS <code>#square</code>.</li>
- <li>En JavaScript, backgroundColor correspon a la propietat CSS <code>background-color</code>. JavaScript no permet guions en noms, de manera que "camelCase" s'utilitza en el seu lloc.</li>
- <li>El vostre navegador té una regla CSS incorporada per <code>button{{ mediawiki.external('disabled=\"true\"') }}</code> que canvia l'aspecte del botó quan està desactivat.</li>
-</ul>
-</div>
-
-<div class="warning">
-<p>De fet, el document HTML anterior pot tenir una condició de competència  (informació relacionada en aquesta pàgina <a href="http://www.w3.org/TR/2014/REC-html5-20141028/single-page.html#common-pitfalls-to-avoid-when-using-the-scripting-apis">W3C</a>), ja que té l'element <em>script</em> dins de l'element head podent inicar-se l'execució del codi JavaScript abans que la pàgina acabi de carregar-se i el codi no funcionarà perquè la variable <em>button</em> serà nul.la. En moure l'element <em>script</em> sota de l'element button (just damunt de l'etiqueta de tancament <em>body</em>) en el marcat HTML hauria de resoldre aquest problema.</p>
-</div>
-
-<table style="background-color: #fffff4; border: 1px solid #3366bb; margin-bottom: .5em; padding: 1em;">
- <caption>Repte</caption>
- <tbody>
- <tr>
- <td>Canvieu el script perquè el quadre salti a la dreta 20 em quan el seu color canviï, i salti cap a enrere després.</td>
- </tr>
- </tbody>
-</table>
-
-<p><a href="/en/CSS/Getting_Started/Challenge_solutions#JavaScript" title="https://developer.mozilla.org/en/CSS/Getting_Started/Challenge_solutions#JavaScript">Veure la solució per el repte.</a></p>
-
-<h3 id="I_ara_què">I ara què?</h3>
-
-<p>Si teniu dificultats per entendre aquesta pàgina o si teniu altres comentaris al respecte, si us plau, contribuïu a la vostre pàgina de <a href="https://developer.mozilla.org/Talk:en/CSS/Getting_Started/JavaScript">discussió</a>.</p>
-
-<p>En aquesta demostració, el document HTML vincula el script tot i que només l'element button utilitza el script. Mozilla estén CSS de manera que pugui vincular codi JavaScript (i també contingut i altres fulles d'estil) per als elements seleccionats. La pàgina següent mostra això: <strong><a href="https://developer.mozilla.org/en/CSS/Getting_Started/XBL_bindings">vincles XBL</a></strong></p>
diff --git a/files/ca/learn/javascript/index.html b/files/ca/learn/javascript/index.html
deleted file mode 100644
index 2e6649a258..0000000000
--- a/files/ca/learn/javascript/index.html
+++ /dev/null
@@ -1,66 +0,0 @@
----
-title: JavaScript
-slug: Learn/JavaScript
-tags:
- - Beginner
- - CodingScripting
- - JavaScript
- - JavaScripting beginner
- - Landing
- - Module
- - NeedsTranslation
- - Topic
- - TopicStub
- - 'l10n:priority'
-translation_of: Learn/JavaScript
----
-<div>{{LearnSidebar}}</div>
-
-<p class="summary">{{Glossary("JavaScript")}} is a programming language that allows you to implement complex things on web pages. Every time a web page does more than just sit there and display static information for you to look at — displaying timely content updates, or interactive maps, or animated 2D/3D graphics, or scrolling video jukeboxes, and so on — you can bet that JavaScript is probably involved.</p>
-
-<h2 id="Learning_pathway">Learning pathway</h2>
-
-<p>JavaScript is arguably more difficult to learn than related technologies such as <a href="/en-US/docs/Learn/HTML">HTML</a> and <a href="/en-US/docs/Learn/CSS">CSS</a>. Before attempting to learn JavaScript, you are strongly advised to get familiar with at least these two technologies first, and perhaps others as well. Start by working through the following modules:</p>
-
-<ul>
- <li><a href="/en-US/docs/Learn/Getting_started_with_the_web">Getting started with the Web</a></li>
- <li><a href="/en-US/docs/Web/Guide/HTML/Introduction">Introduction to HTML</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Introduction_to_CSS">Introduction to CSS</a></li>
-</ul>
-
-<p>Having previous experience with other programming languages might also help.</p>
-
-<p>After getting familiar with the basics of JavaScript, you should be in a position to learn about more advanced topics, for example:</p>
-
-<ul>
- <li>JavaScript in depth, as taught in our <a href="/en-US/docs/Web/JavaScript/Guide">JavaScript guide</a></li>
- <li><a href="/en-US/docs/Web/API">Web APIs</a></li>
-</ul>
-
-<h2 id="Modules">Modules</h2>
-
-<p>This topic contains the following modules, in a suggested order for working through them.</p>
-
-<dl>
- <dt><a href="/en-US/docs/Learn/JavaScript/First_steps">JavaScript first steps</a></dt>
- <dd>In our first JavaScript module, we first answer some fundamental questions such as "what is JavaScript?", "what does it look like?", and "what can it do?", before moving on to taking you through your first practical experience of writing JavaScript. After that, we discuss some key JavaScript features in detail, such as variables, strings, numbers and arrays.</dd>
- <dt><a href="/en-US/docs/Learn/JavaScript/Building_blocks">JavaScript building blocks</a></dt>
- <dd>In this module, we continue our coverage of all JavaScript's key fundamental features, turning our attention to commonly-encountered types of code block such as conditional statements, loops, functions, and events. You've seen this stuff already in the course, but only in passing — here we'll discuss it all explicitly.</dd>
- <dt><a href="/en-US/docs/Learn/JavaScript/Objects">Introducing JavaScript objects</a></dt>
- <dd>In JavaScript, most things are objects, from core JavaScript features like strings and arrays to the browser APIs built on top of JavaScript. You can even create your own objects to encapsulate related functions and variables into efficient packages. The object-oriented nature of JavaScript is important to understand if you want to go further with your knowledge of the language and write more efficient code, therefore we've provided this module to help you. Here we teach object theory and syntax in detail, look at how to create your own objects, and explain what JSON data is and how to work with it.</dd>
- <dt><a href="/en-US/docs/Learn/JavaScript/Client-side_web_APIs">Client-side web APIs</a></dt>
- <dd>When writing client-side JavaScript for web sites or applications, you won't go very far before you start to use APIs — interfaces for manipulating different aspects of the browser and operating system the site is running on, or even data from other web sites or services. In this module we will explore what APIs are, and how to use some of the most common APIs you'll come across often in your development work. </dd>
-</dl>
-
-<h2 id="Solving_common_JavaScript_problems">Solving common JavaScript problems</h2>
-
-<p><a href="/en-US/docs/Learn/JavaScript/Howto">Use JavaScript to solve common problems</a> provides links to sections of content explaining how to use JavaScript to solve very common problems when creating a webpage.</p>
-
-<h2 id="See_also">See also</h2>
-
-<dl>
- <dt><a href="/en-US/docs/Web/JavaScript">JavaScript on MDN</a></dt>
- <dd>The main entry point for core JavaScript documentation on MDN — this is where you'll find extensive reference docs on all aspects of the JavaScript language, and some advanced tutorials aimed at experienced JavaScripters.</dd>
- <dt><a href="https://www.youtube.com/user/codingmath">Coding math</a></dt>
- <dd>An excellent series of video tutorials to teach the math you need to understand to be an effective programmer, by <a href="https://twitter.com/bit101">Keith Peters</a>.</dd>
-</dl>
diff --git a/files/ca/learn/javascript/objects/index.html b/files/ca/learn/javascript/objects/index.html
deleted file mode 100644
index 299d0c2bd3..0000000000
--- a/files/ca/learn/javascript/objects/index.html
+++ /dev/null
@@ -1,363 +0,0 @@
----
-title: Introducció al Javascript orientat a Objectes
-slug: Learn/JavaScript/Objects
-translation_of: Learn/JavaScript/Objects
-translation_of_original: Web/JavaScript/Introduction_to_Object-Oriented_JavaScript
-original_slug: Web/JavaScript/Introducció_al_Javascript_orientat_a_Objectes
----
-<div>{{jsSidebar("Introductory")}}</div>
-
-<p>JavaScript és orientat a objectes des del nucli, amb unes capacitats potents, flexibles {{Glossary("OOP")}}. Aquest article comença amb la introducció de la programació orientada a objectes, després es revisa el model d'objectes de Javascript, i finalment es mostren els conceptes de la programació orientada a objectes en JavaScript.</p>
-
-<h2 id="JavaScript_Review" name="JavaScript_Review">Revisió de JavaScript</h2>
-
-<p>Si no us sentiu segurs amb els conceptes de Javascript com ara variables, tipus, funcions, i àmbits podeu llegir sobre aquests temes en <a href="/en-US/docs/Web/JavaScript/A_re-introduction_to_JavaScript">Una reintroducció a JavaScript</a>. També podeu consultar la <a href="/en-US/docs/Web/JavaScript/Guide">Guia de JavaScript</a>.</p>
-
-<h2 id="Object-oriented_programming" name="Object-oriented_programming">Programació orientada a Objectes</h2>
-
-<p>La programació orientada a Objectes és un paradigma de programació que usa l'abstracció per crear models basants en el món real. Fa servir diverseses tècniques de paradigmes previament establerts, inclosa la modularitat, poliformisme, i l'encapsulament. Avui, moltes llengües de programació (com Java, JavaScript, C#, C++, Python, PHP, Ruby i Objective-C) suporten la programació orientada a Objectes (POO).</p>
-
-<p>La programació orientada a Objectes es pot entendre com el disseny de software fent servir una col·lecció d'objectes que cooperen, al contrari de la visió tradicional en el qual un programa es vist com una col·lecció de funcions, o simplement com una llista d'instruccions per a un ordinador. En POO, cada objecte és capaç de rebre missatges, processar data, i enviar missatges a altres objectes. Cada objecte pot ser entès com una petita màquina independent amb un rol diferent o amb responsabilitat.</p>
-
-<p>La programació orientada a Objectes intenta promoure una major flexibilitat, mantenibilitat en programació, i és àmpliament popular en enginyeria de software a gran esala. En virtut de la seva forta èmfasi en modularitat, el codi orientat a objecte intenta ser més simple de desenvolupar i més facil d'entendre després, es presta a una anàlisi més directa, codificació, i comprensió de situacions complexes i procediments en comptes d'altres mètodes de programació menys modulars.<a href="#cite-1"><sup>1</sup></a></p>
-
-<h2 id="Terminology" name="Terminology">Terminologia</h2>
-
-<dl>
- <dt>{{Glossary("Namespace")}}</dt>
- <dd>Un contenidor que permet als desenvolupadors agrupar totes les funcionalitats sota un nom únic d'aplicació específica.</dd>
- <dt>{{Glossary("Class")}}</dt>
- <dd>Defineix les característiques de l'objecte. És la definició d'una plantilla de variables i mètodes d'un objecte.</dd>
- <dt>{{Glossary("Object")}}</dt>
- <dd>Una instància d'una classe.</dd>
- <dt>{{Glossary("Property")}}</dt>
- <dd>Una característca d'un objecte, com ara un color.</dd>
- <dt>{{Glossary("Method")}}</dt>
- <dd>Una capacitat d'un objecte, com ara caminar. És una subrutina o funció associada amb una classe.</dd>
- <dt>{{Glossary("Constructor")}}</dt>
- <dd>Un mètode que es crida en el moment d'instanciació d'un objecte. Normalment té el mateix nom que el de la classe que el conté.</dd>
- <dt>{{Glossary("Inheritance")}}</dt>
- <dd>Una classe pot heretar les característiques d'una altra classe.</dd>
- <dt>{{Glossary("Encapsulation")}}</dt>
- <dd>Una manera d'agrupar les dades i mètodes que es fan servir juntes.</dd>
- <dt>{{Glossary("Abstraction")}}</dt>
- <dd>La conjunció d'una herència complexa, mètodes, les propietats d'un objecte, han de ser capaces de simular una realitat a modelar.</dd>
- <dt>{{Glossary("Polymorphism")}}</dt>
- <dd>Poli significa "<em>molts</em>" i morfisme significa "<em>formes</em>". Classes diferents poden definir el mateix mètode o propietat.</dd>
-</dl>
-
-<p>Per una descripció més extensa sobre la programació orientada a objectes vegeu {interwiki("wikipedia", "Object-oriented programming")}} a la Viquipèdia.</p>
-
-<h2 id="Programació_basada_en_prototipus">Programació basada en prototipus</h2>
-
-<p>Programació basat en prototipus és un estil de programació orientada a objectes que no fa ús de les classes. En el seu lloc, la reutilització del comportament (conegut com a herència en llenguatges basats en classes) es porta a terme a través d'un procés de decoració (o d'ampliació) on els objectes que ja existeixen serveixen com a prototipus. Aquest model també és conegut com a model sense classes, orientat a prototip, o programació basadad en instàncies.</p>
-
-<p>L'exemple original (i més canònic) d'un llenguatge basat en prototipus és el llenguatge de programació {{interwiki("wikipedia", "Self (programming language)", "Self")}} desenvolupat per David Ungar i Randall Smith. Tanmateix, l'estil de programació sense classes s'ha anat fent més i més popular, i ha sigut adoptat per llenguatges de programació com JavaScript, Cecil, NewtonScript, Io, MOO, REBOL, Kevo, Squeak (quan s'utilitza el marc Viewer per manipular components Morphic), i altres.<a href="#cite-1"><sup>1</sup></a></p>
-
-<h2 id="JavaScript_Object_Oriented_Programming" name="JavaScript_Object_Oriented_Programming">Programació orientada a Objectes de JavaScript</h2>
-
-<h3 id="Namespace">Namespace</h3>
-
-<p>Un namespace és un contenidor el qual permet als desenvolupadors agrupar totes les funcionalitats sota un únic, nom d'aplicació específic. <strong>En JavaScript un namespace és només un altre objecte que conté mètodes, propietats, i objectes.</strong></p>
-
-<div class="note">
-<p><strong>Nota:</strong> Es important remarcar que en JavaScript, no hi ha diferèn<u>cia de nivell d'idioma entre els objectes regulars i els namespace</u>s. Això dista d'altres llenguatges orientats a objectes, i pot resultat confús als programadors nous en JavaScript.</p>
-</div>
-
-<p>La idea darrera la creació d'un namespace en JavaScript és simple: Un objecte global és creat i totes les variables, metòdes, i funcions es converteixen en propietats d'aquest objecte.<u> L'ús de namespaces també minimitza la possibilitat de conflictes de noms en l'aplicació, ja que cada objecte d'aplicació son propietats d'un objecte global d'aplicació definit</u>.</p>
-
-<p>Creem un objecte global anomenat MYAPP:</p>
-
-<pre class="brush: js">// global namespace
-var MYAPP = MYAPP || {};</pre>
-
-<p>En el codi de mostra superior, primer hem comprovat si MYAPP ja està definit (ja sigui en el mateix arxiu o en un altre arxiu). En cas de ser així, s'usa l'objecte global MYAPP existent, del contrari es crea un objecte buit anomenat MYAPP el qual encapsula el mètode, funcions, variables, i objectes.</p>
-
-<p>També podem crear sub-namespaces:</p>
-
-<pre class="brush: js">// sub namespace
-MYAPP.event = {};</pre>
-
-<p>Abaix es troba la sintaxi de codi per crear un namespace i afegir variables, funcions, i un mètode:</p>
-
-<pre class="brush: js">// Create container called MYAPP.commonMethod for common method and properties
-MYAPP.commonMethod = {
- regExForName: "", // define regex for name validation
- regExForPhone: "", // define regex for phone no validation
- validateName: function(name){
- // Do something with name, you can access regExForName variable
- // using "this.regExForName"
- },
-
- validatePhoneNo: function(phoneNo){
- // do something with phone number
- }
-}
-
-// Object together with the method declarations
-MYAPP.event = {
- addListener: function(el, type, fn) {
- // code stuff
- },
- removeListener: function(el, type, fn) {
- // code stuff
- },
- getEvent: function(e) {
- // code stuff
- }
-
- // Can add another method and properties
-}
-
-// Syntax for Using addListener method:
-MYAPP.event.addListener("yourel", "type", callback);</pre>
-
-<h3 id="Core_Objects" name="Core_Objects">Objectes estàndards integrats</h3>
-
-<p>JavaScript té alguns objectes inclosos en el seu nucli, per exemple, trobem objectes come Math, Object, Array, i String. L'exemple d'abaix ens mostra com fer servir l'objecte Math per aconseguir números aleatoris usant el seu mètode <code>random()</code>.</p>
-
-<pre class="brush: js">console.log(Math.random());
-</pre>
-
-<div class="note"><strong>Nota:</strong> Aquest i tots els exemples següents suposen que la funció anomenada {{domxref("console.log()")}} es defineix globalment. De fet, la funció <code>console.log()</code> no és part del llenguatge de JavaScript en si, però molts navegadors ho implementen per tal d'ajudar en la depuració.</div>
-
-<p>Vegeu <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects" title="en-US/docs/Web/JavaScript/Reference/Global_Objects">Referència de JavaScript: Objectes estàndards integrats</a> per una llista d'objectes cor en JavaScript.</p>
-
-<p>Cada objecte en JavaScript és una instància de l'objecte <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object"><code>Object</code></a> i per tant, n'hereda totes les seves propietats i mètodes.</p>
-
-<h3 id="Custom_Objects" name="Custom_Objects">Objectes personalitzats</h3>
-
-<h4 id="The_Class" name="The_Class">La classe</h4>
-
-<p>JavaScript és un llenguatge basat en prototipus que no conté<u> cap <code>class</code> statement, </u>el qual si que es pot trobar en C++ o Java. Això és confós a vegades per a programadors acostumats a llenguatges amb el <u><code>class</code> statement.</u> En el seu lloc, JavaScript fa servir funcions com a classes. Definir duna classe és tan fàcil com definir una funció. En l'exemple d'abaix definim una nova classe anomenada Person.</p>
-
-<pre class="brush: js">var Person = function () {};
-</pre>
-
-<h4 id="The_Object_.28Class_Instance.29" name="The_Object_.28Class_Instance.29">L'objecte (instància de classe)</h4>
-
-<p>Per crear una nova instància d'un objecte <code>obj</code> fem servir la declaració <code>new obj</code>, assignant el resultat (el qual és de tipus <code>obj</code>) a una variable per accedir-hi més tard. <span style="font-size: 14px; line-height: 1.5;">Una forma alternativa de crear una nova instància és fent servir {{jsxref("Object.create()")}}. Aquesta crearà una instància This will create an <u>uninititalized instance.</u></span></p>
-
-<p>En l'exemple d'adalt definim una classe anomenada <code>Person</code>. En l'exemple següent creem dues instàncies (<code>person1</code> i <code>person2</code>).</p>
-
-<pre class="brush: js">var person1 = new Person();
-var person2 = new Person();
-</pre>
-
-<div class="note"><strong>Nota:</strong> Siusplau vegeu {{jsxref("Object.create()")}} per un mètode instantacional nou, addiccional new, additional, instantiation mètode.</div>
-
-<h4 id="The_Constructor" name="The_Constructor">El constructor</h4>
-
-<p>El constructor és cridat en el moment de la instantiation (el moment en que la instància de l'objecte és creat). El constructor és ún mètode de la classe. En JavaScript la funció serveix com el constructor de l'objecte, therefore there is no need to explicitly define a constructor method. Every action declared in the class gets executed at the time of instantiation.</p>
-
-<p>El constructor es fa servir per establir les propietats de l'objecte o per cridar mè call methods to prepare the object for use. Per afegir mètodes de classes i les seves definicions es necessita una sintaxi diferent que s'explicarà més tard en aquest article.</p>
-
-<p>En l'exemple d'abaix, el constructor de la classe <code>Person</code> mostra un missatge quan és crea una instànca <code>Person</code>.</p>
-
-<pre class="brush: js">var Person = function () {
- console.log('instance created');
-};
-
-var person1 = new Person();
-var person2 = new Person();
-</pre>
-
-<h4 id="The_Property_.28object_attribute.29" name="The_Property_.28object_attribute.29">La propietat (atribut de l'objecte)</h4>
-
-<p>Les propietats són variables contingudes en la classe; cada instància de l'objecte té aquestes propietats. Les propietats són asssignades en el constructor (funció) de la classe de forma que es creen en cada instància.</p>
-
-<p>Per treballar amb propietats de dins de la classe s'utilitza la paraula clau <code>this</code>, que fa referència a l'objecte actual. Accedir (llegir o escriure) a una propietat fora d'aquesta classe es fa mitjançant la sintaxi: <code>InstanceName.Property</code>; Aquesta és la mateixa sintaxi que es fa servir en C++, Java, i numeroses altres llengües. (Dins la classe, la sintaxi <code>this.Property</code> s'utilitza per obtindre o escriure el valor de les propietats.)</p>
-
-<p>En l'exemple següent definim la propietat <code>firstName</code> property per la classe <code>Person</code> i ho definim com a instanciació.</p>
-
-<pre class="brush: js">var Person = function (firstName) {
- this.firstName = firstName;
- console.log('Person instantiated');
-};
-
-var person1 = new Person('Alice');
-var person2 = new Person('Bob');
-
-// Show the firstName properties of the objects
-console.log('person1 is ' + person1.firstName); // logs "person1 is Alice"
-console.log('person2 is ' + person2.firstName); // logs "person2 is Bob"
-</pre>
-
-<h4 id="The_methods" name="The_methods">Els mètodes</h4>
-
-<p>Els mètodes segueixen la mateixa llògica que les propietats; la diferència es que són funcions i estan definides com a funcions. Cridar un mètode és similar a accedir a una propietat, però s'afegeix <code>()</code> al final the nom del mètode, possiblement amb arguments. Per definir un mètode, s'assigna una funció a una propietat amb nom de la propietat de la classe <code>prototype</code>; el nom que s'assigna a la funció és el mateix que el nom que té el mètode en l'objecte.</p>
-
-<p>En l'exemple següent definim i usem el mètode <code>sayHello()</code> per la classe <code>Person</code>.</p>
-
-<pre class="brush: js">var Person = function (firstName) {
- this.firstName = firstName;
-};
-
-Person.prototype.sayHello = function() {
- console.log("Hello, I'm " + this.firstName);
-};
-
-var person1 = new Person("Alice");
-var person2 = new Person("Bob");
-
-// call the Person sayHello method.
-person1.sayHello(); // logs "Hello, I'm Alice"
-person2.sayHello(); // logs "Hello, I'm Bob"
-</pre>
-
-<p>En JavaScript els mètodes són funcions normals dels objectes que són lligats a un objecte com una propietat, El que vol dir que poden ser invocats "fora del context". Vegeu el codi d'exemple següent:</p>
-
-<pre class="brush: js">var Person = function (firstName) {
- this.firstName = firstName;
-};
-
-Person.prototype.sayHello = function() {
- console.log("Hello, I'm " + this.firstName);
-};
-
-var person1 = new Person("Alice");
-var person2 = new Person("Bob");
-var helloFunction = person1.sayHello;
-
-// logs "Hello, I'm Alice"
-person1.sayHello();
-
-// logs "Hello, I'm Bob"
-person2.sayHello();
-
-// logs "Hello, I'm undefined" (or fails
-// with a TypeError in strict mode)
-helloFunction();
-
-// logs true
-console.log(helloFunction === person1.sayHello);
-
-// logs true
-console.log(helloFunction === Person.prototype.sayHello);
-
-// logs "Hello, I'm Alice"
-helloFunction.call(person1);</pre>
-
-<p>Com l'exemple mostra, totes les referències a la funció <code>sayHello</code> — les que existeixen a <code>person1</code>, a <code>Person.prototype</code>, a la variable <code>helloFunction</code>, etc. — fan referència a la <em>mateixa funció</em>. El valor de <code>this</code> durant una crida a la funció depen en com es crida. En el cas comú en que es crida la funció des d'una propietat de l'objecte — <code>person1.sayHello()</code> — <code>this</code> rep el valor de l'objecte d'on prové la propietat (<code>person1</code>), és per això que <code>person1.sayHello()</code> fa servir el nom "Alice" i <code>person2.sayHello()</code> fa servir el nom "Bob". Però si ho cridem d'altres maneres, <code>this</code> rebrà un valor diferent: Cridar-la des d'una variable — <code>helloFunction()</code> — <code>this</code> rep el valor de l'objecte global (<code>window</code>, en navegadors). Al no tenir la propietat <code>firstName aquest </code>objecte (probablement) , acabem amb el resultat "Hello, I'm undefined". (Això és en el mode no estricte; en el <a href="/en-US/docs/Web/JavaScript/Reference/Strict_mode" title="/en/docs/Web/JavaScript/Reference/Functions_and_function_scope/Strict_mode">mode estricte </a>seria diferent [un error], però per evitar confussions no entrarem aquí en detall.) O podem assignar explícitament el valor de <code>this</code> mitjançant <code>Function#call</code> (o <code>Function#apply</code>), com es mostra al final de l'exemple.</p>
-
-<div class="note"><strong>Nota:</strong> Vegeu més sobre <code>this</code> a <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/call" title="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Function/call">Function#call</a> i <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/apply" title="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Function/apply">Function#apply</a></div>
-
-<h4 id="Inheritance" name="Inheritance">L'herència</h4>
-
-<p>L'herència és una manera de crear una classe com una versió especialitzada d'una o més classes (<em>JavaScript només suporta l'herència única</em>). La classe especialitzada és communment anomenada el <em>fill</em>, i l'altra classe es comunment anomenada el <em>pare</em>. En JavaScript això s'aconsegueix mitjançant l'assignació d'una instància de la classe pare a la classe fill, i després s'especialitza. En navegadors moderns també es pot usar <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/create#Classical_inheritance_with_Object.create" title="/en-US/docs/JavaScript/Reference/Global_Objects/Object/create#Classical_inheritance_with_Object.create">Object.create</a> per implementar herències.</p>
-
-<div class="note">
-<p><strong>Nota:</strong> JavaScript does no detecta la classe fill <code>prototype.constructor</code> (vegeu <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/prototype">Object.prototype</a>), així que ho hem de declarar manualment.</p>
-</div>
-
-<p>En l'exemple d'abaix, definim la classe <code>Student</code> com una classe fill de <code>Person</code>. Després redefinim el mètode <code>sayHello()</code> i afegim el mètode <code>sayGoodBye()</code>.</p>
-
-<pre class="brush: js">// Define the Person constructor
-var Person = function(firstName) {
- this.firstName = firstName;
-};
-
-// Add a couple of methods to Person.prototype
-Person.prototype.walk = function(){
- console.log("I am walking!");
-};
-
-Person.prototype.sayHello = function(){
- console.log("Hello, I'm " + this.firstName);
-};
-
-// Define the Student constructor
-function Student(firstName, subject) {
- // Call the parent constructor, making sure (using Function#call)
- // that "this" is set correctly during the call
- Person.call(this, firstName);
-
- // Initialize our Student-specific properties
- this.subject = subject;
-};
-
-// Create a Student.prototype object that inherits from Person.prototype.
-// Note: A common error here is to use "new Person()" to create the
-// Student.prototype. That's incorrect for several reasons, not least
-// that we don't have anything to give Person for the "firstName"
-// argument. The correct place to call Person is above, where we call
-// it from Student.
-Student.prototype = Object.create(Person.prototype); // See note below
-
-// Set the "constructor" property to refer to Student
-Student.prototype.constructor = Student;
-
-// Replace the "sayHello" method
-Student.prototype.sayHello = function(){
- console.log("Hello, I'm " + this.firstName + ". I'm studying "
- + this.subject + ".");
-};
-
-// Add a "sayGoodBye" method
-Student.prototype.sayGoodBye = function(){
- console.log("Goodbye!");
-};
-
-// Example usage:
-var student1 = new Student("Janet", "Applied Physics");
-student1.sayHello(); // "Hello, I'm Janet. I'm studying Applied Physics."
-student1.walk(); // "I am walking!"
-student1.sayGoodBye(); // "Goodbye!"
-
-// Check that instanceof works correctly
-console.log(student1 instanceof Person); // true
-console.log(student1 instanceof Student); // true
-</pre>
-
-<p>Pel que fa a la línia <code>Student.prototype = Object.create(Person.prototype)</code>: En els motors de Javascript més antics sense <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/create" title="Object.create"><code>Object.create</code></a>, es pot utilitzar tant un "polyfill" (també conegut com a  "falca", vegeu l'article enllaçat), o fer servir una funció que aconegueixi assolir el mateix resultat, tal com:</p>
-
-<pre class="brush: js">function createObject(proto) {
- function ctor() { }
- ctor.prototype = proto;
- return new ctor();
-}
-
-// Usage:
-Student.prototype = createObject(Person.prototype);
-</pre>
-
-<div class="note"><strong>Nota:</strong> Vegeu <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/create" title="Object.create">Object.create</a> per més informació sobre el que fa, i una falca per a motors més vells.</div>
-
-<h4 id="Encapsulation" name="Encapsulation">L'encapsulació</h4>
-
-<p>En l'exemple anterior, <code>Student</code> no necessita saber com el mètode <code>Person</code> class's <code>walk()</code> és implementat, però tot i així pot fer-lo servir com a mètode; la classe <code>Student</code>no necessita definir explícitament aquest mètode a no ser que ho volguem canviar. D'això se'n diu <strong>encapsulació</strong>, per la qual cada classe empaqueta data i mètodes en una sola unitat.</p>
-
-<p>L'ocultació d'informació és una característica comuna en altres llenguatges sovint com a mètodes/propietats privats i protegits. Tot i que es podria simular alguna cosa com aquesta en JavaScript, no és un requeriment per fer programació orientada a objectes.<a href="#cite-2"><sup>2</sup></a></p>
-
-<h4 id="Abstraction" name="Abstraction">L'abstracció</h4>
-
-<p>L'abstracció és un mecanisme que permet modelar la part que ens ocupa del problema en el qual estem treballant. Això es pot aconseguir per mitjar de l'herència (especialització), o composició. JavaScript aconsegueix l'especialització per mitjà de l'herència, i la composició per mitjà de deixar a les instàncies de classes ser valors d'atributs d'altres objectes.</p>
-
-<p>La classe Function de JavaScript hereta de la classe Object (això demostra la especialització del model) i la propietat Function.prototype property és una instància d'Object (Això demostra composició).</p>
-
-<pre class="brush: js">var foo = function () {};
-
-// logs "foo is a Function: true"
-console.log('foo is a Function: ' + (foo instanceof Function));
-
-// logs "foo.prototype is an Object: true"
-console.log('foo.prototype is an Object: ' + (foo.prototype instanceof Object));</pre>
-
-<h4 id="Polymorphism" name="Polymorphism">El polimorfisme</h4>
-
-<p>Tal i com tots els mètodes i propietats són definides dins la propietat Prototype, classes diferents poden definir mètodes amb el mateix nom; els mètodes estan en l'àmbit de la classe en la qual estan definits. Això només és cert quan les dues classes no tenen una relació pare-fill (quan un no hereta de l'altre en una cadena d'herència).</p>
-
-<h2 id="Notes" name="Notes">Notes</h2>
-
-<p>Les tècniques presentades en aquesta article per implementar programació orientada a objectes no són les úniques que es poden fer servir en JavaScript, que és molt flexible en termes de com es pot realitzar la programació orientada a objectes.</p>
-
-<p>De la mateixa manera, les tècniques que s'han mostrat aquí no utilitzen cap <em>hack</em> del llenguatge, ni imiten cap implementació de teories d'objectes d'altres llenguatges.</p>
-
-<p>Hi ha altres tècniques que proporcionen programació orientada a objectes més avançada en JavaScript, però aquests estan fora de l'abast d'aquest article introductori.</p>
-
-<h2 id="References" name="References">Referències</h2>
-
-<ol>
- <li><a name="cite-1"></a>Viquipèdia. "<a href="http://ca.wikipedia.org/wiki/Programaci%C3%B3_orientada_a_objectes">Programació orientada a Objectes</a>"</li>
- <li><a name="cite-2"></a>Viquipèdia. "<a href="http://ca.wikipedia.org/wiki/Encapsulaci%C3%B3">Encapsulació (programació orientada a Objectes)</a>"</li>
-</ol>