{"componentChunkName":"component---src-templates-post-js","path":"/pt/blog/linguagem-javascript","webpackCompilationHash":"1ba5a575cf0ff20ad142","result":{"data":{"markdownRemark":{"frontmatter":{"title":"Linguagem JavaScript - Exemplos de códigos usando PrismJS","description":"JavaScript, frequentemente abreviado como JS, é uma linguagem de script interpretada de alto nível que está em conformidade com a especificação ECMAScript.","image":"/assets/img/05.jpg"},"html":"<p>JavaScript (/ ˈdʒɑːvəˌskrɪpt /), geralmente abreviado como JS, é uma linguagem de script interpretada de alto nível que está em conformidade com a especificação ECMAScript. O JavaScript possui sintaxe entre colchetes, digitação dinâmica, orientação a objetos com base em protótipo e funções de primeira classe.</p>\n<p>Hello World:</p>\n<div class=\"gatsby-highlight\" data-language=\"js\"><pre class=\"language-js\"><code class=\"language-js\">console<span class=\"token punctuation\">.</span><span class=\"token function\">log</span><span class=\"token punctuation\">(</span><span class=\"token string\">\"Hello World!\"</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span></code></pre></div>\n<p>A simple recursive function:</p>\n<div class=\"gatsby-highlight\" data-language=\"js\"><pre class=\"language-js\"><code class=\"language-js\"><span class=\"token keyword\">function</span> <span class=\"token function\">factorial</span><span class=\"token punctuation\">(</span><span class=\"token parameter\">n</span><span class=\"token punctuation\">)</span> <span class=\"token punctuation\">{</span>\n    <span class=\"token keyword\">if</span> <span class=\"token punctuation\">(</span>n <span class=\"token operator\">===</span> <span class=\"token number\">0</span><span class=\"token punctuation\">)</span>\n        <span class=\"token keyword\">return</span> <span class=\"token number\">1</span><span class=\"token punctuation\">;</span> <span class=\"token comment\">// 0! = 1</span>\n    <span class=\"token keyword\">return</span> n <span class=\"token operator\">*</span> <span class=\"token function\">factorial</span><span class=\"token punctuation\">(</span>n <span class=\"token operator\">-</span> <span class=\"token number\">1</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n<span class=\"token punctuation\">}</span>\n\n<span class=\"token function\">factorial</span><span class=\"token punctuation\">(</span><span class=\"token number\">3</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span> <span class=\"token comment\">// returns 6</span></code></pre></div>\n<p>Examplo mais avançado:</p>\n<div class=\"gatsby-highlight\" data-language=\"js\"><pre class=\"language-js\"><code class=\"language-js\"><span class=\"token comment\">/* Finds the lowest common multiple (LCM) of two numbers */</span>\n<span class=\"token keyword\">function</span> <span class=\"token function\">LCMCalculator</span><span class=\"token punctuation\">(</span><span class=\"token parameter\">x<span class=\"token punctuation\">,</span> y</span><span class=\"token punctuation\">)</span> <span class=\"token punctuation\">{</span> <span class=\"token comment\">// constructor function</span>\n    <span class=\"token keyword\">let</span> <span class=\"token function-variable function\">checkInt</span> <span class=\"token operator\">=</span> <span class=\"token keyword\">function</span><span class=\"token punctuation\">(</span><span class=\"token parameter\">x</span><span class=\"token punctuation\">)</span> <span class=\"token punctuation\">{</span> <span class=\"token comment\">// inner function</span>\n        <span class=\"token keyword\">if</span> <span class=\"token punctuation\">(</span>x <span class=\"token operator\">%</span> <span class=\"token number\">1</span> <span class=\"token operator\">!==</span> <span class=\"token number\">0</span><span class=\"token punctuation\">)</span>\n            <span class=\"token keyword\">throw</span> <span class=\"token keyword\">new</span> <span class=\"token class-name\">TypeError</span><span class=\"token punctuation\">(</span>x <span class=\"token operator\">+</span> <span class=\"token string\">\"is not an integer\"</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span> <span class=\"token comment\">// var a =  mouseX</span>\n\n        <span class=\"token keyword\">return</span> x<span class=\"token punctuation\">;</span>\n    <span class=\"token punctuation\">}</span><span class=\"token punctuation\">;</span>\n\n    <span class=\"token keyword\">this</span><span class=\"token punctuation\">.</span>a <span class=\"token operator\">=</span> <span class=\"token function\">checkInt</span><span class=\"token punctuation\">(</span>x<span class=\"token punctuation\">)</span>\n    <span class=\"token comment\">//   semicolons   ^^^^  are optional, a newline is enough</span>\n    <span class=\"token keyword\">this</span><span class=\"token punctuation\">.</span>b <span class=\"token operator\">=</span> <span class=\"token function\">checkInt</span><span class=\"token punctuation\">(</span>y<span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n<span class=\"token punctuation\">}</span>\n<span class=\"token comment\">// The prototype of object instances created by a constructor is</span>\n<span class=\"token comment\">// that constructor's \"prototype\" property.</span>\n<span class=\"token class-name\">LCMCalculator</span><span class=\"token punctuation\">.</span>prototype <span class=\"token operator\">=</span> <span class=\"token punctuation\">{</span> <span class=\"token comment\">// object literal</span>\n    constructor<span class=\"token punctuation\">:</span> LCMCalculator<span class=\"token punctuation\">,</span> <span class=\"token comment\">// when reassigning a prototype, set the constructor property appropriately</span>\n    <span class=\"token function-variable function\">gcd</span><span class=\"token punctuation\">:</span> <span class=\"token keyword\">function</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span> <span class=\"token punctuation\">{</span> <span class=\"token comment\">// method that calculates the greatest common divisor</span>\n        <span class=\"token comment\">// Euclidean algorithm:</span>\n        <span class=\"token keyword\">let</span> a <span class=\"token operator\">=</span> Math<span class=\"token punctuation\">.</span><span class=\"token function\">abs</span><span class=\"token punctuation\">(</span><span class=\"token keyword\">this</span><span class=\"token punctuation\">.</span>a<span class=\"token punctuation\">)</span><span class=\"token punctuation\">,</span> b <span class=\"token operator\">=</span> Math<span class=\"token punctuation\">.</span><span class=\"token function\">abs</span><span class=\"token punctuation\">(</span><span class=\"token keyword\">this</span><span class=\"token punctuation\">.</span>b<span class=\"token punctuation\">)</span><span class=\"token punctuation\">,</span> t<span class=\"token punctuation\">;</span>\n\n        <span class=\"token keyword\">if</span> <span class=\"token punctuation\">(</span>a <span class=\"token operator\">&lt;</span> b<span class=\"token punctuation\">)</span> <span class=\"token punctuation\">{</span>\n            <span class=\"token comment\">// swap variables</span>\n            <span class=\"token comment\">// t = b; b = a; a = t;</span>\n            <span class=\"token punctuation\">[</span>a<span class=\"token punctuation\">,</span> b<span class=\"token punctuation\">]</span> <span class=\"token operator\">=</span> <span class=\"token punctuation\">[</span>b<span class=\"token punctuation\">,</span> a<span class=\"token punctuation\">]</span><span class=\"token punctuation\">;</span> <span class=\"token comment\">// swap using destructuring assignment (ES6)</span>\n        <span class=\"token punctuation\">}</span>\n\n        <span class=\"token keyword\">while</span> <span class=\"token punctuation\">(</span>b <span class=\"token operator\">!==</span> <span class=\"token number\">0</span><span class=\"token punctuation\">)</span> <span class=\"token punctuation\">{</span>\n            t <span class=\"token operator\">=</span> b<span class=\"token punctuation\">;</span>\n            b <span class=\"token operator\">=</span> a <span class=\"token operator\">%</span> b<span class=\"token punctuation\">;</span>\n            a <span class=\"token operator\">=</span> t<span class=\"token punctuation\">;</span>\n        <span class=\"token punctuation\">}</span>\n\n        <span class=\"token comment\">// Only need to calculate GCD once, so \"redefine\" this method.</span>\n        <span class=\"token comment\">// (Actually not redefinition—it's defined on the instance itself,</span>\n        <span class=\"token comment\">// so that this.gcd refers to this \"redefinition\" instead of LCMCalculator.prototype.gcd.</span>\n        <span class=\"token comment\">// Note that this leads to a wrong result if the LCMCalculator object members \"a\" and/or \"b\" are altered afterwards.)</span>\n        <span class=\"token comment\">// Also, 'gcd' === \"gcd\", this['gcd'] === this.gcd</span>\n        <span class=\"token keyword\">this</span><span class=\"token punctuation\">[</span><span class=\"token string\">'gcd'</span><span class=\"token punctuation\">]</span> <span class=\"token operator\">=</span> <span class=\"token keyword\">function</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span> <span class=\"token punctuation\">{</span>\n            <span class=\"token keyword\">return</span> a<span class=\"token punctuation\">;</span>\n        <span class=\"token punctuation\">}</span><span class=\"token punctuation\">;</span>\n\n        <span class=\"token keyword\">return</span> a<span class=\"token punctuation\">;</span>\n    <span class=\"token punctuation\">}</span><span class=\"token punctuation\">,</span>\n\n    <span class=\"token comment\">// Object property names can be specified by strings delimited by double (\") or single (') quotes.</span>\n    <span class=\"token function-variable function\">lcm</span><span class=\"token punctuation\">:</span> <span class=\"token keyword\">function</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span> <span class=\"token punctuation\">{</span>\n        <span class=\"token comment\">// Variable names do not collide with object properties, e.g., |lcm| is not |this.lcm|.</span>\n        <span class=\"token comment\">// not using |this.a*this.b| to avoid FP precision issues</span>\n        <span class=\"token keyword\">let</span> lcm <span class=\"token operator\">=</span> <span class=\"token keyword\">this</span><span class=\"token punctuation\">.</span>a <span class=\"token operator\">/</span> <span class=\"token keyword\">this</span><span class=\"token punctuation\">.</span><span class=\"token function\">gcd</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span> <span class=\"token operator\">*</span> <span class=\"token keyword\">this</span><span class=\"token punctuation\">.</span>b<span class=\"token punctuation\">;</span>\n\n        <span class=\"token comment\">// Only need to calculate lcm once, so \"redefine\" this method.</span>\n        <span class=\"token keyword\">this</span><span class=\"token punctuation\">.</span><span class=\"token function-variable function\">lcm</span> <span class=\"token operator\">=</span> <span class=\"token keyword\">function</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span> <span class=\"token punctuation\">{</span>\n            <span class=\"token keyword\">return</span> lcm<span class=\"token punctuation\">;</span>\n        <span class=\"token punctuation\">}</span><span class=\"token punctuation\">;</span>\n\n        <span class=\"token keyword\">return</span> lcm<span class=\"token punctuation\">;</span>\n    <span class=\"token punctuation\">}</span><span class=\"token punctuation\">,</span>\n\n    <span class=\"token function-variable function\">toString</span><span class=\"token punctuation\">:</span> <span class=\"token keyword\">function</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span> <span class=\"token punctuation\">{</span>\n        <span class=\"token keyword\">return</span> <span class=\"token string\">\"LCMCalculator: a = \"</span> <span class=\"token operator\">+</span> <span class=\"token keyword\">this</span><span class=\"token punctuation\">.</span>a <span class=\"token operator\">+</span> <span class=\"token string\">\", b = \"</span> <span class=\"token operator\">+</span> <span class=\"token keyword\">this</span><span class=\"token punctuation\">.</span>b<span class=\"token punctuation\">;</span>\n    <span class=\"token punctuation\">}</span>\n<span class=\"token punctuation\">}</span><span class=\"token punctuation\">;</span>\n\n<span class=\"token comment\">// Define generic output function; this implementation only works for Web browsers</span>\n<span class=\"token keyword\">function</span> <span class=\"token function\">output</span><span class=\"token punctuation\">(</span><span class=\"token parameter\">x</span><span class=\"token punctuation\">)</span> <span class=\"token punctuation\">{</span>\n    document<span class=\"token punctuation\">.</span>body<span class=\"token punctuation\">.</span><span class=\"token function\">appendChild</span><span class=\"token punctuation\">(</span>document<span class=\"token punctuation\">.</span><span class=\"token function\">createTextNode</span><span class=\"token punctuation\">(</span>x<span class=\"token punctuation\">)</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n    document<span class=\"token punctuation\">.</span>body<span class=\"token punctuation\">.</span><span class=\"token function\">appendChild</span><span class=\"token punctuation\">(</span>document<span class=\"token punctuation\">.</span><span class=\"token function\">createElement</span><span class=\"token punctuation\">(</span><span class=\"token string\">'br'</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n<span class=\"token punctuation\">}</span>\n\n<span class=\"token comment\">// Note: Array's map() and forEach() are defined in JavaScript 1.6.</span>\n<span class=\"token comment\">// They are used here to demonstrate JavaScript's inherent functional nature.</span>\n<span class=\"token punctuation\">[</span>\n    <span class=\"token punctuation\">[</span><span class=\"token number\">25</span><span class=\"token punctuation\">,</span> <span class=\"token number\">55</span><span class=\"token punctuation\">]</span><span class=\"token punctuation\">,</span>\n    <span class=\"token punctuation\">[</span><span class=\"token number\">21</span><span class=\"token punctuation\">,</span> <span class=\"token number\">56</span><span class=\"token punctuation\">]</span><span class=\"token punctuation\">,</span>\n    <span class=\"token punctuation\">[</span><span class=\"token number\">22</span><span class=\"token punctuation\">,</span> <span class=\"token number\">58</span><span class=\"token punctuation\">]</span><span class=\"token punctuation\">,</span>\n    <span class=\"token punctuation\">[</span><span class=\"token number\">28</span><span class=\"token punctuation\">,</span> <span class=\"token number\">56</span><span class=\"token punctuation\">]</span>\n<span class=\"token punctuation\">]</span><span class=\"token punctuation\">.</span><span class=\"token function\">map</span><span class=\"token punctuation\">(</span><span class=\"token keyword\">function</span><span class=\"token punctuation\">(</span><span class=\"token parameter\">pair</span><span class=\"token punctuation\">)</span> <span class=\"token punctuation\">{</span> <span class=\"token comment\">// array literal + mapping function</span>\n    <span class=\"token keyword\">return</span> <span class=\"token keyword\">new</span> <span class=\"token class-name\">LCMCalculator</span><span class=\"token punctuation\">(</span>pair<span class=\"token punctuation\">[</span><span class=\"token number\">0</span><span class=\"token punctuation\">]</span><span class=\"token punctuation\">,</span> pair<span class=\"token punctuation\">[</span><span class=\"token number\">1</span><span class=\"token punctuation\">]</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n<span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">.</span><span class=\"token function\">sort</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">(</span><span class=\"token parameter\">a<span class=\"token punctuation\">,</span> b</span><span class=\"token punctuation\">)</span> <span class=\"token operator\">=></span> a<span class=\"token punctuation\">.</span><span class=\"token function\">lcm</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span> <span class=\"token operator\">-</span> b<span class=\"token punctuation\">.</span><span class=\"token function\">lcm</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">)</span> <span class=\"token comment\">// sort with this comparative function; => is a shorthand form of a function, called \"arrow function\"</span>\n    <span class=\"token punctuation\">.</span><span class=\"token function\">forEach</span><span class=\"token punctuation\">(</span>printResult<span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n\n<span class=\"token keyword\">function</span> <span class=\"token function\">printResult</span><span class=\"token punctuation\">(</span><span class=\"token parameter\">obj</span><span class=\"token punctuation\">)</span> <span class=\"token punctuation\">{</span>\n    <span class=\"token function\">output</span><span class=\"token punctuation\">(</span>obj <span class=\"token operator\">+</span> <span class=\"token string\">\", gcd = \"</span> <span class=\"token operator\">+</span> obj<span class=\"token punctuation\">.</span><span class=\"token function\">gcd</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span> <span class=\"token operator\">+</span> <span class=\"token string\">\", lcm = \"</span> <span class=\"token operator\">+</span> obj<span class=\"token punctuation\">.</span><span class=\"token function\">lcm</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n<span class=\"token punctuation\">}</span></code></pre></div>\n<p>Juntamente com HTML e CSS, o JavaScript é uma das principais tecnologias da World Wide Web.\nO JavaScript ativa páginas da web interativas e é uma parte essencial dos aplicativos da web. A grande maioria dos sites o utiliza e os principais navegadores da Web possuem um mecanismo JavaScript dedicado para executá-lo.</p>\n<p>Como uma linguagem de múltiplos paradigmas, o JavaScript suporta estilos de programação orientados a eventos, funcionais e imperativos (incluindo orientação a objetos e protótipo). Possui APIs para trabalhar com texto, matrizes, datas, expressões regulares e o DOM, mas o próprio idioma não inclui nenhuma E / S, como recursos de rede, armazenamento ou elementos gráficos. Ele se baseia no ambiente host em que está incorporado para fornecer esses recursos.</p>\n<p>Inicialmente implementado apenas no lado do cliente em navegadores da Web, os mecanismos JavaScript agora estão incorporados em muitos outros tipos de software host, incluindo o lado do servidor em servidores e bancos de dados da Web e em programas não na Web, como processadores de texto e software PDF, e em tempo de execução ambientes que disponibilizam o JavaScript para gravar aplicativos móveis e de desktop, incluindo widgets de desktop.</p>\n<p>Os termos Vanilla JavaScript e Vanilla JS referem-se ao JavaScript não estendido por nenhuma estrutura ou biblioteca adicional. Os scripts escritos em Vanilla JS são um código JavaScript simples.</p>\n<p>Embora existam semelhanças entre JavaScript e Java, incluindo nome de idioma, sintaxe e respectivas bibliotecas padrão, os dois idiomas são distintos e diferem bastante no design. O JavaScript foi influenciado por linguagens de programação como Self e Scheme. O formato de serialização JSON, usado para armazenar estruturas de dados em arquivos ou transmiti-los pelas redes, é baseado em JavaScript.</p>\n<p><a href=\"https://en.wikipedia.org/wiki/JavaScript\">Wikipedia</a></p>"}},"pageContext":{"isCreatedByStatefulCreatePages":false,"locale":"pt","title":"Linguagem JavaScript - Exemplos de códigos usando PrismJS"}}}