├── .gitignore ├── .vscode └── settings.json ├── README.md ├── assets └── 75-Recursos.pdf ├── controle ├── if1.js └── if2.js └── fundamentos ├── aritmeticos.js ├── arrays.js ├── atribuicao.js ├── booleanos.js ├── comentario.js ├── destructuring1.js ├── destructuring2.js ├── destructuring3.js ├── destructuring4.js ├── erro.js ├── experimentos.js ├── funcao1.js ├── funcao2.js ├── funcaoEmQuaseTudo.js ├── hoisting.js ├── inicio ├── bloco.js ├── comentario.js ├── dados_1.js ├── dados_2.js ├── dados_3.js ├── dados_4.js ├── desafio_area.js ├── desafio_area_resposta.js ├── desafio_sentenca_bloco.js ├── desafio_sentenca_bloco_resposta.js ├── desafio_troca.js ├── desafio_troca_resposta.js ├── sentenca_1.js └── sentenca_2.js ├── logicos.js ├── math.js ├── notacaoPonto.js ├── nullUndefined.js ├── numeros.js ├── numerosAlgunsCuidados.js ├── objeto.js ├── objeto2.js ├── organizacao.js ├── parNomeValor.js ├── relacionais.js ├── strings.js ├── templateString.js ├── ternario.js ├── tipagemFraca.js ├── unarios.js ├── usandoLet1.js ├── usandoLetEmLoop1.js ├── usandoLetEmLoop2.js ├── usandoVar1.js ├── usandoVar2.js ├── usandoVarEmLoop1.js ├── usandoVarEmLoop2.js └── variaveisEConstantes.js /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules -------------------------------------------------------------------------------- /.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "cSpell.enableFiletypes": [ 3 | "!javascript" 4 | ], 5 | "cSpell.words": [ 6 | "avaliacao", 7 | "booleana", 8 | "Portugol", 9 | "typeof" 10 | ] 11 | } -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Web-Moderno-com-JavaScript 2 | 3 | - [Web-Moderno-com-JavaScript](#web-moderno-com-javascript) 4 | - [Seção 1: Introdução Curso Desenvolvimento Web](#seção-1-introdução-curso-desenvolvimento-web) 5 | - [1. Visão geral do Curso Desenvolvimento Web](#1-visão-geral-do-curso-desenvolvimento-web) 6 | - [2. Repositório do curso](#2-repositório-do-curso) 7 | - [3. Boas práticas do suporte](#3-boas-práticas-do-suporte) 8 | - [4. Importância dos fundamentos](#4-importância-dos-fundamentos) 9 | - [5. Por que aprender Javascript?](#5-por-que-aprender-javascript) 10 | - [6. Usando o terminal](#6-usando-o-terminal) 11 | - [7. Terminais](#7-terminais) 12 | - [Seção 2: Configuração do ambiente](#seção-2-configuração-do-ambiente) 13 | - [8. Aviso importante aos usuários Windows](#8-aviso-importante-aos-usuários-windows) 14 | - [9. Instalação Node (Windows / Mac)](#9-instalação-node-windows--mac) 15 | - [10. Instalar o Node e o Visual Studio Code no Linux](#10-instalar-o-node-e-o-visual-studio-code-no-linux) 16 | - [11. Configuração do editor (VSCode)](#11-configuração-do-editor-vscode) 17 | - [12. Como abrir os terminais nos sistemas operacionais](#12-como-abrir-os-terminais-nos-sistemas-operacionais) 18 | - [13. Configuração do comando 'code'](#13-configuração-do-comando-code) 19 | - [14. Instalação do VSCode (Windows)](#14-instalação-do-vscode-windows) 20 | - [Seção 3: Iniciando com programação](#seção-3-iniciando-com-programação) 21 | - [15. Introdução do módulo](#15-introdução-do-módulo) 22 | - [16. Conhecendo o Visual Studio Code](#16-conhecendo-o-visual-studio-code) 23 | - [17. Sentença de código 01](#17-sentença-de-código-01) 24 | - [18. Sentença de código 02](#18-sentença-de-código-02) 25 | - [19. Comentários de código](#19-comentários-de-código) 26 | - [20. Blocos de código](#20-blocos-de-código) 27 | - [21. Desafio sentença e bloco](#21-desafio-sentença-e-bloco) 28 | - [22. Desafio sentença e bloco - Resposta](#22-desafio-sentença-e-bloco---resposta) 29 | - [23. Trabalhando com dados 01](#23-trabalhando-com-dados-01) 30 | - [24. Trabalhando com dados 02](#24-trabalhando-com-dados-02) 31 | - [25. Trabalhando com dados 03](#25-trabalhando-com-dados-03) 32 | - [26. Trabalhando com dados 04](#26-trabalhando-com-dados-04) 33 | - [27. Desafio Área da Circunferência](#27-desafio-área-da-circunferência) 34 | - [28. Desafio área da circunferência - Resposta](#28-desafio-área-da-circunferência---resposta) 35 | - [29. Desafio troca de valores](#29-desafio-troca-de-valores) 36 | - [30. Desafio troca de valores - Resposta](#30-desafio-troca-de-valores---resposta) 37 | - [Seção 4: Javascript: Fundamentos](#seção-4-javascript-fundamentos) 38 | - [31. Visão geral de algoritmo](#31-visão-geral-de-algoritmo) 39 | - [Características dos algoritmos](#características-dos-algoritmos) 40 | - [32. Visão geral de estruturas de dados](#32-visão-geral-de-estruturas-de-dados) 41 | - [Características das estruturas de dados](#características-das-estruturas-de-dados) 42 | - [33. Lembrem-se sempre de salvar o código!](#33-lembrem-se-sempre-de-salvar-o-código) 43 | - [34. Configuração do projeto](#34-configuração-do-projeto) 44 | - [35. Organização básica de um código JS](#35-organização-básica-de-um-código-js) 45 | - [36. Executando JavaScript](#36-executando-javascript) 46 | - [37. Comentários de código](#37-comentários-de-código) 47 | - [38. O básico de Var, Let e Const](#38-o-básico-de-var-let-e-const) 48 | - [39. Tipagem fraca](#39-tipagem-fraca) 49 | - [40. Tipos em JavaScript: Number](#40-tipos-em-javascript-number) 50 | - [41. Number: Alguns cuidados](#41-number-alguns-cuidados) 51 | - [42. Usando Math](#42-usando-math) 52 | - [43. Tipos em JavaScript: String](#43-tipos-em-javascript-string) 53 | - [44. Usando Template Strings](#44-usando-template-strings) 54 | - [45. Tipos em JavaScript: Boolean](#45-tipos-em-javascript-boolean) 55 | - [46. Tipos em JavaScript: Array](#46-tipos-em-javascript-array) 56 | - [47. Tipos em JavaScript: Object](#47-tipos-em-javascript-object) 57 | - [48. Entendendo o Null e o Undefined](#48-entendendo-o-null-e-o-undefined) 58 | - [49. Quase tudo é função!](#49-quase-tudo-é-função) 59 | - [50. Exemplos básicos de funções 01](#50-exemplos-básicos-de-funções-01) 60 | - [51. Exemplos básicos de funções 02](#51-exemplos-básicos-de-funções-02) 61 | - [52. Declaração de variáveis com var 01](#52-declaração-de-variáveis-com-var-01) 62 | - [53. Declaração de variáveis com var 02](#53-declaração-de-variáveis-com-var-02) 63 | - [54. Declaração de variáveis com Let](#54-declaração-de-variáveis-com-let) 64 | - [55. Usando Var em Loop 01](#55-usando-var-em-loop-01) 65 | - [56. Usando Let em Loop 01](#56-usando-let-em-loop-01) 66 | - [57. Usando Var em Loop 02](#57-usando-var-em-loop-02) 67 | - [58. Usando Let em Loop 02](#58-usando-let-em-loop-02) 68 | - [59. Entendendo o Hoisting](#59-entendendo-o-hoisting) 69 | - [60. Função vs Objeto](#60-função-vs-objeto) 70 | - [61. Par Nome/Valor](#61-par-nomevalor) 71 | - [62. Notação ponto](#62-notação-ponto) 72 | - [63. Operadores: Atribuição](#63-operadores-atribuição) 73 | - [64. Operadores: Destructuring 01](#64-operadores-destructuring-01) 74 | - [65. Operadores: Destructuring 02](#65-operadores-destructuring-02) 75 | - [66. Operadores: Destructuring 03](#66-operadores-destructuring-03) 76 | - [67. Operadores: Destructuring 03](#67-operadores-destructuring-03) 77 | - [68. Operadores aritméticos](#68-operadores-aritméticos) 78 | - [69. Operadores: relacionais](#69-operadores-relacionais) 79 | - [70. Operadores lógicos](#70-operadores-lógicos) 80 | - [71. Operadores unários](#71-operadores-unários) 81 | - [72. Operadores ternários](#72-operadores-ternários) 82 | - [73. Contexto de execução: Browser vs Node](#73-contexto-de-execução-browser-vs-node) 83 | - [74. Tratamento de Erro (Try/Catch/Throw)](#74-tratamento-de-erro-trycatchthrow) 84 | - [75. Recursos](#75-recursos) 85 | - [Seção 5: Javascript: Estruturas de controle](#seção-5-javascript-estruturas-de-controle) 86 | - [76. Visão geral do capítulo](#76-visão-geral-do-capítulo) 87 | - [77. Usando a estrutura if 01](#77-usando-a-estrutura-if-01) 88 | - [78. Usando a estrutura if 02](#78-usando-a-estrutura-if-02) 89 | 90 | ## Seção 1: Introdução Curso Desenvolvimento Web 91 | 92 | ### 1. Visão geral do Curso Desenvolvimento Web 93 | 94 | * Seções: 95 | * 01 - Visão Geral 96 | * 02 - Configuração do Ambiente 97 | * 03 - Fundamentos 98 | * 04 - Estruturas de Controle 99 | * 05 - Funções 100 | * 06 - Objetos & OO 101 | * 07 - Array 102 | * 08 - Node 103 | * 09 - ES Next... 6, 7, 8 104 | * 10 - Fundamentos da Web 105 | * 11 - HTML 106 | * 12 - CSS 107 | * 13 - DOM 108 | * 14 - Ajax 109 | * 15 - Gulp 110 | * 16 - Webpack 111 | * 17 - jQuery 112 | * 18 - Bootstrap 113 | * 19 - React 114 | * 20 - Vue 115 | * 21 - Banco de dados relacionais 116 | * 22 - Banco de dados não relacionais 117 | * 23 - express 118 | * 24 - Integrando banco de dados 119 | * 25 - Projetos 120 | * 26 - Outros tópicos 121 | * 27 - Conclusão 122 | 123 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/e6429ff10991fed8f9af077b3b53196bca89ba2a) 124 | 125 | ### 2. Repositório do curso 126 | 127 | Todos os exercícios e projetos estão em [https://github.com/cod3rcursos/web-moderno](https://github.com/cod3rcursos/web-moderno) 128 | 129 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/d2fac4c4d18496bdf03d62275e97ef5fab22b10c) 130 | 131 | ### 3. Boas práticas do suporte 132 | 133 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/d767848f25522b40205ccc20c00e96f811785326) 134 | 135 | ### 4. Importância dos fundamentos 136 | 137 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/62dc43d2f7db73c4bc8f190ee61225b576a69e32) 138 | 139 | ### 5. Por que aprender Javascript? 140 | 141 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/1e281211dd90a6dd1352d542f39316a086a65ad5) 142 | 143 | ### 6. Usando o terminal 144 | 145 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/5bf7486d4382a0d96382831f3164cc658deb0a45) 146 | 147 | ### 7. Terminais 148 | 149 | Venho passar uma dica rápida e super importante pra quem tá iniciando na área de programação agora. Essa dica serve para qualquer ambiente ou curso que você vá fazer. 150 | 151 | 152 | O terminal do seu sistema operacional, seja ele Windows, Linux ou Mac, é super importante. É uma ferramenta importante de ser dominada e que será utilizada em qualquer ambiente de qualquer linguagem ou tecnologia. Vou deixar aqui links para os posts feitos lá no Blog da Cod3r sobre esse assunto. 153 | 154 | Caso vocês não saibam muito sobre os terminais ou se tiverem dúvidas sobre o assunto, recomendo que deem uma olhada. 155 | 156 | Windows -> https://blog.cod3r.com.br/terminal-no-windows/ 157 | 158 | Linux/Mac -> https://blog.cod3r.com.br/terminal-no-macos-e-linux/ 159 | 160 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/73e3bba113544c1a4ec62388d1fdae310e56dda2) 161 | 162 | ## Seção 2: Configuração do ambiente 163 | 164 | ### 8. Aviso importante aos usuários Windows 165 | 166 | Fala galera! Tranquilo? 167 | 168 | Antes de mais nada, recomendamos que vocês utilizem sempre a versão mais atualizada possível do Windows, ou seja, o Windows 10. Pois diversas tecnologias não dão mais suporte aos Windows 7, 8 ou 8.1, então caso vocês utilizem alguma dessas versões, vocês vão acabar tendo problemas em algum ponto do curso. A recomendação é utilizar o Windows 10. 169 | 170 | Venho também dar uma outra dica super rápida porém super importante para todos que irão dar início às atividades do curso no ambiente Windows. O que acontece é que existem duas configurações padrão que vêm ativadas e acabam dificultando ou gerando erros na hora de programar em qualquer ambiente. Vou explicar rapidinho sobre elas e sobre como lidar com isso. 171 | 172 | Na programação é super normal utilizar os caminhos absolutos de localizações na sua máquina em diversos momentos. Às vezes você mesmo utiliza, mas em geral as linguagens utilizam ali por debaixo do panos para que possam ser executadas. Esses caminhos são literalmente "c/users/seuNome/pasta" e tudo mais. 173 | 174 | O primeiro problema é relacionado a Área de Trabalho, pois em alguns casos ela entra nesse caminho absoluto com seu nome em português, ou seja, com espaços e acentos. E isso acaba gerando erro em diversos ambientes. A forma de se lidar com isso é bem simples, basta criar seu projeto em outra pasta que não seja a Área de Trabalho. 175 | 176 | O segundo problema é relacionado ao OneDrive. Nas versões mais recentes do Windows o OneDrive é ativado por padrão e ele acaba deixando todas as pastas e arquivos criados no seu computador como arquivos em nuvem, ao invés de arquivos locais. Isso também acaba gerando erros em alguns ambientes. Para resolver isso é simples, basta desativar o OneDrive para a pasta do seu projeto ou desativar geral mesmo. Você escolhe. 177 | 178 | Bons estudos galera! 179 | 180 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/394827cdc69b55d9ce888d18aa2ac79fdee0669c) 181 | 182 | ### 9. Instalação Node (Windows / Mac) 183 | 184 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/b465fd0dd9c72eb826f9334b8a7ca582a756977d) 185 | 186 | ### 10. Instalar o Node e o Visual Studio Code no Linux 187 | 188 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/09808acb6c58b1e246904713ce1fa9c08c051fb9) 189 | 190 | ### 11. Configuração do editor (VSCode) 191 | 192 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/23fd005de373eea2db525be1013ab374ace4d82b) 193 | 194 | ### 12. Como abrir os terminais nos sistemas operacionais 195 | 196 | Fala, galera! Tudo bom? 197 | 198 | Recebemos comentários sobre alunos que não sabiam como abrir os terminais usados na aula seguinte, então resolvemos explicar como fazer isso. 199 | 200 | A primeira opção para abrir o terminal em qualquer sistema operacional que estejam usando seja MacOS, Windows ou Linux é a de usar a barra de pesquisa e procurar por termos como prompt (para Windows) ou terminal (para Linux ou MacOS). 201 | 202 | Outra opção é o uso de atalhos de teclado. Para abrir o Prompt de Comando no Windows, vocês podem usar Tecla Windows + R e digitar cmd; para o Linux, podem abrir o terminal usando Ctrl + Alt + T; no MacOS podem usar COMMAND + ESPAÇO e digitar terminal para abrir. 203 | 204 | Para abrir aquela janela de pesquisa no VSCode, o comando é Ctrl + Shift + P. 205 | 206 | Espero que essas dicas sejam úteis para vocês, visto que os prompts serão usados novamente em aulas futuras. 207 | 208 | Ah, aproveito para reiterar: o comando code vem por padrão em Windows, então se a opção de editar no VSCode não aparecer para vocês, não se assustem! 209 | 210 | Bons estudos e até a próxima! 211 | 212 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/85d0f7765c74db0c3dfed3a13b73c5b66946b85c) 213 | 214 | ### 13. Configuração do comando 'code' 215 | 216 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/b8f047ce6e9f42755bced2d54e139b88578663c9) 217 | 218 | ### 14. Instalação do VSCode (Windows) 219 | 220 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/e30f6497377a9a7f5630b68813c37fea5cddd6de) 221 | 222 | ## Seção 3: Iniciando com programação 223 | 224 | ### 15. Introdução do módulo 225 | 226 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/b3a6e635bc304cf94b3dc436999eb08ba5a7f25b) 227 | 228 | ### 16. Conhecendo o Visual Studio Code 229 | 230 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/b56a51d201d581b684a09c625fa50aa29579574e) 231 | 232 | ### 17. Sentença de código 01 233 | 234 | [Arquivo](fundamentos/inicio/sentenca_1.js) 235 | 236 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/aaa528632d1337ec9afb728152d44186f7014e0b) 237 | 238 | ### 18. Sentença de código 02 239 | 240 | [Arquivo](fundamentos/inicio/sentenca_2.js) 241 | 242 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/ead1c8cdbacd81c2a946e20335f9fb13678a6dda) 243 | 244 | ### 19. Comentários de código 245 | 246 | [Arquivo](fundamentos/inicio/comentario.js) 247 | 248 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/b6437ffff99a628e9a2d8bb99883c899098a2201) 249 | 250 | ### 20. Blocos de código 251 | 252 | [Arquivo](fundamentos/inicio/bloco.js) 253 | 254 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/306a8b36e624741e15e009546f6985c89c2e2d54) 255 | 256 | ### 21. Desafio sentença e bloco 257 | 258 | [Arquivo](fundamentos/inicio/desafio_sentenca_bloco.js) 259 | 260 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/cb02411fac0188a8bd5cc0d3abf4a1553be5fbee) 261 | 262 | ### 22. Desafio sentença e bloco - Resposta 263 | 264 | [Arquivo](fundamentos/inicio/desafio_sentenca_bloco_resposta.js) 265 | 266 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/347d17079cbd85897522ed0f8caa2b83d4c8a24c) 267 | 268 | ### 23. Trabalhando com dados 01 269 | 270 | [Arquivo](fundamentos/inicio/dados_1.js) 271 | 272 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/b4125641d776831e442989b1fa7da2f5cf589164) 273 | 274 | ### 24. Trabalhando com dados 02 275 | 276 | [Arquivo](fundamentos/inicio/dados_2.js) 277 | 278 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/b2b46c6b9d3015c8f77d8c4b7bc9038383aa121d) 279 | 280 | ### 25. Trabalhando com dados 03 281 | 282 | [Arquivo](fundamentos/inicio/dados_3.js) 283 | 284 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/9e166019ffc0ecede31608c6f23da408ab691f30) 285 | 286 | ### 26. Trabalhando com dados 04 287 | 288 | [Arquivo](fundamentos/inicio/dados_4.js) 289 | 290 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/b1d8de2de230fd6e32f6e9c7a9374fdccb4fd145) 291 | 292 | ### 27. Desafio Área da Circunferência 293 | 294 | [Arquivo](fundamentos/inicio/desafio_area.js) 295 | 296 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/fb5b35dfcc9ab0126924457ddca66a3304424972) 297 | 298 | ### 28. Desafio área da circunferência - Resposta 299 | 300 | [Arquivo](fundamentos/inicio/desafio_area_resposta.js) 301 | 302 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/25972dcdd50fdaaa185120b26c42dd0b6690fa32) 303 | 304 | ### 29. Desafio troca de valores 305 | 306 | [Arquivo](fundamentos/inicio/desafio_troca.js) 307 | 308 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/a5e7a49b0aa6069e37bc6782fefb75861ad00cbb) 309 | 310 | ### 30. Desafio troca de valores - Resposta 311 | 312 | [Arquivo](fundamentos/inicio/desafio_troca_resposta.js) 313 | 314 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/4ec7819c8ce7428b8eecd012648af3a607ad61c8) 315 | 316 | ## Seção 4: Javascript: Fundamentos 317 | 318 | ### 31. Visão geral de algoritmo 319 | 320 | #### Características dos algoritmos 321 | 322 | * Algoritmos não estão presentes apenas em programação (ex. Receita de bolo) 323 | * Os algoritmos podem ser considerados o verbo dentro da programação 324 | * Sequência de passos 325 | * Suporta o conceito de repetição 326 | * A repetição pode ser por um número *n* de vezes 327 | * A repetição pode ser *até* que um determinado evento ocorra 328 | * Suporta o conceito de tomada de decisão 329 | * Você pode seguir um "caminho" a partir de determinada condição 330 | * Você pode "pular" uma sequência de passos a partir de determinada condição 331 | * A ordem de execução dos passos importa e pode gerar resultados incorretos (Bugs) 332 | * Os algoritmos podem ter comportamentos diferentes: 333 | * Receber um número *n* de entradas e devolver um número *n* de saídas (na maioria das linguagens haverá um retorno) 334 | * Apenas receber uma entrada 335 | * Apenas retornar uma saída 336 | * Não receber nem retornar uma saída 337 | * Os Algoritmos podem ser representados: 338 | * Fluxograma 339 | * Linguagem natural (problema ambiguidade) 340 | * Pseudo-linguagens (ex.: Portugol) 341 | * Linguagem artificial (linguagens de programação) 342 | 343 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/97c666df0c002408ec600ee810fd409efa30b74b) 344 | 345 | ### 32. Visão geral de estruturas de dados 346 | 347 | #### Características das estruturas de dados 348 | 349 | * As estruturas de dados permitem organizar e administrar os dados de uma aplicação 350 | * As estruturas de dados podem ser básicas (ex.: inteira, real, letra, booleana, etc) 351 | * As estruturas de dados podem ser personalizadas (ex.: cliente, produto, etc) 352 | * Os dados que serão utilizados nas estruturas são armazenados em **Variáveis** e **Constantes** 353 | 354 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/13bab2cefd6450eb6f377c1bf542e8b76dd8c99f) 355 | 356 | ### 33. Lembrem-se sempre de salvar o código! 357 | 358 | Fala pessoal! 359 | 360 | Lembrem sempre de salvar o código antes de tentar executar o mesmo. Essa ação é necessária para que o código seja de fato executado. 361 | 362 | No VSCode, você pode salvar com o comando CTRL + S ou COMMAND + S, no MacOS. 363 | 364 | Bons Estudos! 365 | 366 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/3695390890a7d1c8b1eb25ce062024d13c2b6c21) 367 | 368 | ### 34. Configuração do projeto 369 | 370 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/12f255d4df9bb615318a001cfdcd32ccc82143fc) 371 | 372 | ### 35. Organização básica de um código JS 373 | 374 | [Arquivo](fundamentos/organizacao.js) 375 | 376 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/2cd233f24a78d2da0c49b5dcdc010cb736e13979) 377 | 378 | ### 36. Executando JavaScript 379 | 380 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/e815331d375cb0188aff18d6584a2d03f9cf58f5) 381 | 382 | ### 37. Comentários de código 383 | 384 | [Arquivo](fundamentos/comentario.js) 385 | 386 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/1897fa25f9fc4b44b3e45940d63532b89c451c00) 387 | 388 | ### 38. O básico de Var, Let e Const 389 | 390 | [Arquivo](fundamentos/variaveisEConstantes.js) 391 | 392 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/945957bc604afbaec48dfce147236e0d2089098d) 393 | 394 | ### 39. Tipagem fraca 395 | 396 | [Arquivo](fundamentos/tipagemFraca.js) 397 | 398 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/0750c1bbd177f4026cae411b6c2310d77e4b0c8a) 399 | 400 | ### 40. Tipos em JavaScript: Number 401 | 402 | ```js 403 | const peso1 = 1.0; 404 | const peso2 = Number('2.0'); 405 | 406 | console.log(peso1, peso2); 407 | // retorna se o número é inteiro ou não 408 | console.log(Number.isInteger(peso1)); 409 | console.log(Number.isInteger(peso2)); 410 | 411 | const avaliacao1 = 9.871; 412 | const avaliacao2 = 6.871; 413 | 414 | const total = avaliacao1 * peso1 + avaliacao2 * peso2; 415 | const media = total / (peso1 + peso2); 416 | 417 | // Determina o número de casas decimais 418 | console.log(media.toFixed(2)); 419 | 420 | // Retorna o número como string 421 | console.log(media.toString()); 422 | 423 | // Retorna o número em binário com o parâmetro 2 424 | console.log(media.toString(2)); 425 | 426 | // retorna o tipo do dado 427 | console.log(typeof media); 428 | 429 | // retorna o tipo de dado de Number 430 | console.log(Number); 431 | ``` 432 | 433 | [Arquivo](fundamentos/numeros.js) 434 | 435 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/1e4e228d1b65ad8713d28ab5faeb8a4840268934) 436 | 437 | ### 41. Number: Alguns cuidados 438 | 439 | [Arquivo](fundamentos/numerosAlgunsCuidados.js) 440 | 441 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/9275bd889e4aa5d182ce01a0ddb6498a90a6bb85) 442 | 443 | ### 42. Usando Math 444 | 445 | [Arquivo](fundamentos/math.js) 446 | 447 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/385d2e2976191d4fa39ce03a3a71c3c11dc2f877) 448 | 449 | ### 43. Tipos em JavaScript: String 450 | 451 | [Arquivo](fundamentos/strings.js) 452 | 453 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/d50fba156202536db58c2c63790eeee3aaa907af) 454 | 455 | ### 44. Usando Template Strings 456 | 457 | [Arquivo](fundamentos/templateString.js) 458 | 459 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/e289cdcd23067130db4f5725aa1293e67504e912) 460 | 461 | ### 45. Tipos em JavaScript: Boolean 462 | 463 | [Arquivo](fundamentos/booleanos.js) 464 | 465 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/ce51e090158307b4e73a297df92e09f67f54225e) 466 | 467 | ### 46. Tipos em JavaScript: Array 468 | 469 | [Arquivo](fundamentos/arrays.js) 470 | 471 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/4350779c232ac00532f30a34a34145e6d266db6f) 472 | 473 | ### 47. Tipos em JavaScript: Object 474 | 475 | [Arquivo](fundamentos/objeto.js) 476 | 477 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/c5082bfec5c3eab06358629807f3ec4e3bf9ef90) 478 | 479 | ### 48. Entendendo o Null e o Undefined 480 | 481 | [Arquivo](fundamentos/nullUndefined.js) 482 | 483 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/9c784ede8ba653e6ec01909495a9dafcb84a7b03) 484 | 485 | ### 49. Quase tudo é função! 486 | 487 | [Arquivo](fundamentos/funcaoEmQuaseTudo.js) 488 | 489 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/1d389f6510334a167f05fb3f361acc5512913415) 490 | 491 | ### 50. Exemplos básicos de funções 01 492 | 493 | [Arquivo](fundamentos/funcao1.js) 494 | 495 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/8893024c20bc0d77651a740f6b529282e474552c) 496 | 497 | ### 51. Exemplos básicos de funções 02 498 | 499 | [Arquivo](fundamentos/funcao2.js) 500 | 501 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/a6f382c00a083d35d24392cd83d72e7b62cb3360) 502 | 503 | ### 52. Declaração de variáveis com var 01 504 | 505 | [Arquivo](fundamentos/usandoVar1.js) 506 | 507 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/97f43eef1f18f3cd1c249af2b4ca0b6d74535b63) 508 | 509 | ### 53. Declaração de variáveis com var 02 510 | 511 | [Arquivo](fundamentos/usandoVar2.js) 512 | 513 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/b62981eb165b18edda98158fe31954878392b128) 514 | 515 | ### 54. Declaração de variáveis com Let 516 | 517 | [Arquivo](fundamentos/usandoLet1.js) 518 | 519 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/eb0139b9c41d0e057aa4bc71a81ad4c2bea24aa3) 520 | 521 | ### 55. Usando Var em Loop 01 522 | 523 | [Arquivo](fundamentos/usandoVarEmLoop.js) 524 | 525 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/e705e4753f8f43328e61e96dd308b829c2c62103) 526 | 527 | ### 56. Usando Let em Loop 01 528 | 529 | [Arquivo](fundamentos/usandoLetEmLoop1.js) 530 | 531 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/fd7f24e97a045dccd1e3f46607cdb5338e7b2fa4) 532 | 533 | ### 57. Usando Var em Loop 02 534 | 535 | [Arquivo](fundamentos/usandoVarEmLoop2.js) 536 | 537 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/f725607b2b68fe3c70557b0422023f5a2e30765e) 538 | 539 | ### 58. Usando Let em Loop 02 540 | 541 | [Arquivo](fundamentos/usandoLetEmLoop2.js) 542 | 543 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/5e88db5b65be6b06143ce70d4f3951c889a3cd21) 544 | 545 | ### 59. Entendendo o Hoisting 546 | 547 | [Arquivo](fundamentos/hoisting.js) 548 | 549 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/852505731571a040b985ebd0fe4df9cd907d6406) 550 | 551 | ### 60. Função vs Objeto 552 | 553 | [Arquivo](fundamentos/objeto2.js) 554 | 555 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/0ead0d49eee0ea4134256601dd9e3df866b1bb56) 556 | 557 | ### 61. Par Nome/Valor 558 | 559 | [Arquivo](fundamentos/parNomeValor.js) 560 | 561 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/e9fc4eaed559d1ae20c74b626ec4d45ba880bca2) 562 | 563 | ### 62. Notação ponto 564 | 565 | [Arquivo](fundamentos/notacaoPonto.js) 566 | 567 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/81a4ff0f03c99faee51de7d22b252adb20882804) 568 | 569 | ### 63. Operadores: Atribuição 570 | 571 | [Arquivo](fundamentos/atribuicao.js) 572 | 573 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/0e1ae671539d30cc4548ec3c03494122b45da206) 574 | 575 | ### 64. Operadores: Destructuring 01 576 | 577 | [Arquivo](fundamentos/destructuring1.js) 578 | 579 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/c0a1efefd93de3cff15e65d6a334dcacae45adf2) 580 | 581 | ### 65. Operadores: Destructuring 02 582 | 583 | [Arquivo](fundamentos/destructuring2.js) 584 | 585 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/70938cd1867cc78c5993b9f320b793a5cdb66197) 586 | 587 | ### 66. Operadores: Destructuring 03 588 | 589 | [Arquivo](fundamentos/destructuring3.js) 590 | 591 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/f02e53c69cfa43c3750e4cef05a8e56fc6b06272) 592 | 593 | ### 67. Operadores: Destructuring 03 594 | 595 | [Arquivo](fundamentos/destructuring4.js) 596 | 597 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/12009a968b04d2d4e5e4b3aa1520d4fc7145d2b6) 598 | 599 | ### 68. Operadores aritméticos 600 | 601 | [Arquivo](fundamentos/aritmeticos.js) 602 | 603 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/5b2377b4a4b5ec091b6271f1484c9f04ce0e98ba) 604 | 605 | ### 69. Operadores: relacionais 606 | 607 | [Arquivo](fundamentos/relacionais.js) 608 | 609 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/4c7166f4a96ffb4b886786794499916d7d72ab69) 610 | 611 | ### 70. Operadores lógicos 612 | 613 | [Arquivo](fundamentos/logicos.js) 614 | 615 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/23abac9dfffd3d74bc719b14b09b7d916194de5a) 616 | 617 | ### 71. Operadores unários 618 | 619 | [Arquivo](fundamentos/unarios.js) 620 | 621 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/452aa725b1333dcfc8b03e19001be583ee3f36bd) 622 | 623 | ### 72. Operadores ternários 624 | 625 | [Arquivo](fundamentos/ternario.js) 626 | 627 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/1f4e75dfcd814d94f6490deb23fab2f77b3d1b91) 628 | 629 | ### 73. Contexto de execução: Browser vs Node 630 | 631 | [Arquivo](fundamentos/experimentos.js) 632 | 633 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/7f659176fb969f2bbf4c1884efd2501774f16e1e) 634 | 635 | ### 74. Tratamento de Erro (Try/Catch/Throw) 636 | 637 | [Arquivo](fundamentos/erro.js) 638 | 639 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/24e4508d2ed4e794c1f1b6fb7697d97736d815d9) 640 | 641 | ### 75. Recursos 642 | 643 | [Arquivo pdf](assets/75-Recursos.pdf) 644 | 645 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/76445d736d33ad0b7dcd63143479513004bbc05d) 646 | 647 | ## Seção 5: Javascript: Estruturas de controle 648 | 649 | ### 76. Visão geral do capítulo 650 | 651 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/ad3f406f287cd85d744daaf4352208f430b03e9d) 652 | 653 | ### 77. Usando a estrutura if 01 654 | 655 | [Arquivo](controle/if1.js) 656 | 657 | [Commit](https://github.com/Alexandresl/Web-Moderno-com-JavaScript/commit/9dff514111bfb4c15397b71ea572e4499bd05a6d) 658 | 659 | ### 78. Usando a estrutura if 02 660 | 661 | [Arquivo](controle/if2.js) 662 | 663 | [Commit]() -------------------------------------------------------------------------------- /assets/75-Recursos.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Alexandresl/Web-Moderno-com-JavaScript/bf48aa08cf6ba4a0624760ad1d086f3c94b6b4cb/assets/75-Recursos.pdf -------------------------------------------------------------------------------- /controle/if1.js: -------------------------------------------------------------------------------- 1 | function soBoaNoticia(nota) { 2 | if (nota >= 7) { 3 | console.log("Aprovado com " + nota); 4 | } 5 | } 6 | 7 | soBoaNoticia(8.1); 8 | soBoaNoticia(6.1); 9 | 10 | function seForVerdadeEuFalo(valor) { 11 | if (valor) { 12 | console.log("É verade... " + valor); 13 | } 14 | } 15 | 16 | seForVerdadeEuFalo(); // false 17 | seForVerdadeEuFalo(null); // false 18 | seForVerdadeEuFalo(undefined); // false 19 | seForVerdadeEuFalo(NaN); // false 20 | seForVerdadeEuFalo(''); // false 21 | seForVerdadeEuFalo(0); // false 22 | seForVerdadeEuFalo(-1); 23 | seForVerdadeEuFalo(" "); 24 | seForVerdadeEuFalo("?"); 25 | seForVerdadeEuFalo([]); 26 | seForVerdadeEuFalo([1, 2]); 27 | seForVerdadeEuFalo({}); -------------------------------------------------------------------------------- /controle/if2.js: -------------------------------------------------------------------------------- 1 | function teste1(num) { 2 | if (num > 7) 3 | console.log(num); 4 | 5 | console.log("Final"); 6 | } 7 | 8 | teste1(6); 9 | teste1(8); 10 | 11 | function teste2 (num) { 12 | 13 | if (num > 7); { // cuidado com o ponto e vírgula 14 | console.log(num); 15 | } 16 | 17 | } 18 | 19 | teste2(6) 20 | teste2(8) -------------------------------------------------------------------------------- /fundamentos/aritmeticos.js: -------------------------------------------------------------------------------- 1 | const [a, b, c, d] = [3, 5, 1, 15]; 2 | 3 | const soma = a + b + c + d; 4 | const subtracao = d - b; 5 | const multiplicacao = a * b; 6 | const divisao = d / a; 7 | const modulo = a % 2; 8 | 9 | console.log(soma, subtracao, multiplicacao, divisao, modulo); 10 | -------------------------------------------------------------------------------- /fundamentos/arrays.js: -------------------------------------------------------------------------------- 1 | const valores = [7.7, 8.9, 6.3, 9.2]; 2 | console.log(valores[0], valores[3]); 3 | console.log(valores[4]); 4 | 5 | valores[4] = 10; 6 | console.log(valores); 7 | 8 | console.log(valores.length); 9 | 10 | valores.push({id: 3}, false, null, "teste"); 11 | 12 | console.log(valores); 13 | 14 | console.log(valores.pop()); 15 | 16 | delete valores[0]; 17 | console.log(valores); 18 | 19 | console.log(typeof valores); -------------------------------------------------------------------------------- /fundamentos/atribuicao.js: -------------------------------------------------------------------------------- 1 | const a = 7; 2 | let b = 3; 3 | 4 | b += a; 5 | console.log(b); 6 | b -= 4; 7 | console.log(b); 8 | b *= 2; 9 | console.log(b); 10 | b /= 2; 11 | console.log(b); 12 | b %= 2; 13 | console.log(b); -------------------------------------------------------------------------------- /fundamentos/booleanos.js: -------------------------------------------------------------------------------- 1 | let isAtivo = false; 2 | 3 | console.log(isAtivo); // false 4 | 5 | isAtivo = true; 6 | 7 | console.log(isAtivo); // true 8 | 9 | isAtivo = 1; 10 | 11 | console.log(!!isAtivo); // true 12 | 13 | isAtivo = 0; 14 | 15 | console.log(!!isAtivo); // false 16 | 17 | console.log(); 18 | console.log("Os tipos verdadeiros são:"); 19 | console.log(!!3); // true 20 | console.log(!!-1); // true 21 | console.log(!!" "); // true 22 | console.log(!!"Texto"); // true 23 | console.log(!![]); // true 24 | console.log(!!{}); // true 25 | console.log(!!Infinity); // true 26 | console.log(!!(isAtivo = true)); // true 27 | 28 | console.log(); 29 | console.log("Os tipos falsos são:"); 30 | console.log(!!0); 31 | console.log(!!""); 32 | console.log(!!null); 33 | console.log(!!NaN); 34 | console.log(!!undefined); 35 | console.log(!!(isAtivo = false)); 36 | 37 | console.log(); 38 | console.log("Para finalizar.."); 39 | console.log(!!('' || null || 0 || " ")); -------------------------------------------------------------------------------- /fundamentos/comentario.js: -------------------------------------------------------------------------------- 1 | // Comentário de uma linha 2 | console.log("Linha 1"); 3 | 4 | /** 5 | * Comentário de 6 | * múltiplas linhas 7 | */ 8 | console.log("Linha 2"); -------------------------------------------------------------------------------- /fundamentos/destructuring1.js: -------------------------------------------------------------------------------- 1 | // Recurso do ES2015 2 | 3 | const pessoa = { 4 | nome: "Ana", 5 | idade: 5, 6 | endereco: { 7 | logradouro: 'Rua ABC', 8 | numero: 1000 9 | } 10 | } 11 | 12 | const {nome, idade} = pessoa; 13 | console.log(nome, idade); 14 | 15 | const {nome: n, idade: i} = pessoa; 16 | console.log(n, i); 17 | 18 | const {sobrenome, bemHumorada = true} = pessoa; 19 | console.log(sobrenome, bemHumorada); 20 | 21 | const {endereco: {logradouro, numero, cep}} = pessoa 22 | 23 | console.log(logradouro, numero, cep); -------------------------------------------------------------------------------- /fundamentos/destructuring2.js: -------------------------------------------------------------------------------- 1 | const [a] = [10]; 2 | console.log(a); 3 | 4 | const [n1, ,n3, , n5, n6 = 0] = [10, 7, 9, 8] 5 | console.log(n1, n3, n5, n6); 6 | 7 | const [, [, nota]] = [[, 8, 8], [9, 6, 8]]; 8 | console.log(nota); -------------------------------------------------------------------------------- /fundamentos/destructuring3.js: -------------------------------------------------------------------------------- 1 | function rand({min = 0, max = 1000}) { 2 | const valor = Math.random() * (max - min) + min; 3 | return Math.floor(valor); 4 | } 5 | 6 | const obj = {max: 50, min: 40}; 7 | console.log(rand(obj)); 8 | console.log(rand({min: 955})); 9 | console.log(rand({max: 10})); 10 | console.log(rand({})); 11 | console.log(rand()); -------------------------------------------------------------------------------- /fundamentos/destructuring4.js: -------------------------------------------------------------------------------- 1 | function rand([min = 0, max = 1000]) { 2 | if (min > max) { 3 | [min, max] = [max, min]; 4 | } 5 | const valor = Math.random() * (max - min) + min; 6 | return Math.floor(valor); 7 | } 8 | 9 | console.log(rand([50, 40])); 10 | console.log(rand([922])); 11 | console.log(rand([, 10])); 12 | console.log(rand([])); 13 | // console.log(rand()); // Gera erro -------------------------------------------------------------------------------- /fundamentos/erro.js: -------------------------------------------------------------------------------- 1 | function tratarErroELancar(erro) { 2 | 3 | // throw new Error("..."); 4 | // throw 10; 5 | // throw "Mensagem Legal"; 6 | 7 | throw { 8 | nome: erro.name, 9 | msg: erro.message, 10 | date: new Date 11 | } 12 | 13 | } 14 | 15 | function imprimirNomeGritado(obj) { 16 | 17 | try { 18 | console.log(obj.name.toUpperCase() + "!!!"); 19 | } catch (e) { 20 | tratarErroELancar(e); 21 | } finally { 22 | console.log("final"); 23 | } 24 | 25 | } 26 | 27 | const obj = {nome: "Roberto"} 28 | 29 | imprimirNomeGritado(obj); -------------------------------------------------------------------------------- /fundamentos/experimentos.js: -------------------------------------------------------------------------------- 1 | let a = 3; 2 | global.b = 123; 3 | this.c = 456; 4 | this.d = false; 5 | this.e = "teste"; 6 | 7 | console.log(a); 8 | console.log(global.b); 9 | console.log(this.c); 10 | console.log(module.exports.c); 11 | console.log(this === module.exports); 12 | 13 | console.log(module.exports); 14 | abc = 3; 15 | console.log(global.abc); 16 | -------------------------------------------------------------------------------- /fundamentos/funcao1.js: -------------------------------------------------------------------------------- 1 | // função sem retorno 2 | function imprimirSoma(a, b) { 3 | console.log(a + b); 4 | } 5 | 6 | imprimirSoma(2, 3); // 5 7 | imprimirSoma(2); // NaN 8 | imprimirSoma(2, 10, 4, 5, 6); // 5 9 | imprimirSoma(); // NaN 10 | 11 | function soma(a, b = 1) { 12 | return a + b; 13 | } 14 | 15 | console.log(soma(2, 3)); // 5 16 | console.log(soma(2)); // 3 -------------------------------------------------------------------------------- /fundamentos/funcao2.js: -------------------------------------------------------------------------------- 1 | // Armazenando uma função em uma variável 2 | 3 | const imprimirSoma = function (a, b) { 4 | console.log(a + b); 5 | } 6 | 7 | imprimirSoma(2, 3); 8 | 9 | // Armazenando uma função arrow em uma variável 10 | 11 | const soma = (a, b) => { 12 | return a + b; 13 | } 14 | 15 | console.log(soma(2, 3)); 16 | 17 | // retorno implícito 18 | 19 | const subtracao = (a, b) => a - b; 20 | 21 | console.log(subtracao(2, 3)); 22 | 23 | // Mais reduzido com um único parâmetro 24 | 25 | const imprimir2 = a => console.log(a); 26 | imprimir2("Legal!!!"); -------------------------------------------------------------------------------- /fundamentos/funcaoEmQuaseTudo.js: -------------------------------------------------------------------------------- 1 | console.log(typeof Object); // function 2 | 3 | class Produto{} 4 | console.log(typeof Produto); // function 5 | 6 | -------------------------------------------------------------------------------- /fundamentos/hoisting.js: -------------------------------------------------------------------------------- 1 | console.log('a =', a); // a = undefined 2 | var a = 2; 3 | console.log('a =', a); // a = 2 4 | 5 | 6 | // console.log('b =', b); // a = undefined 7 | let b = 2; 8 | console.log('b =', a); // a = 2 -------------------------------------------------------------------------------- /fundamentos/inicio/bloco.js: -------------------------------------------------------------------------------- 1 | { 2 | console.log("Passo #01"); 3 | console.log("Passo #02"); 4 | console.log("Passo #03"); 5 | } 6 | 7 | { 8 | console.log("Passo #04"); 9 | console.log("Passo #05"); 10 | } 11 | 12 | { 13 | { 14 | { 15 | { 16 | ; 17 | ; 18 | ; 19 | } 20 | } 21 | } 22 | } 23 | 24 | console.log("Fim"); -------------------------------------------------------------------------------- /fundamentos/inicio/comentario.js: -------------------------------------------------------------------------------- 1 | // Console.log é usado para exibir algo na tela do computador! 2 | console.log("Passo #03"); 3 | console.log("Passo #01"); // mais um exemplo de console.log 4 | // console.log("Passo #02"); 5 | 6 | /** 7 | * Este é um 8 | * comentário 9 | * de múltiplas 10 | * linhas 11 | */ 12 | 13 | console.log("Passo #02"); -------------------------------------------------------------------------------- /fundamentos/inicio/dados_1.js: -------------------------------------------------------------------------------- 1 | var nome = "Caneta"; 2 | var quantidade = 10; 3 | var preco = 6.4; 4 | var imposto = 1.5; 5 | var precoFinal = preco + imposto; 6 | 7 | console.log(nome); 8 | console.log(quantidade); 9 | console.log(preco); 10 | console.log(imposto); 11 | console.log(precoFinal); -------------------------------------------------------------------------------- /fundamentos/inicio/dados_2.js: -------------------------------------------------------------------------------- 1 | let preco = 19.90; 2 | let desconto = 0.4; 3 | let precoComDesconto = preco * (1 - desconto); 4 | 5 | console.log(precoComDesconto); -------------------------------------------------------------------------------- /fundamentos/inicio/dados_3.js: -------------------------------------------------------------------------------- 1 | let idade = 31; 2 | console.log(idade + " é do tipo", typeof idade); 3 | 4 | let salario = 4578.32; 5 | console.log(salario + " é do tipo", typeof idade); 6 | 7 | let estaChovendo = false 8 | console.log(estaChovendo + " é do tipo", typeof estaChovendo); 9 | 10 | let nome = "João"; 11 | console.log(nome + " é do tipo", typeof nome); 12 | -------------------------------------------------------------------------------- /fundamentos/inicio/dados_4.js: -------------------------------------------------------------------------------- 1 | const a = 3; 2 | 3 | // a = 10; 4 | 5 | console.log(a); -------------------------------------------------------------------------------- /fundamentos/inicio/desafio_area.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Fórmula da área da circunferência: 3 | * PI * Raio² 4 | * 5 | * PI = 3.14 6 | */ 7 | 8 | const PI = 3.1415; 9 | let raio = 10; 10 | let area = PI * Math.pow(raio, 2); 11 | 12 | console.log("A área da circunferência é:", area); -------------------------------------------------------------------------------- /fundamentos/inicio/desafio_area_resposta.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Fórmula da área da circunferência: 3 | * PI * Raio² 4 | * 5 | * PI = 3.14 6 | */ 7 | 8 | const PI = 3.141592; 9 | const raio = 10; 10 | const areaCirc = PI * raio * raio; 11 | 12 | console.log("O valor da área é " + areaCirc + "m²"); -------------------------------------------------------------------------------- /fundamentos/inicio/desafio_sentenca_bloco.js: -------------------------------------------------------------------------------- 1 | /** 2 | * // bloco do números ímpares 3 | * 1 4 | * 3 5 | * 5 6 | * 7 7 | * 9 8 | * 9 | * // Bloco dos números pares 10 | * 2 11 | * 4 12 | * 6 13 | * 8 14 | * 15 | */ 16 | 17 | { 18 | console.log(1); 19 | console.log(3); 20 | console.log(5); 21 | console.log(7); 22 | console.log(9); 23 | } 24 | 25 | { 26 | console.log(2); 27 | console.log(4); 28 | console.log(6); 29 | console.log(8); 30 | console.log(10); 31 | } -------------------------------------------------------------------------------- /fundamentos/inicio/desafio_sentenca_bloco_resposta.js: -------------------------------------------------------------------------------- 1 | { 2 | console.log(1); 3 | console.log(3); 4 | console.log(5); 5 | console.log(7); 6 | console.log(9); 7 | } 8 | 9 | { 10 | console.log(2); 11 | console.log(4); 12 | console.log(6); 13 | console.log(8); 14 | console.log(10); 15 | } -------------------------------------------------------------------------------- /fundamentos/inicio/desafio_troca.js: -------------------------------------------------------------------------------- 1 | let a = 7; 2 | let b = 94; 3 | 4 | // Depois da troca... a = 94 e b = 7 5 | 6 | let temp = a; 7 | a = b; 8 | b = temp; 9 | 10 | console.log("a = " + a); 11 | console.log("b = " + b) -------------------------------------------------------------------------------- /fundamentos/inicio/desafio_troca_resposta.js: -------------------------------------------------------------------------------- 1 | let a = 7; 2 | let b = 94; 3 | 4 | let temp = a; 5 | a = b; 6 | b = temp; 7 | 8 | // Depois da troca... a = 94 e b = 7 9 | // [a, b] = [b, a] 10 | 11 | console.log("a = " + a); 12 | console.log("b = " + b) -------------------------------------------------------------------------------- /fundamentos/inicio/sentenca_1.js: -------------------------------------------------------------------------------- 1 | // Sentença de código 2 | console.log("Bom dia!"); 3 | console.log("Boa tarde!"); 4 | console.log("Boa noite!"); -------------------------------------------------------------------------------- /fundamentos/inicio/sentenca_2.js: -------------------------------------------------------------------------------- 1 | console.log("Passo #03"); 2 | console.log("Passo #01"); 3 | console.log("Passo #02"); -------------------------------------------------------------------------------- /fundamentos/logicos.js: -------------------------------------------------------------------------------- 1 | function compras(trabalho1, trabalho2) { 2 | 3 | const comprarSorvete = trabalho1 || trabalho2; 4 | const comprarTv50 = trabalho1 && trabalho2; 5 | // const comprarTv32 = !!(trabalho1 ^ trabalho2); // bitwise xor 6 | const comprarTv32 = trabalho1 != trabalho2; 7 | const manterSaudavel = !comprarSorvete; 8 | 9 | return { 10 | comprarSorvete, 11 | comprarTv50, 12 | comprarTv32, 13 | manterSaudavel 14 | } 15 | 16 | } 17 | 18 | console.log(compras(true, true)); 19 | console.log(compras(true, false)); 20 | console.log(compras(false, true)); 21 | console.log(compras(false, false)); -------------------------------------------------------------------------------- /fundamentos/math.js: -------------------------------------------------------------------------------- 1 | const raio = 5.6; 2 | 3 | let area = Math.PI * Math.pow(raio, 2); 4 | 5 | console.log(area.toFixed(2)); 6 | 7 | area = Math.PI * raio**2; 8 | 9 | console.log(area.toFixed(2)); -------------------------------------------------------------------------------- /fundamentos/notacaoPonto.js: -------------------------------------------------------------------------------- 1 | console.log(Math.ceil(6.1)); 2 | 3 | const obj1 = {} 4 | const obj2 = {} 5 | obj1.nome = "Bola"; 6 | obj2['nome'] = "Bola2"; 7 | 8 | console.log(obj1.nome); 9 | console.log(obj2.nome); 10 | 11 | function Obj(nome) { 12 | this.nome = nome; 13 | this.exec = function () { 14 | console.log("Exec..."); 15 | } 16 | } 17 | 18 | const obj3 = new Obj("Maria"); 19 | const obj4 = new Obj("João"); 20 | 21 | console.log(obj3.nome); 22 | console.log(obj4.nome); 23 | obj4.exec() -------------------------------------------------------------------------------- /fundamentos/nullUndefined.js: -------------------------------------------------------------------------------- 1 | let valor // não inicializada 2 | 3 | console.log(valor); // undefined 4 | 5 | valor = null; // Não aponta para nenhum endereço de memória 6 | 7 | console.log(valor); // null 8 | 9 | // console.log(valor.toString()); // Erro! 10 | 11 | const produto = {} 12 | console.log(produto.preco); // undefined 13 | console.log(produto); // {} 14 | 15 | produto.preco = 3.5; 16 | 17 | console.log(produto); // { preco: 3.5 } 18 | 19 | produto.preco = undefined; // Evite 20 | console.log(!!produto.preco); // false 21 | // delete produto.preco 22 | console.log(produto); // { preco: undefined } 23 | 24 | produto.preco = null // sem preço 25 | console.log(!!produto.preco); // false 26 | 27 | console.log(produto); // { preco: null } -------------------------------------------------------------------------------- /fundamentos/numeros.js: -------------------------------------------------------------------------------- 1 | const peso1 = 1.0; 2 | const peso2 = Number('2.0'); 3 | 4 | console.log(peso1, peso2); 5 | // retorna se o número é inteiro ou não 6 | console.log(Number.isInteger(peso1)); 7 | console.log(Number.isInteger(peso2)); 8 | 9 | const avaliacao1 = 9.871; 10 | const avaliacao2 = 6.871; 11 | 12 | const total = avaliacao1 * peso1 + avaliacao2 * peso2; 13 | const media = total / (peso1 + peso2); 14 | 15 | // Determina o número de casas decimais 16 | console.log(media.toFixed(2)); 17 | 18 | // Retorna o número como string 19 | console.log(media.toString()); 20 | 21 | // Retorna o número em binário com o parâmetro 2 22 | console.log(media.toString(2)); 23 | 24 | // retorna o tipo do dado 25 | console.log(typeof media); 26 | 27 | // retorna o tipo de dado de Number 28 | console.log(Number); -------------------------------------------------------------------------------- /fundamentos/numerosAlgunsCuidados.js: -------------------------------------------------------------------------------- 1 | console.log(7 / 0); // Infinity 2 | 3 | console.log("10" / 2); // 5 4 | 5 | console.log("Show!" * 2); // NaN 6 | 7 | console.log(0.1 + 0.7); // 0.7999999999999999 8 | 9 | console.log((10).toString()); // 10 - Sem o parênteses não funciona 10 | 11 | console.log("3" + 2); // 32 -------------------------------------------------------------------------------- /fundamentos/objeto.js: -------------------------------------------------------------------------------- 1 | const prod1 = {}; 2 | 3 | console.log(typeof prod1); 4 | 5 | prod1.nome = "Celular Ultra Mega"; 6 | prod1.preco = 4998.90; 7 | prod1["desconto legal"] = 0.4; // Evitar pois é escroto 8 | 9 | console.log(prod1); 10 | 11 | const prod2 = { 12 | nome: "Camisa Polo", 13 | preco: 79.90, 14 | obj: { 15 | blablabla: 1, 16 | obj: { 17 | blablabla: 2 18 | } 19 | } 20 | } 21 | 22 | console.log(prod2); -------------------------------------------------------------------------------- /fundamentos/objeto2.js: -------------------------------------------------------------------------------- 1 | console.log(typeof Object); 2 | console.log(typeof new Object); 3 | 4 | const Cliente = function() { 5 | 6 | } 7 | 8 | console.log(typeof Cliente); 9 | console.log(typeof new Cliente); 10 | 11 | class Produto { 12 | 13 | } 14 | 15 | console.log(typeof Produto); 16 | console.log(typeof new Produto); -------------------------------------------------------------------------------- /fundamentos/organizacao.js: -------------------------------------------------------------------------------- 1 | // Sentença de código 2 | console.log("Sentença de código"); 3 | 4 | // Bloco de código 5 | { 6 | { 7 | console.log("Olá"); 8 | console.log("Mundo!"); 9 | } 10 | } -------------------------------------------------------------------------------- /fundamentos/parNomeValor.js: -------------------------------------------------------------------------------- 1 | // par nome/valor 2 | 3 | const saudacao = 'Opa'; // contexto léxico 1 4 | 5 | function exec() { 6 | const saudacao = 'Falaaaa'; // contexto léxico 2 7 | return saudacao; 8 | } 9 | 10 | // Objetos são grupos aninhados de pares nome/valor 11 | 12 | const cliente = { 13 | nome: 'Pedro', 14 | idade: 32, 15 | peso: 90, 16 | endereco: { 17 | logradouro: 'Rua Muito Legal', 18 | numero: 123 19 | } 20 | } 21 | 22 | console.log(saudacao); 23 | console.log(exec()); 24 | console.log(cliente); -------------------------------------------------------------------------------- /fundamentos/relacionais.js: -------------------------------------------------------------------------------- 1 | console.log("01)", '1' == 1); 2 | console.log("02)", '1' === 1); 3 | console.log("03)", '3' != 3); 4 | console.log("04)", '3' !== 3); 5 | console.log("05)", 3 < 2); 6 | console.log("06)", 3 > 2); 7 | console.log("07)", 3 <= 2); 8 | console.log("08)", 3 >= 2); 9 | 10 | const d1 = new Date(0); 11 | const d2 = new Date(0); 12 | 13 | console.log("09)", d1 == d2); 14 | console.log("10)", d1 === d2); 15 | console.log("11)", d1.getTime() === d2.getTime()); 16 | 17 | console.log("12)", undefined == null); 18 | console.log("13)", undefined === null); -------------------------------------------------------------------------------- /fundamentos/strings.js: -------------------------------------------------------------------------------- 1 | const escola = "Cod3r"; 2 | 3 | console.log(escola.charAt(4)); // r 4 | console.log(escola.charAt(5)); // não existe 5 | console.log(escola.charCodeAt(3)); // 51 6 | console.log(escola.indexOf("3")); // 3 7 | console.log(escola.substring(1)); // od3r 8 | console.log(escola.substring(0, 3)); // cod 9 | 10 | console.log("Escola ".concat(escola).concat("!")); // Escola Cod3r! 11 | console.log(escola.replace(3, "e")); // Coder 12 | console.log('Ana,Maria,Pedro'.split(",")); // [ 'Ana', 'Maria', 'Pedro' ] -------------------------------------------------------------------------------- /fundamentos/templateString.js: -------------------------------------------------------------------------------- 1 | const nome = "Rebeca" 2 | const concatenacao = "Olá " + nome + "!"; 3 | 4 | const template = ` 5 | Olá 6 | ${nome}! 7 | `; 8 | 9 | console.log(concatenacao, template); 10 | 11 | console.log(`1 + 1 = ${1 + 1}`); 12 | 13 | const up = texto => texto.toUpperCase(); 14 | 15 | console.log(`Ei... ${up("cuidado")}!`); -------------------------------------------------------------------------------- /fundamentos/ternario.js: -------------------------------------------------------------------------------- 1 | const resultado = nota => nota >=7 ? "Aprovado" : "Reprovado"; 2 | 3 | console.log(resultado(7.1)); 4 | console.log(resultado(6.7)); -------------------------------------------------------------------------------- /fundamentos/tipagemFraca.js: -------------------------------------------------------------------------------- 1 | let qualquer = "Legal"; 2 | console.log(qualquer); 3 | console.log(typeof qualquer); 4 | 5 | qualquer = 3.1516 6 | console.log(qualquer); 7 | console.log(typeof qualquer); 8 | 9 | // Evitar nome genérico e siglas 10 | let valor = ''; 11 | let numero = ''; 12 | let pqp = false // Produto Químico Perigoso... kkk -------------------------------------------------------------------------------- /fundamentos/unarios.js: -------------------------------------------------------------------------------- 1 | let num1 = 1; 2 | let num2 = 2; 3 | 4 | num1++; 5 | console.log(num1); 6 | --num1; 7 | console.log(num1); 8 | 9 | console.log(++num1 === num2--); 10 | console.log(num1 === num2); -------------------------------------------------------------------------------- /fundamentos/usandoLet1.js: -------------------------------------------------------------------------------- 1 | var numero = 1; 2 | 3 | { 4 | let numero = 2; 5 | console.log("Dentro = ", numero); 6 | } 7 | 8 | console.log("Fora = ", numero); -------------------------------------------------------------------------------- /fundamentos/usandoLetEmLoop1.js: -------------------------------------------------------------------------------- 1 | for (let i = 0; i < 10; i++) { 2 | console.log(i);; 3 | } 4 | 5 | // console.log("i =", i); // Gera erro -------------------------------------------------------------------------------- /fundamentos/usandoLetEmLoop2.js: -------------------------------------------------------------------------------- 1 | const funcs = []; 2 | 3 | for (let i = 0; i < 10; i++) { 4 | funcs.push(function () { 5 | console.log(i); 6 | }) 7 | } 8 | 9 | funcs[2]() 10 | funcs[8]() -------------------------------------------------------------------------------- /fundamentos/usandoVar1.js: -------------------------------------------------------------------------------- 1 | { 2 | { 3 | { 4 | { 5 | var sera = "Será???"; 6 | console.log(sera); 7 | } 8 | } 9 | } 10 | } 11 | 12 | console.log(sera); 13 | 14 | function teste() { 15 | var local = 123; 16 | console.log(local); 17 | } 18 | 19 | teste(); 20 | // console.log(local); // Gera erro -------------------------------------------------------------------------------- /fundamentos/usandoVar2.js: -------------------------------------------------------------------------------- 1 | var numero = 1; 2 | 3 | { 4 | var numero = 2; 5 | console.log("Dentro = ", numero); 6 | } 7 | 8 | console.log("Fora = ", numero); -------------------------------------------------------------------------------- /fundamentos/usandoVarEmLoop1.js: -------------------------------------------------------------------------------- 1 | for (var i = 0; i < 10; i++) { 2 | console.log(i); 3 | } 4 | 5 | console.log('i =', i); -------------------------------------------------------------------------------- /fundamentos/usandoVarEmLoop2.js: -------------------------------------------------------------------------------- 1 | const funcs = []; 2 | 3 | for (var i = 0; i < 10; i++) { 4 | funcs.push(function () { 5 | console.log(i); 6 | }) 7 | } 8 | 9 | funcs[2]() 10 | funcs[8]() -------------------------------------------------------------------------------- /fundamentos/variaveisEConstantes.js: -------------------------------------------------------------------------------- 1 | var a = 3; 2 | let b = 4; 3 | 4 | a = 30; 5 | b = 40; 6 | 7 | console.log(a, b); 8 | 9 | a = 300; 10 | b = 400; 11 | 12 | console.log(a, b); 13 | 14 | const c = 5; 15 | 16 | console.log(c); --------------------------------------------------------------------------------