Temporada 7 do Airdrop Gratuito está DISPONÍVEL! Responda perguntas divertidas ou faça tarefas simples para ganhar recompensas incríveis do baú BitDegree de mais de R$150 mil! Participe Agora ! 🔥
Quando você está começando a aprender desenvolvimento web, você percebe que mais e mais portas para opções novas e interativas começam a se abrir. À medida que a curva de aprendizado começa a se tornar mais uniforme, vários elementos interativos, otimizações e tudo mais parece ser uma ocorrência natural. Seja qual for sua escolha de estudar desenvolvimento web - seja com um professor, online ou autodidata - você provavelmente já ouviu que sua escolha muito grande nesses cenários deve sempre ser JavaScript. Afinal, é a linguagem da internet! Mas e se eu te disser que existe outra opção? Neste tutorial, exploraremos o confronto contínuo de JavaScript ou jQuery e tudo o que esse confronto oferece.
Vou lhe contar tudo sobre os dois idiomas - para que eles são usados, seus prós e contras, e assim por diante. Mais adiante no tutorial, quando descobrirmos os dois, vamos compará-los e contrastá-los de diferentes perspectivas - acessibilidade de código, oportunidades de carreira e assim por diante. Então, sem mais delongas, vamos direto ao assunto!
Tabela de Conteúdo
- 1. O Dilema jQuery ou Javascript
- 2. jQuery é JavaScript
- 2.1. JavaScript
- 2.2. O que é jQuery?
- 3. jQuery ou Javascript no Código
- 3.1. Conclusão prematura
- 3.2. De volta ao bar novamente
- 3.3. Segunda Conclusão Prematura
- 3.4. Objetivos de carreira
- 4. Funcionalidade Específica
- 4.1. Compatibilidade entre navegadores
- 4.2. Manipulação de DOM
- 4.3. Efeitos e animações
- 4.4. API
- 5. Conclusão
O Dilema jQuery ou Javascript
Quando você procura algumas respostas para problemas de JavaScript online, você encontra respostas que dizem simplesmente: 'vá aprender jQuery'.
Oferta Mais Recente Ativa Nesse Exato Momento:Follow the Datacamp promo code link & get an exclusive 25% OFF Datacamp subscriptions. Act now while the offer is still available!
Sua reação pode ter sido 'o que é jQuery?' Você pensou que tinha que aprender JavaScript, mas agora existe uma alternativa? Você não estava preparado para este dilema JavaScript ou jQuery...
Ou talvez você tenha abordado o dilema do ponto de vista oposto. jQuery foi o método recomendado a você para o seu site, mas agora você leu online que o JavaScript pode fazer tudo o que o jQuery pode e muito mais, enquanto codificar em JavaScript raíz também o torna um desenvolvedor melhor.
Agora você fica se perguntando: 'o que é JavaScript? Por que as coisas não podem ser simples? Não posso simplesmente usar jQuery?'
Mas espere, segure esses pensamentos por um momento - aumentaria sua confusão se você aprendesse que Javascript e jQuery não são duas opções diferentes?
jQuery é JavaScript
Podemos ter apresentado o dilema jQuery ou Javascript como se fosse uma batalha entre duas tecnologias concorrentes, mas, na verdade, a diferença entre JavaScript e jQuery é que jQuery é apenas uma maneira diferente de usar JavaScript.
jQuery é comumente referido como um framework ou uma biblioteca. Antes de abordarmos o que esses termos significam, vamos garantir rapidamente que ninguém fique se perguntando 'o que é JavaScript?'
JavaScript
JavaScript é a linguagem de programação do navegador, ou pelo menos isso era tudo o que era até recentemente – seu alcance agora se espalhou além dos limites da janela do navegador para outros usos, como código do lado do servidor.
Em seu objetivo principal como uma linguagem de programação do lado do cliente escrita em todos os navegadores da Internet, é responsável por elementos interativos e dinâmicos em uma página da Web, como ouvir e reagir à entrada do usuário.
Agora, e o jQuery?
O que é jQuery?
Como estabelecemos, jQuery é uma biblioteca JavaScript. Isso significa que é uma coleção de código JavaScript empacotado em conjunto que pode ser acessado por uma linha de código muito mais simples, tornando mais fácil para os desenvolvedores implementarem JavaScript sem ter que escrever código JavaScript complicado, graças ao código pré-escrito empacotado em jQuery.
Se você já conhece o Bootstrap, uma boa analogia pode ser a relação entre CSS e Bootstrap. Bootstrap é simplesmente uma coleção de comandos CSS que tornam mais fácil e rápido estilizar páginas da web. jQuery é para JavaScript o que Bootstrap é para CSS.
Para aqueles que não estão familiarizados com o Bootstrap, vamos tentar uma analogia do mundo real com a questão JavaScript ou jQuery.
Suponha que você esteja em um bar com seu amigo João. João bebeu muitas cervejas e está falando alto demais. Você quer que João pare de passar vergonha e pare de falar tão alto.
Seu curso de ação é explicar ao João que você notou que as mulheres no fundo do bar fazem caretas irritadas em sua direção.
Você explica que o cavalheiro que estava sentado à mesa ao seu lado se afastou para obter um pouco de paz. Você diz a João que esposa dele não gostaria que alguns detalhes de seu relacionamento fossem compartilhados com todo o bar.
João para de falar. Este é o meio JavaScript de fazer João parar de falar.
A abordagem do jQuery seria simplesmente dizer:
'Fica quieto, João'.
João para de falar. Você conseguiu a mesma coisa em muito menos palavras e foi muito mais fácil.
jQuery ou Javascript no Código
A primeira lição do 'Tutorial jQuery interativo: Aprenda a usar efeitos e eventos jQuery' da BitDegree faz a diferença entre JavaScript e jQuery muito clara no código.
O exemplo é um botão HTML que abre e fecha um formulário de login.
Aqui está o código JavaScript:
const login = document.getElementById("login");
const loginMenu = document.getElementById("loginMenu");
login.addEventListener("click", () => {
if(loginMenu.style.display === "none"){
loginMenu.style.display = "inline";
} else {
loginMenu.style.display = "none";
}
});
Enquanto aqui está o código jQuery:
$("#login").click(() => {
$("#loginMenu").toggle()
});
O que levou nove linhas de código em JavaScript levou apenas três linhas de código para alcançar em jQuery.
Conclusão prematura
Então isso parece um uma decisão, não é? Você tem que aprender jQuery.
Pode ter sido simples assim há uma década atrás, mas em 2018 a relevância do jQuery no desenvolvimento da web está diminuindo, e exemplos como o código acima estão se tornando raros.
Ainda existem boas razões para aprender e usar jQuery, mas se for uma questão de jQuery ou Javascript, a necessidade de entender e poder usar JavaScript está se acelerando rapidamente, com alguns de seus novos poderes fazendo muito da funcionalidade do jQuery redundante.
De volta ao bar novamente
Para demonstrar outro argumento no debate JavaScript ou jQuery, vamos voltar ao bar para estender um pouco mais nossa analogia. Você decidiu simplesmente dizer ao João para calar a boca. Embora seja uma estratégia eficaz para atingir seu objetivo, João está chateado e de mau humor no táxi a caminho de casa
Se você tivesse usado a estratégia JavaScript de explicar ao Joao que ele deveria manter a voz baixa, você poderia poupar seus sentimentos e mantê-lo de bom humor. Seus poderes de persuasão poderiam ter sido muito maiores com a estratégia JavaScript, mesmo que exigisse mais esforço.
Da mesma forma, se você aprender JavaScript, seus poderes de desenvolvimento web serão muito maiores do que seriam se você aprendesse apenas jQuery. Talvez dizer a João para calar a boca não o aborreça, mas pode ser imprevisível.
Comparativamente, o comportamento do comando jQuery pode ser exatamente o que você precisa, mas é difícil ter certeza sem entender o código que faz o jQuery funcionar. E, claro, como o jQuery é composto de código JavaScript, você precisará entender o JavaScript para entender completamente como cada comando do jQuery funciona.
Logicamente, o JavaScript pode fazer tudo o que o jQuery pode e muito mais, porque, repetindo para enfatizar, o jQuery é apenas JavaScript, logo não se trata apenas de jQuery ou Javascript.
Segunda Conclusão Prematura
Então é isso? A diferença entre jQuery e JavaScript é que jQuery é mais simples e fácil, mas JavaScript é mais poderoso e não incomoda João. Então, a resposta para a pergunta jQuery ou Javascript é aprender JavaScript?
Bem, não, não exatamente. Infelizmente, não existe uma resposta de tamanho único para a questão jQuery ou Javascript. Se você precisa de JavaScript ou jQuery depende de seus objetivos de carreira e da funcionalidade necessária em seu projeto.
Objetivos de carreira
Se o seu objetivo é ser um Desenvolvedor Front-End, a resposta para a pergunta jQuery ou Javascript é simples: aprenda JavaScript. Os anúncios de emprego podem pedir jQuery, mas a questão jQuery ou Javascript é simples para qualquer gerente de contratação: eles quase certamente preferirão os candidatos que se dedicaram a aprender JavaScript aos que aprenderam jQuery.
Mesmo que uma empresa use jQuery extensivamente, supõe-se que um candidato que entenda JavaScript possa aprender jQuery de maneira rápida e fácil. Aprender JavaScript é muito mais difícil, mesmo se você for um mestre em jQuery.
Se o seu objetivo é ser um web designer freelancer, quanto a escolha entre jQuery ou Javascript, o JavaScript pode não ser tão necessário. Se você cria sites para clientes em um sistema de gerenciamento de conteúdo como o WordPress, grande parte da necessidade de JavaScript pode ser tratada por jQuery ou plugins disponíveis gratuitamente que adicionam funcionalidade ao seu site.
A grande maioria dos sites online pode ser construída sem a necessidade de código JavaScript personalizado. Contanto que você reconheça que tipo de funcionalidade do site exige que você escreva código JavaScript personalizado e o que não exige, há muito trabalho para um web designer com habilidades em HTML, CSS e jQuery.
Neste ponto, respondi às perguntas sobre o que é JavaScript e o que é jQuery. Deve ficar claro qual é a diferença entre JavaScript e jQuery, mas a resposta para JavaScript vs jQuery ainda não será clara para muitos.
Se você se decidiu e está ansioso para começar a aprender, pode seguir os links em qualquer um dos dois cursos mostrados para começar imediatamente. Se você estiver interessado em uma comparação mais detalhada entre os idiomas, continue lendo.
Funcionalidade Específica
Então agora você tem uma ideia do que é JavaScript e o que é jQuery, e o valor de cada um em sua carreira escolhida, vamos nos aprofundar em casos de uso específicos.
JavaScript pode fazer qualquer coisa que o jQuery pode fazer, então quais são as instâncias específicas em que pode ser melhor usar o código jQuery?
Compatibilidade entre navegadores
Mencione o Internet Explorer para um desenvolvedor experiente e você poderá testemunhar seus rostos avermelhados, olhos esbugalhados, veias estalando e punhos cerrados enquanto contemplam um período sombrio em sua carreira, quando muitas pessoas usavam o infame navegador da Microsoft. Mencione o IE8 e a cabeça do desenvolvedor pode explodir.
Muito do crescimento do jQuery pode ser atribuído ao fato de ele preencher as lacunas entre os navegadores. A maioria dos navegadores de hoje interpreta o JavaScript da mesma maneira, mas dez anos atrás havia grandes discrepâncias entre os navegadores. Você teria que escrever seu código de várias maneiras para que pudesse ser entendido por todos os navegadores.
Ou você pode usar jQuery, que fez o trabalho duro para você. Uma linha de código jQuery seria interpretada pela biblioteca jQuery nas várias linhas de código JavaScript necessárias para agradar cada navegador. Para os desenvolvedores, usar jQuery nessas circunstâncias era um acéfalo.
Hoje em dia, porém, essas diferenças de navegador são pequenas. E se você encontrar discrepâncias, por exemplo, ao usar alguns recursos da atualização mais recente da linguagem JavaScript ES6, é recomendável usar um polyfill. Polyfills são simplesmente bibliotecas que lidam com essas diferenças entre navegadores e podem ser implementadas apenas com uma URL que referencia a CDN polyfill em uma tag de script.
Os polyfills modernos detectarão qual navegador o usuário final está usando e fornecerão apenas o código necessário para adaptar seu código ao navegador do usuário. Isso economiza tempo de carregamento, pois se o usuário estiver carregando apenas o código de que precisa, seu site carregará mais rápido em sua máquina do que teria carregado se tivesse que carregar toda a biblioteca jQuery.
A compatibilidade entre navegadores já foi talvez o principal motivo para usar o jQuery, mas agora não é nem a melhor solução para resolver um problema que agora não é tão preocupante quanto antes.
Manipulação de DOM
O DOM, ou o Document Object Model, é a interpretação do navegador da página da Web que você o serve. Se você clicar com o botão direito do mouse em qualquer página da Web e clicar em inspecionar, no painel Elementos você verá o DOM. Pode parecer com o seu código index.html, mas lembre-se que muito do conteúdo HTML é normalmente renderizado dinamicamente a partir de um servidor usando código do lado do servidor, como PHP.
Os elementos DOM também podem ser renderizados e manipulados com JavaScript, que é outra área onde jQuery provou ser extremamente útil.
Com jQuery, você pode direcionar nós DOM, essencialmente elementos HTML, como um cabeçalho de nível dois com o código
$(“h2”)
Você pode então encadear uma função a esse código para fazer o que quiser, como ouvir eventos ou modificar o DOM para alterar coisas em seu site enquanto o usuário o estiver usando.
Com JavaScript, você pode fazer a mesma coisa usando o código,
document.querySelector("h2")
Isso não é uma grande diferença, não é? No passado, os métodos de manipulação de DOM com JavaScript não eram tão fáceis ou consistentes entre os navegadores. Além disso, usar JavaScript vanilla (Javascript baunilha significa JavaScript puro e inalterado sem nenhuma biblioteca) é considerado mais eficiente – o que significa que ele faz isso mais rápido e/ou usa menos recursos de memória.
Novamente, isso parece mais uma vitória para JavaScript no debate jQuery ou Javascript. No entanto, a popularidade do jQuery significa que você verá muito código jQuery usado em aplicativos mais antigos e aplicativos ainda mais novos, porque muitos desenvolvedores simplesmente se sentem mais confortáveis usando o jQuery.
Novas bibliotecas, como Bling.js, até permitem que você use a sintaxe jQuery sem carregar toda a biblioteca jQuery, demonstrando o gosto que muitos desenvolvedores têm por escrever jQuery.
Embora você provavelmente deva aprender JavaScript, se você sabe que a perda de desempenho relativa não fará muita diferença para seus usuários finais-alvo, aprender jQuery porque você sabe que pode desenvolver mais rápido e fácil com ele do que usar JavaScript vanilla faz sentido lógico .
Portanto, embora você provavelmente deva aprender a usar JavaScript simples para manipulação de DOM, se você for trabalhar com outras pessoas, entender os métodos de manipulação de DOM do jQuery quase certamente será útil em algum momento.
Efeitos e animações
jQuery inclui uma biblioteca de efeitos, incluindo o método toggle mostrado na comparação inicial de código jQuery ou Javascript neste artigo. O método toggle é um bom exemplo de funcionalidade mais simples de alcançar usando jQuery do que usando JavaScript.
Hoje em dia, porém, os desenvolvedores têm acesso à API de Animações da Web junto com as Transições CSS. Essas duas tecnologias são nativas do navegador, o que significa que seu navegador da Web as entende sem a necessidade de carregar nenhuma biblioteca, e elas terão um desempenho mais rápido do que ter que carregar as animações da biblioteca jQuery.
jQuery será um método mais simples de implementação de animação em alguns casos, mas hoje em dia é bastante limitado em comparação com a gama de opções que os desenvolvedores têm que são nativas do navegador.

- Fácil de usar
- Oferece conteúdo de qualidade
- Muito transparente com os preços

- Design simples (sem informações desnecessárias)
- Cursos de alta qualidade (mesmo os gratuitos)
- Variedade de recursos
- Programas Nanodegree
- Indicado para empresas
- Certificados de conclusão pagos

- Bem estabelecido na indústria
- Grande extensão de funcionalidades para escolher
- Cursos de nível superior
- Cursos de nível superior
- Indicado para empresas
- Certificados Pagos de conclusão
API
Outro caso de uso excelente para jQuery no passado era sua capacidade de fazer chamadas de API. Chamar uma API é extrair dados de uma fonte externa para seu site, por exemplo, você pode querer apresentar um mapa personalizado em seu site para usar uma API para obter dados do Google Map do Google.
O método jQuery de chamar APIs era amplamente preferido ao método XML nativo, mas, novamente, como nos outros casos de uso, agora existe um método superior conhecido como Fetch, que é nativo do navegador e, sem dúvida, tão fácil de usar quanto jQuery .

Você sabia?
Você já se perguntou quais plataformas de aprendizagem online são as melhores para sua carreira?
Conclusão
Às vezes, a tecnologia mais útil não é aquela para começar a aprender. O desenvolvimento é difícil, e aprender um idioma excessivamente difícil no início de seu caminho de aprendizado pode ser suficiente para afastá-lo completamente.
JavaScript é uma ferramenta poderosa, mas não uma que você conseguirá entender em dias ou mesmo semanas. Mesmo desenvolvedores experientes de JavaScript ainda são frequentemente enganados por seu comportamento.
Como um novato em programação e desenvolvimento web, você não poderá fazer muito com suas habilidades de JavaScript em poucas semanas. Mas se você já conhece HTML e CSS, o jQuery pode levar seus projetos a outro nível possivelmente em apenas alguns dias.
Muitos desenvolvedores web entraram no desenvolvimento web aprendendo jQuery. Embora aprender os fundamentos do JavaScript seja provavelmente a parte mais importante para se tornar um bom desenvolvedor front-end, também é importante obter alguns ganhos rápidos em sua educação, e jQuery é uma maneira mais rápida de conseguir isso.
Quando você vir seus projetos ganharem vida com jQuery, ficará motivado a aprender mais; com JavaScript, pode levar muito mais semanas de aprendizado e muito mais erros antes que você veja os mesmos resultados.
Ao aprender jQuery, você também começará a entender o poder do JavaScript. Você poderá realizar muitas das tarefas comuns que requerem um desenvolvedor JavaScript, mas ao ultrapassar os limites do que pode alcançar com jQuery, você também aprenderá o quanto mais pode fazer com JavaScript.