From 507fa2dad538c57d5fcdef6f8af88b82947c78c1 Mon Sep 17 00:00:00 2001 From: Zanderlan Date: Thu, 1 Feb 2024 16:40:00 -0300 Subject: [PATCH 1/8] pt-br - day 4 --- .../Dia_03_booleanos_operadores_data.md | 105 ++--- .../04_day_starter/index.html | 15 + .../04_day_starter/scripts/main.js | 3 + .../Dia_04_condicionais.md | 375 ++++++++++++++++++ 4 files changed, 446 insertions(+), 52 deletions(-) create mode 100644 Portuguese/Dia_04_Condicionais/04_day_starter/index.html create mode 100644 Portuguese/Dia_04_Condicionais/04_day_starter/scripts/main.js create mode 100644 Portuguese/Dia_04_Condicionais/Dia_04_condicionais.md diff --git a/Portuguese/Dia_03_Booleanos_Operadores_Data/Dia_03_booleanos_operadores_data.md b/Portuguese/Dia_03_Booleanos_Operadores_Data/Dia_03_booleanos_operadores_data.md index ad61f3dea..bd399e662 100644 --- a/Portuguese/Dia_03_Booleanos_Operadores_Data/Dia_03_booleanos_operadores_data.md +++ b/Portuguese/Dia_03_Booleanos_Operadores_Data/Dia_03_booleanos_operadores_data.md @@ -7,49 +7,50 @@ Twitter Follow - Autor; - Asabeneh Yetayeh
- Janeiro, 2020 -
+Autor; +Asabeneh Yetayeh
+ Janeiro, 2020 +
+ -[<< Day 2](../Dia_02_Tipos_Dados/dia_02_tipos_dados.md) | [Day 4 >>](../04_Day_Conditionals/04_day_conditionals.md) +[<< Day 2](../Dia_02_Tipos_Dados/dia_02_tipos_dados.md) | [Day 4 >>](../Dia_04_Condicionais/Dia_04_condicionais.md) -![Thirty Days Of JavaScript](../images/banners/day_1_3.png) +![Thirty Days Of JavaScript](../../images/banners/day_1_3.png) - [📔 Day 3](#-day-3) - - [Booleans](#booleans) - - [Truthy values](#truthy-values) - - [Falsy values](#falsy-values) - - [Undefined](#undefined) - - [Null](#null) - - [Operators](#operators) - - [Assignment operators](#assignment-operators) - - [Arithmetic Operators](#arithmetic-operators) - - [Comparison Operators](#comparison-operators) - - [Logical Operators](#logical-operators) - - [Increment Operator](#increment-operator) - - [Decrement Operator](#decrement-operator) - - [Ternary Operators](#ternary-operators) - - [Operator Precedence](#operator-precedence) - - [Window Methods](#window-methods) - - [Window alert() method](#window-alert-method) - - [Window prompt() method](#window-prompt-method) - - [Window confirm() method](#window-confirm-method) - - [Date Object](#date-object) - - [Creating a time object](#creating-a-time-object) - - [Getting full year](#getting-full-year) - - [Getting month](#getting-month) - - [Getting date](#getting-date) - - [Getting day](#getting-day) - - [Getting hours](#getting-hours) - - [Getting minutes](#getting-minutes) - - [Getting seconds](#getting-seconds) - - [Getting time](#getting-time) - - [💻 Day 3: Exercises](#-day-3-exercises) - - [Exercises: Level 1](#exercises-level-1) - - [Exercises: Level 2](#exercises-level-2) - - [Exercises: Level 3](#exercises-level-3) + - [Booleans](#booleans) + - [Truthy values](#truthy-values) + - [Falsy values](#falsy-values) + - [Undefined](#undefined) + - [Null](#null) + - [Operators](#operators) + - [Assignment operators](#assignment-operators) + - [Arithmetic Operators](#arithmetic-operators) + - [Comparison Operators](#comparison-operators) + - [Logical Operators](#logical-operators) + - [Increment Operator](#increment-operator) + - [Decrement Operator](#decrement-operator) + - [Ternary Operators](#ternary-operators) + - [Operator Precedence](#operator-precedence) + - [Window Methods](#window-methods) + - [Window alert() method](#window-alert-method) + - [Window prompt() method](#window-prompt-method) + - [Window confirm() method](#window-confirm-method) + - [Date Object](#date-object) + - [Creating a time object](#creating-a-time-object) + - [Getting full year](#getting-full-year) + - [Getting month](#getting-month) + - [Getting date](#getting-date) + - [Getting day](#getting-day) + - [Getting hours](#getting-hours) + - [Getting minutes](#getting-minutes) + - [Getting seconds](#getting-seconds) + - [Getting time](#getting-time) + - [💻 Day 3: Exercises](#-day-3-exercises) + - [Exercises: Level 1](#exercises-level-1) + - [Exercises: Level 2](#exercises-level-2) + - [Exercises: Level 3](#exercises-level-3) # 📔 Day 3 @@ -573,11 +574,11 @@ console.log(`${date}/${month}/${year} ${hours}:${minutes}`) // 4/1/2020 0:56 1. Calculate the value of y (y = x2 + 6x + 9). Try to use different x values and figure out at what x value y is 0. 1. Writ a script that prompt a user to enter hours and rate per hour. Calculate pay of the person? - ```sh - Enter hours: 40 - Enter rate per hour: 28 - Your weekly earning is 1120 - ``` + ```sh + Enter hours: 40 + Enter rate per hour: 28 + Your weekly earning is 1120 + ``` 1. If the length of your name is greater than 7 say, your name is long else say your name is short. 1. Compare your first name length and your family name length and you should get this output. @@ -588,8 +589,8 @@ console.log(`${date}/${month}/${year} ${hours}:${minutes}`) // 4/1/2020 0:56 ``` ```sh - Your first name, Asabeneh is longer than your family name, Yetayeh - ``` + Your first name, Asabeneh is longer than your family name, Yetayeh + ``` 1. Declare two variables _myAge_ and _yourAge_ and assign them initial values and myAge and yourAge. @@ -604,14 +605,14 @@ console.log(`${date}/${month}/${year} ${hours}:${minutes}`) // 4/1/2020 0:56 1. Using prompt get the year the user was born and if the user is 18 or above allow the user to drive if not tell the user to wait a certain amount of years. - ```sh + ```sh - Enter birth year: 1995 - You are 25. You are old enough to drive + Enter birth year: 1995 + You are 25. You are old enough to drive - Enter birth year: 2005 - You are 15. You will be allowed to drive after 3 years. - ``` + Enter birth year: 2005 + You are 15. You will be allowed to drive after 3 years. + ``` 1. Write a script that prompt the user to enter number of years. Calculate the number of seconds a person can live. Assume some one lives just hundred years @@ -630,4 +631,4 @@ console.log(`${date}/${month}/${year} ${hours}:${minutes}`) // 4/1/2020 0:56 1. Create a human readable time format using the Date time object. The hour and the minute should be all the time two digits(7 hours should be 07 and 5 minutes should be 05 ) 1. YYY-MM-DD HH:mm eg. 20120-01-02 07:05 -[<< Dia 2](../Dia_02_Tipos_Dados/dia_02_tipos_dados.md) | [Dia 4 >>](../04_Day_Conditionals/04_day_conditionals.md) +[<< Dia 2](../Dia_02_Tipos_Dados/dia_02_tipos_dados.md) | [Dia 4 >>](../Dia_04_Condicionais/Dia_04_condicionais.md) diff --git a/Portuguese/Dia_04_Condicionais/04_day_starter/index.html b/Portuguese/Dia_04_Condicionais/04_day_starter/index.html new file mode 100644 index 000000000..093c6e6e1 --- /dev/null +++ b/Portuguese/Dia_04_Condicionais/04_day_starter/index.html @@ -0,0 +1,15 @@ + + + + + 30DaysOfJavaScript + + + + + + + + + + \ No newline at end of file diff --git a/Portuguese/Dia_04_Condicionais/04_day_starter/scripts/main.js b/Portuguese/Dia_04_Condicionais/04_day_starter/scripts/main.js new file mode 100644 index 000000000..ad0c1eb79 --- /dev/null +++ b/Portuguese/Dia_04_Condicionais/04_day_starter/scripts/main.js @@ -0,0 +1,3 @@ +// this is your main.js script + +alert('Open the browser console whenever you work on JavaScript') \ No newline at end of file diff --git a/Portuguese/Dia_04_Condicionais/Dia_04_condicionais.md b/Portuguese/Dia_04_Condicionais/Dia_04_condicionais.md new file mode 100644 index 000000000..bc06ec509 --- /dev/null +++ b/Portuguese/Dia_04_Condicionais/Dia_04_condicionais.md @@ -0,0 +1,375 @@ +
+

30 Dias de JavaScript: Condicionais

+ + + + + Seguir no Twitter + + +Autor: +Asabeneh Yetayeh
+ Janeiro, 2020 +
+ +
+ +[<< Dia 3](../Dia_03_Booleanos_Operadores_Data/Dia_03_booleanos_operadores_data.md) | [Dia 5 >>](../05_Day_Arrays/05_day_arrays.md) + +![Trinta Dias de JavaScript](../../images/banners/day_1_4.png) + +- [📔 Dia 4](#-dia-4) + - [Condicionais](#condicionais) + - [If](#if) + - [If Else](#if-else) + - [If Else If Else](#if--else-if-else) + - [Switch](#switch) + - [Operadores Ternários](#operadores-ternários) + - [💻 Exercícios](#-exercícios) + - [Exercícios: Nível 1](#exercícios-nível-1) + - [Exercícios: Nível 2](#exercícios-nível-2) + - [Exercícios: Nível 3](#exercícios-nível-3) + +# 📔 Dia 4 + +## Condicionais + +As declarações condicionais são usadas para tomar decisões com base em diferentes condições. +Por padrão, as declarações em JavaScript são executadas sequencialmente de cima para baixo. Se a lógica de processamento exigir, o fluxo sequencial de execução pode ser alterado de duas maneiras: + +- Execução condicional: um bloco de uma ou mais declarações será executado se uma certa expressão for verdadeira +- Execução repetitiva: um bloco de uma ou mais declarações será repetidamente executado enquanto uma certa expressão for verdadeira. Nesta seção, vamos cobrir as declarações _if_, _else_ , _else if_. Os operadores de comparação e lógicos que aprendemos nas seções anteriores serão úteis aqui. + +Condições podem ser implementadas das seguintes maneiras: + +- if +- if else +- if else if else +- switch +- operador ternário + +### If + +Em JavaScript e outras linguagens de programação, a palavra-chave _if_ é usada para verificar se uma condição é verdadeira e para executar o bloco de código. Para criar uma condição if, precisamos da palavra-chave _if_, condição dentro de um parêntese e bloco de código dentro de chaves ({}). + +```js +// sintaxe +if (condição) { + // esta parte do código é executada para condição verdadeira +} +``` + +**Exemplo:** + +```js +let num = 3; +if (num > 0) { + console.log(`${num} é um número positivo`); +} +// 3 é um número positivo +``` + +Como você pode ver no exemplo de condição acima, 3 é maior que 0, então é um número positivo. A condição foi verdadeira e o bloco de código foi executado. No entanto, se a condição for falsa, não veremos nenhum resultado. + +```js +let isRaining = true; +if (isRaining) { + console.log('Lembre-se de levar seu casaco de chuva.'); +} +``` + +O mesmo vale para a segunda condição, se isRaining for falso, o bloco if não será executado e não veremos nenhum resultado. Para ver o resultado de uma condição falsa, deveríamos ter outro bloco, que será else. + +### If Else + +Se a condição for verdadeira, o primeiro bloco será executado, se não, a condição else será executada. + +```js +// sintaxe +if (condição) { + // esta parte do código é executada para condição verdadeira +} else { + // esta parte do código é executada para condição falsa +} +``` + +```js +let num = 3; +if (num > 0) { + console.log(`${num} é um número positivo`); +} else { + console.log(`${num} é um número negativo`); +} +// 3 é um número positivo + +num = -3; +if (num > 0) { + console.log(`${num} é um número positivo`); +} else { + console.log(`${num} é um número negativo`); +} +// -3 é um número negativo +``` + +```js +let isRaining = true; +if (isRaining) { + console.log('Você precisa de um casaco de chuva.'); +} else { + console.log('Não precisa de casaco de chuva.'); +} +// Você precisa de um casaco de chuva. + +isRaining = false; +if (isRaining) { + console.log('Você precisa de um casaco de chuva.'); +} else { + console.log('Não precisa de casaco de chuva.'); +} +// Não precisa de casaco de chuva. +``` + +A última condição é falsa, portanto, o bloco else foi executado. E se tivermos mais de duas condições? Nesse caso, usaríamos condições else if. + +### If Else if Else + +Na nossa vida diária, tomamos decisões diariamente. Tomamos decisões não apenas verificando uma ou duas condições, mas fazemos decisões baseadas em múltiplas condições. Semelhante à nossa vida diária, a programação também está cheia de condições. Usamos else if quando temos múltiplas condições. + +```js +// sintaxe +if (condição) { + // código +} else if (condição) { + // código +} else { + // código +} +``` + +**Exemplo:** + +```js +let a = 0; +if (a > 0) { + console.log(`${a} é um número positivo`); +} else if (a < 0) { + console.log(`${a} é um número negativo`); +} else if (a == 0) { + console.log(`${a} é zero`); +} else { + console.log(`${a} não é um número`); +} +``` + +```js +// if else if else +let clima = 'ensolarado'; +if (clima === 'chuvoso') { + console.log('Você precisa de um casaco de chuva.'); +} else if (clima === 'nublado') { + console.log('Pode estar frio, você precisa de uma jaqueta.'); +} else if (clima === 'ensolarado') { + console.log('Saia livremente.'); +} else { + console.log('Não precisa de casaco de chuva.'); +} +``` + +### Switch + +Switch é uma alternativa para **if else if else**. +A declaração switch começa com a palavra-chave _switch_ seguida por um parêntese e bloco de código. Dentro do bloco de código, teremos diferentes casos. O bloco de caso é executado se o valor nos parênteses da declaração switch corresponder ao valor do caso. A declaração break é para terminar a execução para que a execução do código não continue após a condição ser satisfeita. O bloco default é executado se todos os casos não satisfizerem a condição. + +```js +switch (valorDoCaso) { + case 1: + // código + break; + case 2: + // código + break; + case 3: + // código + break; + default: + // código +} +``` + +```js +let clima = 'nublado'; +switch (clima) { + case 'chuvoso': + console.log('Você precisa de um casaco de chuva.'); + break; + case 'nublado': + console.log('Pode estar frio, você precisa de uma jaqueta.'); + break; + case 'ensolarado': + console.log('Saia livremente.'); + break; + default: + console.log('Não precisa de casaco de chuva.'); +} + +// Mais Exemplos de Switch +let diaEntradaUsuario = prompt('Que dia é hoje?'); +let dia = diaEntradaUsuario.toLowerCase(); + +switch (dia) { + case 'segunda-feira': + console.log('Hoje é segunda-feira'); + break; + case 'terça-feira': + console.log('Hoje é terça-feira'); + break; + case 'quarta-feira': + console.log('Hoje é quarta-feira'); + break; + case 'quinta-feira': + console.log('Hoje é quinta-feira'); + break; + case 'sexta-feira': + console.log('Hoje é sexta-feira'); + break; + case 'sábado': + console.log('Hoje é sábado'); + break; + case 'domingo': + console.log('Hoje é domingo'); + break; + default: + console.log('Não é um dia da semana.'); +} +``` + +// Exemplos para usar condições nos casos + +```js +let num = prompt('Digite um número'); +switch (true) { + case num > 0: + console.log('O número é positivo'); + break; + case num == 0: + console.log('O número é zero'); + break; + case num < 0: + console.log('O número é negativo'); + break; + default: + console.log('O valor digitado não foi um número'); +} +``` + +### Operadores Ternários + +Outra maneira de escrever condicionais é usando operadores ternários. Já cobrimos isso em outras seções, mas também devemos mencionar aqui. + +```js +let isRaining = true; +isRaining + ? console.log('Você precisa de um casaco de chuva.') + : console.log('Não precisa de casaco de chuva.'); +``` + +🌕 Você é extraordinário e possui um potencial notável. Você acabou de completar os desafios do dia 4 e está quatro passos à frente no seu caminho para a grandeza. Agora faça alguns exercícios para o seu cérebro e músculo. + +## 💻 Exercícios + +### Exercícios: Nível 1 + +1. Obtenha a entrada do usuário usando prompt(“Digite sua idade:”). Se o usuário tiver 18 anos ou mais, dê o feedback: 'Você tem idade suficiente para dirigir', mas se não tiver 18 anos, dê outro feedback indicando quantos anos ele precisa esperar para completar 18 anos. + +```sh +Digite sua idade: 30 +Você tem idade suficiente para dirigir. + +Digite sua idade: 15 +Você tem que esperar mais 3 anos para dirigir. +``` + +1. Compare os valores de myAge e yourAge usando if … else. Com base na comparação, registre o resultado no console indicando quem é mais velho (eu ou você). Use prompt(“Digite sua idade:”) para obter a idade como entrada. + +```sh +Digite sua idade: 30 +Você é 5 anos mais velho do que eu. +``` + +1. Se a for maior que b, retorne 'a é maior que b' senão 'a é menor que b'. Tente implementar de duas maneiras + + - usando if else + - operador ternário. + +```js +let a = 4; +let b = 3; +``` + +```sh +4 é maior que 3 +``` + +1. Números pares são divisíveis por 2 e o resto é zero. Como você verifica se um número é par ou não usando JavaScript? + +```sh +Digite um número: 2 +2 é um número par + +Digite um número: 9 +9 é um número ímpar. +``` + +### Exercícios: Nível 2 + +1. Escreva um código que possa dar notas aos alunos de acordo com suas pontuações: + - 80-100, A + - 70-89, B + - 60-69, C + - 50-59, D + - 0-49, F +1. Verifique se a estação é Outono, Inverno, Primavera ou Verão. + Se a entrada do usuário for: + - Setembro, Outubro ou Novembro, a estação é Outono. + - Dezembro, Janeiro ou Fevereiro, a estação é Inverno. + - Março, Abril ou Maio, a estação é Primavera + - Junho, Julho ou Agosto, a estação é Verão +1. Verifique se um dia é dia de semana ou um dia útil. Seu script receberá o dia como entrada. + +```sh + Qual é o dia hoje? Sábado + Sábado é um fim de semana. + + Qual é o dia hoje? sábaDo + Sábado é um fim de semana. + + Qual é o dia hoje? Sexta-feira + Sexta-feira é um dia útil. + + Qual é o dia hoje? sexTA-feiRa + Sexta-feira é um dia útil. +``` + +### Exercícios: Nível 3 + +1. Escreva um programa que informe o número de dias em um mês. + +```sh + Digite um mês: Janeiro + Janeiro tem 31 dias. + + Digite um mês: JANEIRO + Janeiro tem 31 dias + + Digite um mês: Fevereiro + Fevereiro tem 28 dias. + + Digite um mês: FEvereiro + Fevereiro tem 28 dias. +``` + +1. Escreva um programa que informe o número de dias em um mês, agora considerando o ano bissexto. + +🎉 PARABÉNS ! 🎉 + +[<< Day 3](../Dia_03_Booleanos_Operadores_Data/Dia_03_booleanos_operadores_data.md) | [Day 5 >>](../05_Day_Arrays/05_day_arrays.md) From 17473fcafbeee303710f5feff77da04d9842ed85 Mon Sep 17 00:00:00 2001 From: Zanderlan Date: Mon, 12 Feb 2024 13:18:02 -0300 Subject: [PATCH 2/8] pt-br - day 05 --- .../Dia_04_condicionais.md | 4 +- .../05_day_starter/data/countries.js | 195 +++++ .../Dia_05_Arrays/05_day_starter/index.html | 17 + .../05_day_starter/scripts/main.js | 3 + Portuguese/Dia_05_Arrays/Dia_05_arrays.md | 781 ++++++++++++++++++ 5 files changed, 998 insertions(+), 2 deletions(-) create mode 100644 Portuguese/Dia_05_Arrays/05_day_starter/data/countries.js create mode 100644 Portuguese/Dia_05_Arrays/05_day_starter/index.html create mode 100644 Portuguese/Dia_05_Arrays/05_day_starter/scripts/main.js create mode 100644 Portuguese/Dia_05_Arrays/Dia_05_arrays.md diff --git a/Portuguese/Dia_04_Condicionais/Dia_04_condicionais.md b/Portuguese/Dia_04_Condicionais/Dia_04_condicionais.md index bc06ec509..c4c6fae7d 100644 --- a/Portuguese/Dia_04_Condicionais/Dia_04_condicionais.md +++ b/Portuguese/Dia_04_Condicionais/Dia_04_condicionais.md @@ -14,7 +14,7 @@ -[<< Dia 3](../Dia_03_Booleanos_Operadores_Data/Dia_03_booleanos_operadores_data.md) | [Dia 5 >>](../05_Day_Arrays/05_day_arrays.md) +[<< Day 3](../Dia_03_Booleanos_Operadores_Data/Dia_03_booleanos_operadores_data.md) | [Day 5 >>](../Dia_05_Arrays/dia_05_arrays.md) ![Trinta Dias de JavaScript](../../images/banners/day_1_4.png) @@ -372,4 +372,4 @@ Digite um número: 9 🎉 PARABÉNS ! 🎉 -[<< Day 3](../Dia_03_Booleanos_Operadores_Data/Dia_03_booleanos_operadores_data.md) | [Day 5 >>](../05_Day_Arrays/05_day_arrays.md) +[<< Day 3](../Dia_03_Booleanos_Operadores_Data/Dia_03_booleanos_operadores_data.md) | [Day 5 >>](../Dia_05_Arrays/dia_05_arrays.md) diff --git a/Portuguese/Dia_05_Arrays/05_day_starter/data/countries.js b/Portuguese/Dia_05_Arrays/05_day_starter/data/countries.js new file mode 100644 index 000000000..e57b00501 --- /dev/null +++ b/Portuguese/Dia_05_Arrays/05_day_starter/data/countries.js @@ -0,0 +1,195 @@ +const countries = [ + 'Afghanistan', + 'Albania', + 'Algeria', + 'Andorra', + 'Angola', + 'Antigua and Barbuda', + 'Argentina', + 'Armenia', + 'Australia', + 'Austria', + 'Azerbaijan', + 'Bahamas', + 'Bahrain', + 'Bangladesh', + 'Barbados', + 'Belarus', + 'Belgium', + 'Belize', + 'Benin', + 'Bhutan', + 'Bolivia', + 'Bosnia and Herzegovina', + 'Botswana', + 'Brazil', + 'Brunei', + 'Bulgaria', + 'Burkina Faso', + 'Burundi', + 'Cambodia', + 'Cameroon', + 'Canada', + 'Cape Verde', + 'Central African Republic', + 'Chad', + 'Chile', + 'China', + 'Colombi', + 'Comoros', + 'Congo (Brazzaville)', + 'Congo', + 'Costa Rica', + "Cote d'Ivoire", + 'Croatia', + 'Cuba', + 'Cyprus', + 'Czech Republic', + 'Denmark', + 'Djibouti', + 'Dominica', + 'Dominican Republic', + 'East Timor (Timor Timur)', + 'Ecuador', + 'Egypt', + 'El Salvador', + 'Equatorial Guinea', + 'Eritrea', + 'Estonia', + 'Ethiopia', + 'Fiji', + 'Finland', + 'France', + 'Gabon', + 'Gambia, The', + 'Georgia', + 'Germany', + 'Ghana', + 'Greece', + 'Grenada', + 'Guatemala', + 'Guinea', + 'Guinea-Bissau', + 'Guyana', + 'Haiti', + 'Honduras', + 'Hungary', + 'Iceland', + 'India', + 'Indonesia', + 'Iran', + 'Iraq', + 'Ireland', + 'Israel', + 'Italy', + 'Jamaica', + 'Japan', + 'Jordan', + 'Kazakhstan', + 'Kenya', + 'Kiribati', + 'Korea, North', + 'Korea, South', + 'Kuwait', + 'Kyrgyzstan', + 'Laos', + 'Latvia', + 'Lebanon', + 'Lesotho', + 'Liberia', + 'Libya', + 'Liechtenstein', + 'Lithuania', + 'Luxembourg', + 'Macedonia', + 'Madagascar', + 'Malawi', + 'Malaysia', + 'Maldives', + 'Mali', + 'Malta', + 'Marshall Islands', + 'Mauritania', + 'Mauritius', + 'Mexico', + 'Micronesia', + 'Moldova', + 'Monaco', + 'Mongolia', + 'Morocco', + 'Mozambique', + 'Myanmar', + 'Namibia', + 'Nauru', + 'Nepal', + 'Netherlands', + 'New Zealand', + 'Nicaragua', + 'Niger', + 'Nigeria', + 'Norway', + 'Oman', + 'Pakistan', + 'Palau', + 'Panama', + 'Papua New Guinea', + 'Paraguay', + 'Peru', + 'Philippines', + 'Poland', + 'Portugal', + 'Qatar', + 'Romania', + 'Russia', + 'Rwanda', + 'Saint Kitts and Nevis', + 'Saint Lucia', + 'Saint Vincent', + 'Samoa', + 'San Marino', + 'Sao Tome and Principe', + 'Saudi Arabia', + 'Senegal', + 'Serbia and Montenegro', + 'Seychelles', + 'Sierra Leone', + 'Singapore', + 'Slovakia', + 'Slovenia', + 'Solomon Islands', + 'Somalia', + 'South Africa', + 'Spain', + 'Sri Lanka', + 'Sudan', + 'Suriname', + 'Swaziland', + 'Sweden', + 'Switzerland', + 'Syria', + 'Taiwan', + 'Tajikistan', + 'Tanzania', + 'Thailand', + 'Togo', + 'Tonga', + 'Trinidad and Tobago', + 'Tunisia', + 'Turkey', + 'Turkmenistan', + 'Tuvalu', + 'Uganda', + 'Ukraine', + 'United Arab Emirates', + 'United Kingdom', + 'United States', + 'Uruguay', + 'Uzbekistan', + 'Vanuatu', + 'Vatican City', + 'Venezuela', + 'Vietnam', + 'Yemen', + 'Zambia', + 'Zimbabwe' +] diff --git a/Portuguese/Dia_05_Arrays/05_day_starter/index.html b/Portuguese/Dia_05_Arrays/05_day_starter/index.html new file mode 100644 index 000000000..7d8eeea5b --- /dev/null +++ b/Portuguese/Dia_05_Arrays/05_day_starter/index.html @@ -0,0 +1,17 @@ + + + + + 30DaysOfJavaScript:05 Day + + + +

30DaysOfJavaScript:05 Day

+

Arrays

+ + + + + + + \ No newline at end of file diff --git a/Portuguese/Dia_05_Arrays/05_day_starter/scripts/main.js b/Portuguese/Dia_05_Arrays/05_day_starter/scripts/main.js new file mode 100644 index 000000000..50cc07eac --- /dev/null +++ b/Portuguese/Dia_05_Arrays/05_day_starter/scripts/main.js @@ -0,0 +1,3 @@ +console.log(countries) +alert('Open the browser console whenever you work on JavaScript') +alert('Open the console and check if the countries has been loaded') \ No newline at end of file diff --git a/Portuguese/Dia_05_Arrays/Dia_05_arrays.md b/Portuguese/Dia_05_Arrays/Dia_05_arrays.md new file mode 100644 index 000000000..244d46e57 --- /dev/null +++ b/Portuguese/Dia_05_Arrays/Dia_05_arrays.md @@ -0,0 +1,781 @@ +
+

30 Dias de JavaScript: Arrays

+ + + + + Seguir no Twitter + + +Autor: +Asabeneh Yetayeh
+ Janeiro, 2020 +
+ +
+ +[<< Dia 4](../Dia_04_Condicionais.md) | [Dia 6 >>](../Dia_06_Loops/Dia_06_Loops.md) + +![Dia 5](../../images/banners/day_1_5.png) + +- [📔 Dia 5](#-dia-5) + - [Arrays](#arrays) + - [Como criar um array vazio](#como-criar-um-array-vazio) + - [Como criar um array com valores](#como-criar-um-array-com-valores) + - [Criando um array usando split](#criando-um-array-usando-split) + - [Acessando itens do array usando índice](#acessando-itens-do-array-usando-índice) + - [Modificando elemento do array](#modificando-elemento-do-array) + - [Métodos para manipular array](#métodos-para-manipular-array) + - [Construtor de Array](#construtor-de-array) + - [Criando valores estáticos com fill](#criando-valores-estáticos-com-fill) + - [Concatenando array usando concat](#concatenando-array-usando-concat) + - [Obtendo o tamanho do array](#obtendo-o-tamanho-do-array) + - [Obtendo índice de um elemento no array](#obtendo-índice-de-um-elemento-no-array) + - [Obtendo o último índice de um elemento no array](#obtendo-o-último-índice-de-um-elemento-no-array) + - [Verificando array](#verificando-array) + - [Convertendo array para string](#convertendo-array-para-string) + - [Juntando elementos do array](#juntando-elementos-do-array) + - [Fatiando elementos do array](#fatiando-elementos-do-array) + - [Método splice em array](#método-splice-em-array) + - [Adicionando item ao array usando push](#adicionando-item-ao-array-usando-push) + - [Removendo o elemento final usando pop](#removendo-o-elemento-final-usando-pop) + - [Removendo um elemento do início](#removendo-um-elemento-do-início) + - [Adicionando um elemento no início](#adicionando-um-elemento-no-início) + - [Invertendo a ordem do array](#invertendo-a-ordem-do-array) + - [Ordenando elementos no array](#ordenando-elementos-no-array) + - [Array de arrays](#array-de-arrays) + - [💻 Exercício](#-exercício) + - [Exercício: Nível 1](#exercício-nível-1) + - [Exercício: Nível 2](#exercício-nível-2) + - [Exercício: Nível 3](#exercício-nível-3) + +# 📔 Dia 5 + +## Arrays + +Ao contrário das variáveis, um array pode armazenar _vários valores_. Cada valor em um array tem um _índice_, e cada índice tem _uma referência em um endereço de memória_. Cada valor pode ser acessado usando seus _índices_. O índice de um array começa do _zero_, e o índice do último elemento é menor por um do que o comprimento do array. + +Um array é uma coleção de diferentes tipos de dados que são ordenados e modificáveis. Um array permite armazenar elementos duplicados e diferentes tipos de dados. Um array pode estar vazio ou pode ter valores de diferentes tipos de dados. + +### Como criar um array vazio + +Em JavaScript, podemos criar um array de diferentes maneiras. Vamos ver diferentes formas de criar um array. +É muito comum usar _const_ em vez de _let_ para declarar uma variável de array. Se você usar const, significa que não usará esse nome de variável novamente. + +- Usando o construtor Array + +```js +// sintaxe +const arr = Array(); +// ou +// let arr = new Array() +console.log(arr); // [] +``` + +- Usando colchetes([]) + +```js +// sintaxe +// Esta é a maneira mais recomendada de criar uma lista vazia +const arr = []; +console.log(arr); +``` + +### Como criar um array com valores + +Array com valores iniciais. Usamos a propriedade length para encontrar o comprimento de um array. + +```js +const numeros = [0, 3.14, 9.81, 37, 98.6, 100]; // array de números +const frutas = ['banana', 'laranja', 'manga', 'limão']; // array de strings, frutas +const vegetais = ['Tomate', 'Batata', 'Repolho', 'Cebola', 'Cenoura']; // array de strings, vegetais +const produtosAnimais = ['leite', 'carne', 'manteiga', 'iogurte']; // array de strings, produtos +const webTechs = ['HTML', 'CSS', 'JS', 'React', 'Redux', 'Node', 'MongoDB']; // array de tecnologias web +const paises = ['Finlândia', 'Dinamarca', 'Suécia', 'Noruega', 'Islândia']; // array de strings, países + +// Imprima o array e seu comprimento + +console.log('Números:', numeros); +console.log('Quantidade de números:', numeros.length); + +console.log('Frutas:', frutas); +console.log('Quantidade de frutas:', frutas.length); + +console.log('Vegetais:', vegetais); +console.log('Quantidade de vegetais:', vegetais.length); + +console.log('Produtos animais:', produtosAnimais); +console.log('Quantidade de produtos animais:', produtosAnimais.length); + +console.log('Tecnologias web:', webTechs); +console.log('Quantidade de tecnologias web:', webTechs.length); + +console.log('Países:', paises); +console.log('Quantidade de países:', paises.length); +``` + +```sh +Números: [0, 3.14, 9.81, 37, 98.6, 100] +Quantidade de números: 6 +Frutas: ['banana', 'laranja', 'manga', 'limão'] +Quantidade de frutas: 4 +Vegetais: ['Tomate', 'Batata', 'Repolho', 'Cebola', 'Cenoura'] +Quantidade de vegetais: 5 +Produtos de origem animal: ['leite', 'carne', 'manteiga', 'iogurte'] +Quantidade de produtos de origem animal: 4 +Tecnologias web: ['HTML', 'CSS', 'JS', 'React', 'Redux', 'Node', 'MongoDB'] +Quantidade de tecnologias web: 7 +Países: ['Finlândia', 'Estônia', 'Dinamarca', 'Suécia', 'Noruega'] +Quantidade de países: 5 +``` + +- O array pode ter itens de diferentes tipos de dados + +```js +const arr = [ + 'Asabeneh', + 250, + true, + { country: 'Finlândia', city: 'Helsinque' }, + { skills: ['HTML', 'CSS', 'JS', 'React', 'Python'] }, +]; // arr contendo diferentes tipos de dados +console.log(arr); +``` + +### Criando um array usando split + +Como vimos na seção anterior, podemos dividir uma string em diferentes posições e transformá-la em um array. Vamos ver os exemplos abaixo. + +```js +let js = 'JavaScript'; +const charsInJavaScript = js.split(''); + +console.log(charsInJavaScript); // ["J", "a", "v", "a", "S", "c", "r", "i", "p", "t"] + +let companiesString = 'Facebook, Google, Microsoft, Apple, IBM, Oracle, Amazon'; +const companies = companiesString.split(','); + +console.log(companies); // ["Facebook", " Google", " Microsoft", " Apple", " IBM", " Oracle", " Amazon"] +let txt = + 'Eu amo ensinar e empoderar pessoas. Eu ensino HTML, CSS, JS, React, Python.'; +const words = txt.split(' '); + +console.log(words); +// o texto tem caracteres especiais, pense como você pode obter apenas as palavras +// ["Eu", "amo", "ensinar", "e", "empoderar", "pessoas.", "Eu", "ensino", "HTML,", "CSS,", "JS,", "React,", "Python"] +``` + +### Acessando itens do array usando índice + +Acessamos cada elemento em um array usando seu índice. O índice de um array começa do 0. A imagem abaixo mostra claramente o índice de cada elemento no array. + +![arr index](../../images/array_index.png) + +```js +const frutas = ['banana', 'laranja', 'manga', 'limão']; +let primeiraFruta = frutas[0]; // estamos acessando o primeiro item usando seu índice + +console.log(primeiraFruta); // banana + +let segundaFruta = frutas[1]; +console.log(segundaFruta); // laranja + +let ultimaFruta = frutas[3]; +console.log(ultimaFruta); // limão +// O último índice pode ser calculado da seguinte forma + +let ultimoIndice = frutas.length - 1; +ultimaFruta = frutas[ultimoIndice]; + +console.log(ultimaFruta); // limão +``` + +```js +const numeros = [0, 3.14, 9.81, 37, 98.6, 100]; // conjunto de números + +console.log(numeros.length); // => para saber o tamanho do array, que é 6 +console.log(numeros); // -> [0, 3.14, 9.81, 37, 98.6, 100] +console.log(numeros[0]); // -> 0 +console.log(numeros[5]); // -> 100 + +let ultimoIndice = numeros.length - 1; +console.log(numeros[ultimoIndice]); // -> 100 +``` + +```js +const webTechs = [ + 'HTML', + 'CSS', + 'JavaScript', + 'React', + 'Redux', + 'Node', + 'MongoDB', +]; // Lista de tecnologias web + +console.log(webTechs); // todos os itens do array +console.log(webTechs.length); // => para saber o tamanho do array, que é 7 +console.log(webTechs[0]); // -> HTML +console.log(webTechs[6]); // -> MongoDB + +ultimoIndice = webTechs.length - 1; +console.log(webTechs[ultimoIndice]); // -> MongoDB +``` + +```js +const paises = [ + 'Albânia', + 'Bolívia', + 'Canadá', + 'Dinamarca', + 'Etiópia', + 'Finlândia', + 'Alemanha', + 'Hungria', + 'Irlanda', + 'Japão', + 'Quênia', +]; // Lista de países + +console.log(paises); // -> todos os países no array +console.log(paises[0]); // -> Albânia +console.log(paises[10]); // -> Quênia + +ultimoIndice = paises.length - 1; +console.log(paises[ultimoIndice]); // -> Quênia +``` + +```js +const carrinhoDeCompras = [ + 'Leite', + 'Manga', + 'Tomate', + 'Batata', + 'Abacate', + 'Carne', + 'Ovos', + 'Açúcar', +]; // Lista de produtos alimentícios + +console.log(carrinhoDeCompras); // -> todo o carrinho de compras no array +console.log(carrinhoDeCompras[0]); // -> Leite +console.log(carrinhoDeCompras[7]); // -> Açúcar + +ultimoIndice = carrinhoDeCompras.length - 1; +console.log(carrinhoDeCompras[ultimoIndice]); // -> Açúcar +``` + +### Modificando elemento do array + +Um array é mutável (modificável). Uma vez que um array é criado, podemos modificar o conteúdo dos elementos do array. + +```js +const numeros = [1, 2, 3, 4, 5]; +numeros[0] = 10; // alterando 1 no índice 0 para 10 +numeros[1] = 20; // alterando 2 no índice 1 para 20 + +console.log(numeros); // [10, 20, 3, 4, 5] + +const paises = [ + 'Albânia', + 'Bolívia', + 'Canadá', + 'Dinamarca', + 'Etiópia', + 'Finlândia', + 'Alemanha', + 'Hungria', + 'Irlanda', + 'Japão', + 'Quênia', +]; + +paises[0] = 'Afeganistão'; // Substituindo Albânia por Afeganistão +let ultimoIndice = paises.length - 1; +paises[ultimoIndice] = 'Coreia'; // Substituindo Quênia por Coreia + +console.log(paises); +``` + +```sh +["Afghanistan", "Bolivia", "Canada", "Denmark", "Ethiopia", "Finland", "Germany", "Hungary", "Ireland", "Japan", "Korea"] +``` + +### Métodos para manipular array + +Existem diferentes métodos para manipular um array. Estes são alguns dos métodos disponíveis para lidar com arrays: _Array, length, concat, indexOf, slice, splice, join, toString, includes, lastIndexOf, isArray, fill, push, pop, shift, unshift_ + +#### Construtor de Array + +Array:Para criar um array. + +```js +const arr = Array(); // cria um array vazio +console.log(arr); + +const oitoValoresVazios = Array(8); // cria oito valores vazios +console.log(oitoValoresVazios); // [vazio x 8] +``` + +#### Criando valores estáticos com fill + +fill: Preenche todos os elementos do array com um valor estático + +```js +const arr = Array(); // cria um array vazio +console.log(arr); + +const oitoValoresX = Array(8).fill('X'); // cria oito valores de elementos preenchidos com 'X' +console.log(oitoValoresX); // ['X', 'X', 'X', 'X', 'X', 'X', 'X', 'X'] + +const oitoValores0 = Array(8).fill(0); // cria oito valores de elementos preenchidos com '0' +console.log(oitoValores0); // [0, 0, 0, 0, 0, 0, 0, 0] + +const quatroValores4 = Array(4).fill(4); // cria 4 valores de elementos preenchidos com '4' +console.log(quatroValores4); // [4, 4, 4, 4] +``` + +#### Concatenando array usando concat + +concat:Para concatenar dois arrays. + +```js +const primeiraLista = [1, 2, 3]; +const segundaLista = [4, 5, 6]; +const terceiraLista = primeiraLista.concat(segundaLista); + +console.log(terceiraLista); // [1, 2, 3, 4, 5, 6] +``` + +```js +const frutas = ['banana', 'laranja', 'manga', 'limão']; // array de frutas +const vegetais = ['Tomate', 'Batata', 'Repolho', 'Cebola', 'Cenoura']; // array de vegetais +const frutasEVegetais = frutas.concat(vegetais); // concatena os dois arrays + +console.log(frutasEVegetais); +``` + +```sh +["banana", "orange", "mango", "lemon", "Tomato", "Potato", "Cabbage", "Onion", "Carrot"] +``` + +#### Obtendo o tamanho do array + +Length:Para saber o tamanho do array + +```js +const numeros = [1, 2, 3, 4, 5]; +console.log(numeros.length); // -> 5 é o tamanho do array +``` + +#### Obtendo índice de um elemento no array + +indexOf:Para verificar se um item existe em um array. Se existir, retorna o índice; caso contrário, retorna -1. + +```js +const numeros = [1, 2, 3, 4, 5]; + +console.log(numeros.indexOf(5)); // -> 4 +console.log(numeros.indexOf(0)); // -> -1 +console.log(numeros.indexOf(1)); // -> 0 +console.log(numeros.indexOf(6)); // -> -1 +``` + +Verificar se um elemento existe em um array. + +- Verifica itens em um array + +```js +const frutas = ['banana', 'laranja', 'manga', 'limão']; +let indice = frutas.indexOf('banana'); // 0 + +if(indice === -1){ + console.log('Esta fruta não existe no array'); +} else { + console.log('Esta fruta existe no array'); +} +// Esta fruta existe no array + +// nos podemos usar ternario tambem +index === -1 + ? console.log('Esta fruta não existe no array'); + : console.log('Esta fruta existe no array'); + +// vamos verificar se abacate existe no array +indice = frutas.indexOf('abacate'); // -1, se o elemento não for encontrado, o índice é -1 +if(indice === -1){ + console.log('Esta fruta não existe no array'); +} else { + console.log('Esta fruta existe no array'); +} +// Esta fruta não existe no array +``` + +#### Obtendo o último índice de um elemento no array + +lastIndexOf: Fornece a posição do último item no array. Se existir, retorna o índice; caso contrário, retorna -1. + +```js +const numeros = [1, 2, 3, 4, 5, 3, 1, 2]; + +console.log(numeros.lastIndexOf(2)); // 7 +console.log(numeros.lastIndexOf(0)); // -1 +console.log(numeros.lastIndexOf(1)); // 6 +console.log(numeros.lastIndexOf(4)); // 3 +console.log(numeros.lastIndexOf(6)); // -1 +``` + +includes: Para verificar se um item existe em um array. Se existir, retorna verdadeiro; caso contrário, retorna falso. + +```js +// const numbers = [1, 2, 3, 4, 5]; +const numeros = [1, 2, 3, 4, 5]; + +console.log(numbers.includes(5)); // verdadeiro +console.log(numbers.includes(0)); // falso +console.log(numbers.includes(1)); // verdadeiro +console.log(numbers.includes(6)); // falso + +const webTechs = [ + 'HTML', + 'CSS', + 'JavaScript', + 'React', + 'Redux', + 'Node', + 'MongoDB', +]; // List of web technologies + +console.log(webTechs.includes('Node')); // verdadeiro +console.log(webTechs.includes('C')); // falso +``` + +#### Verificando array + +Array.isArray:Para verificar se o tipo de dado é um array + +```js +const numbers = [1, 2, 3, 4, 5]; +console.log(Array.isArray(numbers)); // verdadeiro + +const number = 100; +console.log(Array.isArray(number)); // falso +``` + +#### Convertendo array para string + +toString: Converte o array para string + +```js +const numbers = [1, 2, 3, 4, 5]; +console.log(numbers.toString()); // 1,2,3,4,5 + +const names = ['Asabeneh', 'Mathias', 'Elias', 'Brook']; +console.log(names.toString()); // Asabeneh,Mathias,Elias,Brook +``` + +#### Juntando elementos do array + +join: É usado para juntar os elementos do array, o argumento passado no método join será utilizado para unir os elementos do array e retornar como uma string. Por padrão, ele junta com uma vírgula, mas podemos passar diferentes parâmetros de string que podem ser unidos entre os itens. + +```js +const numbers = [1, 2, 3, 4, 5]; +console.log(numbers.join()); // 1,2,3,4,5 + +const names = ['Asabeneh', 'Mathias', 'Elias', 'Brook']; + +console.log(names.join()); // Asabeneh,Mathias,Elias,Brook +console.log(names.join('')); //AsabenehMathiasEliasBrook +console.log(names.join(' ')); //Asabeneh Mathias Elias Brook +console.log(names.join(', ')); //Asabeneh, Mathias, Elias, Brook +console.log(names.join(' # ')); //Asabeneh # Mathias # Elias # Brook + +const webTechs = [ + 'HTML', + 'CSS', + 'JavaScript', + 'React', + 'Redux', + 'Node', + 'MongoDB', +]; // List of web technologies + +console.log(webTechs.join()); // "HTML,CSS,JavaScript,React,Redux,Node,MongoDB" +console.log(webTechs.join(' # ')); // "HTML # CSS # JavaScript # React # Redux # Node # MongoDB" +``` + +#### Fatiando elementos do array + +Slice: Para cortar múltiplos itens em um intervalo. Ele recebe dois parâmetros: posição inicial e final. Não inclui a posição final. + +```js +const numeros = [1, 2, 3, 4, 5]; + +console.log(numeros.slice()); // -> copia todos os itens +console.log(numeros.slice(0)); // -> copia todos os itens +console.log(numeros.slice(0, numeros.length)); // copia todos os itens +console.log(numeros.slice(1, 4)); // -> [2, 3, 4] // não inclui a posição final +``` + +#### Método splice em array + +Splice: Recebe três parâmetros: Posição inicial, número de itens a serem removidos e número de itens a serem adicionados. + +```js +const numeros = [1, 2, 3, 4, 5]; +numeros.splice(); +console.log(numeros); // -> remove todos os itens +``` + +```js +const numeros = [1, 2, 3, 4, 5]; +numeros.splice(0, 1); +console.log(numeros); // remove o primeiro item +``` + +```js +const numeros = [1, 2, 3, 4, 5, 6]; +numeros.splice(3, 3, 7, 8, 9); +console.log(numeros); // -> [1, 2, 3, 7, 8, 9] // remove três itens e substitui por três itens +``` + +#### Adicionando item ao array usando push + +Push: adicionando item no final. Para adicionar item ao final de um array existente usamos o método push. + +```js +// syntax +const arr = ['item1', 'item2', 'item3']; +arr.push('novo item'); +console.log(arr); // +// ['item1', 'item2', 'item3', 'novo item'] +``` + +```js +const numeros = [1, 2, 3, 4, 5]; +numeros.push(6); +console.log(numeros); // -> [1, 2, 3, 4, 5, 6] + +numeros.pop(); // -> remove um item do final +console.log(numeros); // -> [1, 2, 3, 4, 5] +``` + +```js +let fruits = ['banana', 'orange', 'mango', 'lemon']; +fruits.push('apple'); +console.log(fruits); // ['banana', 'orange', 'mango', 'lemon', 'apple'] + +fruits.push('lime'); +console.log(fruits); // ['banana', 'orange', 'mango', 'lemon', 'apple', 'lime'] +``` + +#### Removendo o elemento final usando pop + +pop: Removendo item no final. + +```js +const numeros = [1, 2, 3, 4, 5]; +numeros.pop(); // -> remove um item do final +console.log(numeros); // -> [1, 2, 3, 4] +``` + +#### Removendo um elemento do início + +shift: Removendo um elemento do array no início do array. + +```js +const numeros = [1, 2, 3, 4, 5]; +numeros.shift(); // -> remove um item do início +console.log(numeros); // -> [2, 3, 4, 5] +``` + +#### Adicionando um elemento no início + +unshift: Adicionando um elemento no início do array. + +```js +const numeros = [1, 2, 3, 4, 5]; +numeros.unshift(0); // -> adiciona um item no início +console.log(numeros); // -> [0, 1, 2, 3, 4, 5] +``` + +#### Invertendo a ordem do array + +reverse: inverte a ordem de um array + +```js +const numeros = [1, 2, 3, 4, 5]; +numeros.reverse(); // -> inverte a ordem do array +console.log(numeros); // [5, 4, 3, 2, 1] + +numeros.reverse(); +console.log(numeros); // [1, 2, 3, 4, 5] +``` + +#### Ordenando elementos no array + +sort: organiza os elementos do array em ordem ascendente. Sort aceita uma função de callback, veremos como usar sort com uma função de callback nas próximas seções. + +```js +const webTechs = [ + 'HTML', + 'CSS', + 'JavaScript', + 'React', + 'Redux', + 'Node', + 'MongoDB', +]; + +webTechs.sort(); +console.log(webTechs); // ["CSS", "HTML", "JavaScript", "MongoDB", "Node", "React", "Redux"] + +webTechs.reverse(); // after sorting we can reverse it +console.log(webTechs); // ["Redux", "React", "Node", "MongoDB", "JavaScript", "HTML", "CSS"] +``` + +### Array de arrays + +Um array pode armazenar diferentes tipos de dados, incluindo outro array. Vamos criar um array de arrays: + +```js +const primeirosNumeros = [1, 2, 3]; +const segundosNumeros = [1, 4, 9]; + +const arrayOfArray = [ + [1, 2, 3], + [1, 2, 3], +]; +console.log(arrayOfArray[0]); // [1, 2, 3] + +const frontEnd = ['HTML', 'CSS', 'JS', 'React', 'Redux']; +const backEnd = ['Node', 'Express', 'MongoDB']; +const fullStack = [frontEnd, backEnd]; +console.log(fullStack); // [["HTML", "CSS", "JS", "React", "Redux"], ["Node", "Express", "MongoDB"]] +console.log(fullStack.length); // 2 +console.log(fullStack[0]); // ["HTML", "CSS", "JS", "React", "Redux"] +console.log(fullStack[1]); // ["Node", "Express", "MongoDB"] +``` + +🌕 Você é diligente e já alcançou bastante. Acabou de completar os desafios do dia 5 e está cinco passos à frente no seu caminho para a grandeza. Agora faça alguns exercícios para o seu cérebro e para o seu músculo. + +## 💻 Exercício + +### Exercício: Nível 1 + +```js +const countries = [ + 'Albania', + 'Bolivia', + 'Canada', + 'Denmark', + 'Ethiopia', + 'Finland', + 'Germany', + 'Hungary', + 'Ireland', + 'Japan', + 'Kenya', +]; + +const webTechs = [ + 'HTML', + 'CSS', + 'JavaScript', + 'React', + 'Redux', + 'Node', + 'MongoDB', +]; +``` + +1. Declare um array vazio; +2. Declare um array com mais de 5 elementos; +3. Encontre o comprimento do seu array; +4. Obtenha o primeiro item, o item do meio e o último item do array; +5. Declare um array chamado mixedDataTypes, coloque diferentes tipos de dados no array e encontre o comprimento do array. O tamanho do array deve ser maior que 5; +6. Declare uma variável de array nomeada itCompanies e atribua valores iniciais como Facebook, Google, Microsoft, Apple, IBM, Oracle e Amazon; +7. Imprima o array usando console.log(); +8. Imprima o número de empresas no array; +9. Imprima a primeira empresa, a empresa do meio e a última empresa; +10. Imprima cada empresa; +11. Mude cada nome da empresa para maiúsculas uma a uma e imprima-as; +12. Imprima o array como uma frase: Facebook, Google, Microsoft, Apple, IBM, Oracle e Amazon são grandes empresas de TI. +13. Verifique se uma determinada empresa existe no array itCompanies. Se existir, retorne a empresa, caso contrário, retorne uma mensagem de empresa não encontrada; +14. Filtre empresas que têm mais de um 'o' sem usar o método filter; +15. Ordene o array usando o método sort(); +16. Reverta o array usando o método reverse(); +17. Fatie os primeiros 3 empresas do array; +18. Fatie as últimas 3 empresas do array; +19. Fatie a empresa ou empresas do meio do array; +20. Remova a primeira empresa do array; +21. Remova a empresa ou empresas do meio do array; +22. Remova a última empresa do array; +23. Remova todas as empresas de TI; + +### Exercício: Nível 2 + +1. Crie um arquivo countries.js separado e armazene o array countries nele, crie um arquivo web_techs.js separado e armazene o array webTechs nele. Acesse ambos os arquivos no arquivo main.js; +1. Primeiro remova todas as pontuações e mude a string para array e conte o número de palavras no array; + + ```js + let texto = + 'Eu amo ensinar e empoderar pessoas. Eu ensino HTML, CSS, JS, React, Python.'; + console.log(palavras); + console.log(palavras.length); + ``` + + ```sh + ["I", "love", "teaching", "and", "empowering", "people", "I", "teach", "HTML", "CSS", "JS", "React", "Python"] + + 13 + ``` + +1. No carrinho de compras seguinte, adicione, remova, edite itens; + + ```js + const carrinhoDeCompras = ['Leite', 'Café', 'Chá', 'Mel']; + ``` + + - adicione 'Carne' no início do seu carrinho de compras se ainda não foi adicionado; + - adicione Açúcar no final do seu carrinho de compras se ainda não foi adicionado; + - remova 'Mel' se você for alérgico a mel; + - modifique Chá para 'Chá Verde'; + +1. Verifique no array countries se 'Etiópia' existe no array, se existir, imprima 'ETIÓPIA'. Se não existir, adicione ao array countries. +1. No array webTechs, verifique se Sass existe no array e, se existir, imprima 'Sass é um preprocessador CSS'. Se não existir, adicione Sass ao array e imprima o array. +1. Concatene os seguintes dois variáveis e armazene em uma variável fullStack. + + ```js + const frontEnd = ['HTML', 'CSS', 'JS', 'React', 'Redux']; + const backEnd = ['Node', 'Express', 'MongoDB']; + + console.log(fullStack); + ``` + + ```sh + ["HTML", "CSS", "JS", "React", "Redux", "Node", "Express", "MongoDB"] + ``` + +### Exercício: Nível 3 + +1. A seguir está um array com as idades de 10 estudantes: + + ```js + const idades = [19, 22, 19, 24, 20, 25, 26, 24, 25, 24] + ``` + + - Ordene o array e encontre a idade mínima e máxima + - Encontre a idade mediana (um item do meio ou dois itens do meio divididos por dois) + - Encontre a idade média (todas as idades divididas pelo número de itens) + - Encontre o intervalo das idades (máxima menos mínima) + - Compare o valor de (mínima - média) e (máxima - média), use o método _abs()_ + + 1.Fatie os dez primeiros países do [array de países](https://github.com/Asabeneh/30DaysOfJavaScript/tree/master/data/countries.js) + +1. Encontre o(s) país(es) do meio no [array de países](https://github.com/Asabeneh/30DaysOfJavaScript/tree/master/data/countries.js) +1. Divida o array de países em dois arrays iguais se for par. Se o array de países não for par, adicione um país a mais para a primeira metade. + +🎉 PARABÉNS ! 🎉 + +[<< Day 4](../Dia_04_Condicionais/Dia_04_condicionais.md) | [Day 6 >>](../Dia_06_Loops/dia_06_loops.md) From c1f97f3e1be4daa5dc4a7f864f6bccf2d22c1004 Mon Sep 17 00:00:00 2001 From: Zanderlan Date: Mon, 12 Feb 2024 13:23:53 -0300 Subject: [PATCH 3/8] fix images path and format --- .../Dia_02_Tipos_Dados/dia_02_tipos_dados.md | 842 +++++++++--------- .../Dia_03_booleanos_operadores_data.md | 292 +++--- Portuguese/Dia_05_Arrays/Dia_05_arrays.md | 4 +- 3 files changed, 576 insertions(+), 562 deletions(-) diff --git a/Portuguese/Dia_02_Tipos_Dados/dia_02_tipos_dados.md b/Portuguese/Dia_02_Tipos_Dados/dia_02_tipos_dados.md index 10e7c5463..be626dd18 100644 --- a/Portuguese/Dia_02_Tipos_Dados/dia_02_tipos_dados.md +++ b/Portuguese/Dia_02_Tipos_Dados/dia_02_tipos_dados.md @@ -7,10 +7,11 @@ Twitter Follow - Autor: - Asabeneh Yetayeh
- Janeiro, 2020 -
+Autor: +Asabeneh Yetayeh
+ Janeiro, 2020 +
+ @@ -19,29 +20,29 @@ ![Thirty Days Of JavaScript](/images/banners/day_1_2.png) - [📔 Dia 2](#-dia-2) - - [Tipo de Dados](#tipos-de-dados) - - [Tipos de Dados Primitivos](#tipos-de-dados-primitivos) - - [Tipos de Dados Não Primitivos](#tipos-de-dados-não-primitivos) - - [Números](#Números) - - [Declarando Tipos de Dados Numéricos](#declarando-tipos-de-dados-numéricos) - - [Objeto Math](#objeto-math) - - [Gerador de Número Aleatório](#gerador-de-número-aleatório) - - [Strings](#strings) - - [String Concatenação](#string-concatenação) - - [Concatenando Usando o Operador de Adição](#concatenando-usando-o-operador-de-adição) - - [Escape Sequences em Strings](#escape-sequences-em-strings) - - [Strings Literais (Template Strings)](#Strings-Literais-template-strings) - - [String Métodos](#string-métodos) - - [Verificando Tipos de Dados e Casting](#verificando-tipos-de-dados-e-casting) - - [Verificando Tipos de Dados](#verificando-tipos-de-dados) - - [Mudando Tipo de Dado (Casting)](#mudando-tipo-de-dado-casting) - - [String para Int](#string-para-int) - - [String para Float](#string-para-float) - - [Float para Int](#float-para-int) - - [💻 Dia 2: Exercícios](#-dia-2-exercícios) - - [Exercícios: Level 1](#exercícios-level-1) - - [Exercícios: Level 2](#exercícios-level-2) - - [Exercícios: Level 3](#exercícios-level-3) + - [Tipo de Dados](#tipos-de-dados) + - [Tipos de Dados Primitivos](#tipos-de-dados-primitivos) + - [Tipos de Dados Não Primitivos](#tipos-de-dados-não-primitivos) + - [Números](#Números) + - [Declarando Tipos de Dados Numéricos](#declarando-tipos-de-dados-numéricos) + - [Objeto Math](#objeto-math) + - [Gerador de Número Aleatório](#gerador-de-número-aleatório) + - [Strings](#strings) + - [String Concatenação](#string-concatenação) + - [Concatenando Usando o Operador de Adição](#concatenando-usando-o-operador-de-adição) + - [Escape Sequences em Strings](#escape-sequences-em-strings) + - [Strings Literais (Template Strings)](#Strings-Literais-template-strings) + - [String Métodos](#string-métodos) + - [Verificando Tipos de Dados e Casting](#verificando-tipos-de-dados-e-casting) + - [Verificando Tipos de Dados](#verificando-tipos-de-dados) + - [Mudando Tipo de Dado (Casting)](#mudando-tipo-de-dado-casting) + - [String para Int](#string-para-int) + - [String para Float](#string-para-float) + - [Float para Int](#float-para-int) + - [💻 Dia 2: Exercícios](#-dia-2-exercícios) + - [Exercícios: Level 1](#exercícios-level-1) + - [Exercícios: Level 2](#exercícios-level-2) + - [Exercícios: Level 3](#exercícios-level-3) # 📔 Dia 2 @@ -49,112 +50,112 @@ Na sessão anterior, nós mencionamos um pouco sobre tipos de dados. Tipos de dados decrevem as caracteristicas dos dados, e podem ser divididos em duas categorias: - 1. Tipos de dados primitivos - 2. Tipos de dados não primitivos (de referência do objeto.) +1. Tipos de dados primitivos +2. Tipos de dados não primitivos (de referência do objeto.) ### Tipos de Dados Primitivos Tipos de dados primitivos em JavaScript inclui: - 1. Numbers - Inteiros, floats - 2. Strings - Qualquer dado entre aspas simples, aspas duplas e crase - 3. Booleans - valores verdadeiros ou falsos - 4. Null - valor vazio ou sem valor - 5. Undefined - variável declarada sem um valor - 6. Symbol - Um valor único que pode ser gerado por um construtor de símbolo +1. Numbers - Inteiros, floats +2. Strings - Qualquer dado entre aspas simples, aspas duplas e crase +3. Booleans - valores verdadeiros ou falsos +4. Null - valor vazio ou sem valor +5. Undefined - variável declarada sem um valor +6. Symbol - Um valor único que pode ser gerado por um construtor de símbolo Tipos de dados não primitivos em JavaScriot inclui: - 1. Objetos - 2. Arrays +1. Objetos +2. Arrays Agora, vamos ver exatamente oque significa tipos de dados primitivos e não primitivos. -*Primitivo* são tipos de dados imutáveis (não-modificável). Uma vez criado um tipo de dado primitivo nós não podemos mais modificá-lo. +_Primitivo_ são tipos de dados imutáveis (não-modificável). Uma vez criado um tipo de dado primitivo nós não podemos mais modificá-lo. **Exemplo:** ```js -let exemplo = 'JavaScript' +let exemplo = 'JavaScript'; ``` -Se nós tentarmos modificar uma string armazenada na variável *exemplo*, o JavaScript irá mostar um error. Qualquer dado entre aspas simples, aspas duplas, ou crase é um string. +Se nós tentarmos modificar uma string armazenada na variável _exemplo_, o JavaScript irá mostar um error. Qualquer dado entre aspas simples, aspas duplas, ou crase é um string. ```js -exemplo[0] = 'Y' +exemplo[0] = 'Y'; ``` -Esta expressão não muda a string armazenada na variável *exemplo*. Então, podemos dizer que strings não são modificavéis ou in outras palavras imutáveis. +Esta expressão não muda a string armazenada na variável _exemplo_. Então, podemos dizer que strings não são modificavéis ou in outras palavras imutáveis. Tipos de dados primitivos são comparados pelo seu valor. Vamos comparar valores de dados diferentes. Veja o exemplo abaixo: ```js -let numeroUm = 3 -let numeroDois = 3 +let numeroUm = 3; +let numeroDois = 3; -console.log(numeroUm == numeroDois) // verdadeiro +console.log(numeroUm == numeroDois); // verdadeiro -let js = 'JavaScript' -let py = 'Python' +let js = 'JavaScript'; +let py = 'Python'; -console.log(js == py) // falso +console.log(js == py); // falso -let luzLigar = true -let luzApagar = false +let luzLigar = true; +let luzApagar = false; -console.log(luzLigar == luzApagar) // falso +console.log(luzLigar == luzApagar); // falso ``` ### Tipos de Dados Não Primitivos -*Não primitivos* são tipos de dados modificáveis ou mutáveis. Nós podemos modificar o valor de um dado tipo não primitivo depois de criado. +_Não primitivos_ são tipos de dados modificáveis ou mutáveis. Nós podemos modificar o valor de um dado tipo não primitivo depois de criado. Vamos ver isso criando um array, um array é uma lista de valores de dados entre colchetes. Arrays que contém o mesmo ou diferentes tipos de dados. Valores de Arrays são referenciados pelo seu index. Em JavaScript o index do array começa em zero, em outras palavras o primeiro elemento de um array é encontrado no index zero, o segundo elemento no index um, e o terceiro elemento no index dois, etc. ```js -let numeros = [1, 2, 3] -numeros[0] = 1 +let numeros = [1, 2, 3]; +numeros[0] = 1; -console.log(numeros) // [1, 2, 3] +console.log(numeros); // [1, 2, 3] ``` Como você pode ver, um array é um tipo de dado não primitivo e mutável. Tipos de dados não primitivos não podem ser comparador pelos seus valores. Mesmo se dois tipos de dados não primitivos tem as mesmas propriedades e valores, eles não podem ser estritamentes iguais. ```js -let nums = [1, 2, 3] -let numeros = [1, 2, 3] +let nums = [1, 2, 3]; +let numeros = [1, 2, 3]; -console.log(nums == numeros) // falso +console.log(nums == numeros); // falso let userOne = { -nome:'Asabeneh', -profissao:'professor', -país:'Finland' -} + nome: 'Asabeneh', + profissao: 'professor', + país: 'Finland', +}; let userTwo = { -nome:'Asabeneh', -profissao:'professor', -country:'Finland' -} + nome: 'Asabeneh', + profissao: 'professor', + country: 'Finland', +}; -console.log(userOne == userTwo) // falso +console.log(userOne == userTwo); // falso ``` Regra de ouro, nós não comparamos tipos de dados não primitivos. Não se compara arrays, funções, ou objetos. Porque eles são comparados pela sua referência ao invez do valor. Dois objetos só são estritamentes iguais se a sua referência for o mesmo objeto subjacente. ```js -let nums = [1, 2, 3] -let numeros = nums +let nums = [1, 2, 3]; +let numeros = nums; -console.log(nums == numeros) // verdadeiro +console.log(nums == numeros); // verdadeiro let userOne = { -nome:'Asabeneh', -profissao:'Professor', -país:'Finland' -} + nome: 'Asabeneh', + profissao: 'Professor', + país: 'Finland', +}; -let userTwo = userOne +let userTwo = userOne; -console.log(userOne == userTwo) // verdadeiro +console.log(userOne == userTwo); // verdadeiro ``` Com dificuldade de entender a diferença entre tipos de dados primitivos e tipos de dados não primitivos? Você não é o único. Calma e apenas vá para a próxima sessão e tente voltar aqui depois de algum tempo. Agora vamos começar com tipos de dados do tipo número. @@ -167,78 +168,78 @@ Vamos ver alguns exemplos de Números. ### Declarando Tipos de Dados Numéricos ```js -let idade = 35 -const gravidade = 9.81 // nós usamos const para valores que não mudam, constante gravitacional em 9,8 m/s². -let massa = 72 // massa em Kilogramas -const PI = 3.14 // pi constante geométrica +let idade = 35; +const gravidade = 9.81; // nós usamos const para valores que não mudam, constante gravitacional em 9,8 m/s². +let massa = 72; // massa em Kilogramas +const PI = 3.14; // pi constante geométrica // Mais exemplos -const pontoEbulicao = 100 // temperatura em oC, ponto de ebulução da água que é uma constante -const temperaturaCorpo = 37 // oC média da temperatura corporal humana, que é uma constante +const pontoEbulicao = 100; // temperatura em oC, ponto de ebulução da água que é uma constante +const temperaturaCorpo = 37; // oC média da temperatura corporal humana, que é uma constante -console.log(idade, gravidade, massa, PI, pontoEbulicao, temperaturaCorpo) +console.log(idade, gravidade, massa, PI, pontoEbulicao, temperaturaCorpo); ``` -### Objeto Math +### Objeto Math Em JavaScript o objeto Math promove muitos métodos para trabalhar com números. ```js -const PI = Math.PI +const PI = Math.PI; -console.log(PI) // 3.141592653589793 +console.log(PI); // 3.141592653589793 // arredondando para o número mais próximo // se maior que 0.5 para cima, se menor que 0.5 para baixo. -console.log(Math.round(PI)) // 3 é o valor mais próximo +console.log(Math.round(PI)); // 3 é o valor mais próximo -console.log(Math.round(9.81)) // 10 +console.log(Math.round(9.81)); // 10 -console.log(Math.floor(PI)) // 3 arredondando para baixo +console.log(Math.floor(PI)); // 3 arredondando para baixo -console.log(Math.ceil(PI)) // 4 arredondando para cima +console.log(Math.ceil(PI)); // 4 arredondando para cima -console.log(Math.min(-5, 3, 20, 4, 5, 10)) // -5, retorna o valor mínimo +console.log(Math.min(-5, 3, 20, 4, 5, 10)); // -5, retorna o valor mínimo -console.log(Math.max(-5, 3, 20, 4, 5, 10)) // 20, retorna o valor máximo +console.log(Math.max(-5, 3, 20, 4, 5, 10)); // 20, retorna o valor máximo -const numAleatorio = Math.random() // cria um número aleatório entre 0 até 0.999999 -console.log(numAleatorio) +const numAleatorio = Math.random(); // cria um número aleatório entre 0 até 0.999999 +console.log(numAleatorio); // Vamos criar um número aleatório entre 0 até 10 -const num = Math.floor(Math.random () * 11) // cria um número aleatório entre 0 até 10 -console.log(num) +const num = Math.floor(Math.random() * 11); // cria um número aleatório entre 0 até 10 +console.log(num); // Valor absoluto -console.log(Math.abs(-10)) // 10 +console.log(Math.abs(-10)); // 10 // Raiz quadrada -console.log(Math.sqrt(100)) // 10 +console.log(Math.sqrt(100)); // 10 -console.log(Math.sqrt(2)) // 1.4142135623730951 +console.log(Math.sqrt(2)); // 1.4142135623730951 // Potência -console.log(Math.pow(3, 2)) // 9 +console.log(Math.pow(3, 2)); // 9 -console.log(Math.E) // 2.718 +console.log(Math.E); // 2.718 // Logaritmo // Retorna o logaritmo natural com base E de x, Math.log(x) -console.log(Math.log(2)) // 0.6931471805599453 -console.log(Math.log(10)) // 2.302585092994046 +console.log(Math.log(2)); // 0.6931471805599453 +console.log(Math.log(10)); // 2.302585092994046 // Retorna o logaritmo natural de 2 e 10 repectivamente -console.log(Math.LN2) // 0.6931471805599453 -console.log(Math.LN10) // 2.302585092994046 +console.log(Math.LN2); // 0.6931471805599453 +console.log(Math.LN10); // 2.302585092994046 // Trigonometria -Math.sin(0) -Math.sin(60) +Math.sin(0); +Math.sin(60); -Math.cos(0) -Math.cos(60) +Math.cos(0); +Math.cos(60); ``` #### Gerador de Números Aleatórios @@ -246,19 +247,19 @@ Math.cos(60) O objeto Math do JavaScript tem o método random() que gera números de 0 ate 0.999999999... ```js -let numeroAleatorio = Math.random() // gera de 0 até 0.999... +let numeroAleatorio = Math.random(); // gera de 0 até 0.999... ``` Agora, vamos ver como nós podemos usar o método random() para gerar um número aleatório entre 0 e 10: ```js -let numeroAleatorio = Math.random() // gera de 0 até 0.999 -let numeroEntreZeroAteDez = numeroAleatorio * 11 +let numeroAleatorio = Math.random(); // gera de 0 até 0.999 +let numeroEntreZeroAteDez = numeroAleatorio * 11; -console.log(numeroEntreZeroAteDez) // retorna: min 0 and max 10.99 +console.log(numeroEntreZeroAteDez); // retorna: min 0 and max 10.99 -let numeroAleatorioParaInteiro = Math.floor(numeroEntreZeroAteDez) -console.log(numeroAleatorioParaInteiro) // retorna: entre 0 e 10 +let numeroAleatorioParaInteiro = Math.floor(numeroEntreZeroAteDez); +console.log(numeroAleatorioParaInteiro); // retorna: entre 0 e 10 ``` ## Strings @@ -267,21 +268,21 @@ Strings são textos, que estão entre **_simples_**, **_duplas_**, **_crase_**. Vamos ver alguns exemplos de string: ```js -let espaço = ' ' // um valor de string vazia -let primeiroNone = 'Asabeneh' -let ultimoNome = 'Yetayeh' -let país = 'Finland' -let cidade = 'Helsinki' -let linguagem = 'JavaScript' -let profissao = 'Professor' -let citacao = "The saying,'Seeing is Believing' is not correct in 2020." -let citacaoUsandoCrase = `The saying,'Seeing is Believing' is not correct in 2020.` +let espaço = ' '; // um valor de string vazia +let primeiroNone = 'Asabeneh'; +let ultimoNome = 'Yetayeh'; +let país = 'Finland'; +let cidade = 'Helsinki'; +let linguagem = 'JavaScript'; +let profissao = 'Professor'; +let citacao = "The saying,'Seeing is Believing' is not correct in 2020."; +let citacaoUsandoCrase = `The saying,'Seeing is Believing' is not correct in 2020.`; ``` ### String Concatenação Conectando duas ou mais strings juntas é chamado de concatenação. -Usando as strings declaradas na sessão anterior de strings: +Usando as strings declaradas na sessão anterior de strings: ```js let nomeCompleto = primeiroNone + espaco + ultimoNome; // concatenação, combinar duas ou mais strings juntas. @@ -296,44 +297,46 @@ Nós podemos concatenar strings de jeitos diferentes. #### Concatenando Usando o Operador de Adição -Concatenando usando o operador de adição é o modo antigo de fazer. Este tipo de concatenação é tedioso e propenso a erros. E é muito bom sabe como concatenar deste modo, mas eu sugiro fortemente que use o template ES6 de strings (explicado mais adiante). +Concatenando usando o operador de adição é o modo antigo de fazer. Este tipo de concatenação é tedioso e propenso a erros. E é muito bom sabe como concatenar deste modo, mas eu sugiro fortemente que use o template ES6 de strings (explicado mais adiante). ```js // Declarando diferentes variáveis de diferentes tipos de dados -let espaco = ' ' -let primeiroNome = 'Asabeneh' -let ultimoNome = 'Yetayeh' -let pais = 'Finland' -let cidade = 'Helsinki' -let linguagem = 'JavaScript' -let profissao = 'teacher' -let idade = 250 - -let nomeCompleto = primeiroNome + espaco + ultimoNome +let espaco = ' '; +let primeiroNome = 'Asabeneh'; +let ultimoNome = 'Yetayeh'; +let pais = 'Finland'; +let cidade = 'Helsinki'; +let linguagem = 'JavaScript'; +let profissao = 'teacher'; +let idade = 250; + +let nomeCompleto = primeiroNome + espaco + ultimoNome; let pessoaUmInfo = nomeCompleto + '. I am ' + idade + '. I live in ' + país; // ES5 adição de string -console.log(pessoaUmInfo) +console.log(pessoaUmInfo); ``` ```sh Asabeneh Yetayeh. I am 250. I live in Finland ``` + ### Strings Literais Longas -Uma string pode ser apenas um caractere, paragrafo ou uma página. Se o tamanho da string é maior que a linha. Nós podemos usar o caractere barras invertidas (\\) no final de cada linha para indicar que aquela string irá continuar na próxima linha. +Uma string pode ser apenas um caractere, paragrafo ou uma página. Se o tamanho da string é maior que a linha. Nós podemos usar o caractere barras invertidas (\\) no final de cada linha para indicar que aquela string irá continuar na próxima linha. **Exemplo** ```js -const paragrafo = "My name is Asabeneh Yetayeh. I live in Finland, Helsinki.\ +const paragrafo = + 'My name is Asabeneh Yetayeh. I live in Finland, Helsinki.\ I am a teacher and I love teaching. I teach HTML, CSS, JavaScript, React, Redux, \ Node.js, Python, Data Analysis and D3.js for anyone who is interested to learn. \ In the end of 2019, I was thinking to expand my teaching and to reach \ to global audience and I started a Python challenge from November 20 - December 19.\ It was one of the most rewarding and inspiring experience.\ Now, we are in 2020. I am enjoying preparing the 30DaysOfJavaScript challenge and \ -I hope you are enjoying too." +I hope you are enjoying too.'; -console.log(paragrafo) +console.log(paragrafo); ``` #### Escape Sequences em Strings @@ -345,18 +348,20 @@ Em JavaScript e outras linguagens de programação \ seguido de alguns caractere - \\\\: Barra - \\': Single quote (') - \\": Double quote (") - + ```js -console.log('I hope everyone is enjoying the 30 Days Of JavaScript challenge.\nDo you ?') // quebra de linha -console.log('Days\tTopics\tExercises') -console.log('Day 1\t3\t5') -console.log('Day 2\t3\t5') -console.log('Day 3\t3\t5') -console.log('Day 4\t3\t5') -console.log('This is a backslash symbol (\\)') // Para mostar uma barra -console.log('In every programming language it starts with \"Hello, World!\"') -console.log("In every programming language it starts with \'Hello, World!\'") -console.log('The saying \'Seeing is Believing\' isn\'t correct in 2020') +console.log( + 'I hope everyone is enjoying the 30 Days Of JavaScript challenge.\nDo you ?' +); // quebra de linha +console.log('Days\tTopics\tExercises'); +console.log('Day 1\t3\t5'); +console.log('Day 2\t3\t5'); +console.log('Day 3\t3\t5'); +console.log('Day 4\t3\t5'); +console.log('This is a backslash symbol (\\)'); // Para mostar uma barra +console.log('In every programming language it starts with "Hello, World!"'); +console.log("In every programming language it starts with 'Hello, World!'"); +console.log("The saying 'Seeing is Believing' isn't correct in 2020"); ``` saída no console: @@ -381,35 +386,34 @@ Para criar Strings Literais , nós usamos crases. Nós podemos injetar dados com ```js //Sintaxe -`String literal text` -`String literal text ${expressão}` +`String literal text``String literal text ${expressão}`; ``` **Exemplo: 1** ```js -console.log(`The sum of 2 and 3 is 5`) // escrevendo dados estáticos -let a = 2 -let b = 3 -console.log(`The sum of ${a} and ${b} is ${a + b}`) // injetando dados dinamicamente +console.log(`The sum of 2 and 3 is 5`); // escrevendo dados estáticos +let a = 2; +let b = 3; +console.log(`The sum of ${a} and ${b} is ${a + b}`); // injetando dados dinamicamente ``` **Exemplo:2** ```js -let primeiroNome = 'Asabeneh' -let ultimoNome = 'Yetayeh' -let pais = 'Finland' -let cidade = 'Helsinki' -let linguagem = 'JavaScript' -let profissao = 'teacher' -let idade = 250 -let nomeCompleto = primeiroNome + ' ' + ultimoNome +let primeiroNome = 'Asabeneh'; +let ultimoNome = 'Yetayeh'; +let pais = 'Finland'; +let cidade = 'Helsinki'; +let linguagem = 'JavaScript'; +let profissao = 'teacher'; +let idade = 250; +let nomeCompleto = primeiroNome + ' ' + ultimoNome; -let pessoaInfoUm = `I am ${nomeCompleto}. I am ${idade}. I live in ${pais}.` //ES6 - Método de interpolação de String -let pesoaInfoDois = `I am ${nomeCompleto}. I live in ${cidade}, ${pais}. I am a ${profissao}. I teach ${linguagem}.` -console.log(pessoaInfoUm) -console.log(pesoaInfoDois) +let pessoaInfoUm = `I am ${nomeCompleto}. I am ${idade}. I live in ${pais}.`; //ES6 - Método de interpolação de String +let pesoaInfoDois = `I am ${nomeCompleto}. I live in ${cidade}, ${pais}. I am a ${profissao}. I teach ${linguagem}.`; +console.log(pessoaInfoUm); +console.log(pesoaInfoDois); ``` ```sh @@ -420,9 +424,9 @@ I am Asabeneh Yetayeh. I live in Helsinki, Finland. I am a teacher. I teach Java Usando Literais ou método de interpolação de String, nós podemos adicionar expressões, que podem ser algum valor, ou alguma operação (comparação, aritimética, operador ternário). ```js -let a = 2 -let b = 3 -console.log(`${a} é maior que ${b}: ${a > b}`) +let a = 2; +let b = 3; +console.log(`${a} é maior que ${b}: ${a > b}`); ``` ```sh @@ -431,320 +435,324 @@ console.log(`${a} é maior que ${b}: ${a > b}`) ### String Métodos -Tudo em JavaScript é um objeto. String é um tipo de dado primitivo, que significa que não podemos modificá-la uma vez criada. Um objeto String pode ter vários métodos. Existe diferentes métodos para strings que pode nos ajudar. +Tudo em JavaScript é um objeto. String é um tipo de dado primitivo, que significa que não podemos modificá-la uma vez criada. Um objeto String pode ter vários métodos. Existe diferentes métodos para strings que pode nos ajudar. -1. *length*: O método *length* retorna o número de caracteres em uma string incluindo espaços vázios. +1. _length_: O método _length_ retorna o número de caracteres em uma string incluindo espaços vázios. **Exemplo:** ```js -let js = 'JavaScript' -console.log(js.length) // 10 -let primeiroNome = 'Asabeneh' -console.log(primeiroNome.length) // 8 +let js = 'JavaScript'; +console.log(js.length); // 10 +let primeiroNome = 'Asabeneh'; +console.log(primeiroNome.length); // 8 ``` -2. *Acessando caracteres em uma string*: Nós podemos acessar cada caractere em uma string usando seu index. Em programação, a contagem começa em 0. O primeiro index de uma string é zero, e o último index é o length de uma string - 1. - - ![Accessing string by index](../images/string_indexes.png) +2. _Acessando caracteres em uma string_: Nós podemos acessar cada caractere em uma string usando seu index. Em programação, a contagem começa em 0. O primeiro index de uma string é zero, e o último index é o length de uma string - 1. + +![Accessing string by index](/images/string_indexes.png) Vamos acessar diferentes caracteres em 'JavaScript' string. ```js -let string = 'JavaScript' -let primeiraLetra = string[0] +let string = 'JavaScript'; +let primeiraLetra = string[0]; -console.log(primeiraLetra) // J +console.log(primeiraLetra); // J -let segundaLetra = string[1] // a -let terceiraLetra = string[2] -let ultimaLetra = string[9] +let segundaLetra = string[1]; // a +let terceiraLetra = string[2]; +let ultimaLetra = string[9]; -console.log(ultimaLetra) // t +console.log(ultimaLetra); // t -let ultimoIndex = string.length - 1 +let ultimoIndex = string.length - 1; -console.log(ultimoIndex) // 9 -console.log(string[ultimoIndex]) // t +console.log(ultimoIndex); // 9 +console.log(string[ultimoIndex]); // t ``` -3. *toUpperCase()*: Este método muda a string para letras maiúsculas. +3. _toUpperCase()_: Este método muda a string para letras maiúsculas. ```js -let string = 'JavaScript' +let string = 'JavaScript'; -console.log(string.toUpperCase()) // JAVASCRIPT +console.log(string.toUpperCase()); // JAVASCRIPT -let primeiroNome = 'Asabeneh' +let primeiroNome = 'Asabeneh'; -console.log(primeiroNome.toUpperCase()) // ASABENEH +console.log(primeiroNome.toUpperCase()); // ASABENEH -let pais = 'Finland' +let pais = 'Finland'; -console.log(país.toUpperCase()) // FINLAND +console.log(país.toUpperCase()); // FINLAND ``` -4. *toLowerCase()*: Este método muda a string para letras minúsculas. +4. _toLowerCase()_: Este método muda a string para letras minúsculas. ```js -let string = 'JavasCript' +let string = 'JavasCript'; -console.log(string.toLowerCase()) // javascript +console.log(string.toLowerCase()); // javascript -let primeiroNome = 'Asabeneh' +let primeiroNome = 'Asabeneh'; -console.log(primeiroNome.toLowerCase()) // asabeneh +console.log(primeiroNome.toLowerCase()); // asabeneh -let pais = 'Finland' +let pais = 'Finland'; -console.log(pais.toLowerCase()) // finland +console.log(pais.toLowerCase()); // finland ``` -5. *substr()*: usando dois argumentos, o index de onde irá começar e o número de caracteres para retirar da string. +5. _substr()_: usando dois argumentos, o index de onde irá começar e o número de caracteres para retirar da string. ```js -let string = 'JavaScript' -console.log(string.substr(4,6)) // Script +let string = 'JavaScript'; +console.log(string.substr(4, 6)); // Script -let pais = 'Finland' -console.log(país.substr(3, 4)) // land +let pais = 'Finland'; +console.log(país.substr(3, 4)); // land ``` -6. *substring()*: Usando dois argumentos, o index de onde irá começar e o index para parar, mas esse não inclui o caractere no index de parada. +6. _substring()_: Usando dois argumentos, o index de onde irá começar e o index para parar, mas esse não inclui o caractere no index de parada. ```js -let string = 'JavaScript' +let string = 'JavaScript'; -console.log(string.substring(0,4)) // Java -console.log(string.substring(4,10)) // Script -console.log(string.substring(4)) // Script +console.log(string.substring(0, 4)); // Java +console.log(string.substring(4, 10)); // Script +console.log(string.substring(4)); // Script -let pais = 'Finland' +let pais = 'Finland'; -console.log(país.substring(0, 3)) // Fin -console.log(país.substring(3, 7)) // land -console.log(país.substring(3)) // land +console.log(país.substring(0, 3)); // Fin +console.log(país.substring(3, 7)); // land +console.log(país.substring(3)); // land ``` -7. *split()*: O método split divide uma string em um lugar especifico e converte em um array. +7. _split()_: O método split divide uma string em um lugar especifico e converte em um array. ```js -let string = '30 Days Of JavaScript' +let string = '30 Days Of JavaScript'; -console.log(string.split()) // muda para um array -> ["30 Days Of JavaScript"] -console.log(string.split(' ')) // separa em um array com espaço -> ["30", "Days", "Of", "JavaScript"] +console.log(string.split()); // muda para um array -> ["30 Days Of JavaScript"] +console.log(string.split(' ')); // separa em um array com espaço -> ["30", "Days", "Of", "JavaScript"] -let primeiroNome = 'Asabeneh' +let primeiroNome = 'Asabeneh'; -console.log(primeiroNome.split()) // muda para um array - > ["Asabeneh"] -console.log(primeiroNome.split('')) // separa em um array cada letra -> ["A", "s", "a", "b", "e", "n", "e", "h"] +console.log(primeiroNome.split()); // muda para um array - > ["Asabeneh"] +console.log(primeiroNome.split('')); // separa em um array cada letra -> ["A", "s", "a", "b", "e", "n", "e", "h"] -let pais = 'Finland, Sweden, Norway, Denmark, and Iceland' +let pais = 'Finland, Sweden, Norway, Denmark, and Iceland'; -console.log(país.split(',')) // separa para um array com vírgula -> ["Finland", " Sweden", " Norway", " Denmark", " and Iceland"] -console.log(país.split(', ')) //  ["Finland", "Sweden", "Norway", "Denmark", "and Iceland"] +console.log(país.split(',')); // separa para um array com vírgula -> ["Finland", " Sweden", " Norway", " Denmark", " and Iceland"] +console.log(país.split(', ')); //  ["Finland", "Sweden", "Norway", "Denmark", "and Iceland"] ``` -8. *trim()*: Remove espaços adicionais no início ou no final de uma string. +8. _trim()_: Remove espaços adicionais no início ou no final de uma string. ```js -let string = ' 30 Days Of JavaScript ' +let string = ' 30 Days Of JavaScript '; -console.log(string) -console.log(string.trim(' ')) +console.log(string); +console.log(string.trim(' ')); -let primeiroNome = ' Asabeneh ' +let primeiroNome = ' Asabeneh '; -console.log(primeiroNome) -console.log(primeiroNome.trim()) // ainda remove espaços no início e no fim da string +console.log(primeiroNome); +console.log(primeiroNome.trim()); // ainda remove espaços no início e no fim da string ``` ```sh - 30 Days Of JavasCript + 30 Days Of JavasCript 30 Days Of JavasCript - Asabeneh + Asabeneh Asabeneh ``` -9. *includes()*: Usando uma substring como argumento, e então verifica se o argumento exise na string. *includes()* retorna um boolean. Se uma substring existe na string, então retorna true, senão retornará false. +9. _includes()_: Usando uma substring como argumento, e então verifica se o argumento exise na string. _includes()_ retorna um boolean. Se uma substring existe na string, então retorna true, senão retornará false. ```js -let string = '30 Days Of JavaScript' +let string = '30 Days Of JavaScript'; -console.log(string.includes('Days')) // true -console.log(string.includes('days')) // false - é case sensitive! -console.log(string.includes('Script')) // true -console.log(string.includes('script')) // false -console.log(string.includes('java')) // false -console.log(string.includes('Java')) // true +console.log(string.includes('Days')); // true +console.log(string.includes('days')); // false - é case sensitive! +console.log(string.includes('Script')); // true +console.log(string.includes('script')); // false +console.log(string.includes('java')); // false +console.log(string.includes('Java')); // true -let pais = 'Finland' +let pais = 'Finland'; -console.log(país.includes('fin')) // false -console.log(país.includes('Fin')) // true -console.log(país.includes('land')) // true -console.log(país.includes('Land')) // false +console.log(país.includes('fin')); // false +console.log(país.includes('Fin')); // true +console.log(país.includes('land')); // true +console.log(país.includes('Land')); // false ``` -10. *replace()*: Usando como parâmetro a antiga substring para uma nova substring. +10. _replace()_: Usando como parâmetro a antiga substring para uma nova substring. ```js -string.replace(antigaSubstring, novaSubstring) +string.replace(antigaSubstring, novaSubstring); ``` ```js -let string = '30 Days Of JavaScript' -console.log(string.replace('JavaScript', 'Python')) // 30 Days Of Python +let string = '30 Days Of JavaScript'; +console.log(string.replace('JavaScript', 'Python')); // 30 Days Of Python -let pais = 'Finland' -console.log(país.replace('Fin', 'Noman')) // Nomanland +let pais = 'Finland'; +console.log(país.replace('Fin', 'Noman')); // Nomanland ``` -11. *charAt()*: Usando um index e retorna o valor no index selecionado; + +11. _charAt()_: Usando um index e retorna o valor no index selecionado; ```js -string.charAt(index) +string.charAt(index); ``` ```js -let string = '30 Days Of JavaScript' -console.log(string.charAt(0)) // 3 +let string = '30 Days Of JavaScript'; +console.log(string.charAt(0)); // 3 -let ultimoIndex = string.length - 1 -console.log(string.charAt(ultimoIndex)) // t +let ultimoIndex = string.length - 1; +console.log(string.charAt(ultimoIndex)); // t ``` -12. *charCodeAt()*: Usando um index e retorna o código de caractere (número ASCII) do valor nesse index. +12. _charCodeAt()_: Usando um index e retorna o código de caractere (número ASCII) do valor nesse index. ```js -string.charCodeAt(index) +string.charCodeAt(index); ``` ```js -let string = '30 Days Of JavaScript' -console.log(string.charCodeAt(3)) // D ASCII número é 68 - -let ultimoIndex = string.length - 1 -console.log(string.charCodeAt(ultimoIndex)) // t ASCII é 116 +let string = '30 Days Of JavaScript'; +console.log(string.charCodeAt(3)); // D ASCII número é 68 +let ultimoIndex = string.length - 1; +console.log(string.charCodeAt(ultimoIndex)); // t ASCII é 116 ``` -13. *indexOf()*: Usando uma substring e o mesmo existe em uma string retorna a primeira posição da substring, se não existe retornará -1 + +13. _indexOf()_: Usando uma substring e o mesmo existe em uma string retorna a primeira posição da substring, se não existe retornará -1 ```js -string.indexOf(substring) +string.indexOf(substring); ``` ```js -let string = '30 Days Of JavaScript' +let string = '30 Days Of JavaScript'; -console.log(string.indexOf('D')) // 3 -console.log(string.indexOf('Days')) // 3 -console.log(string.indexOf('days')) // -1 -console.log(string.indexOf('a')) // 4 -console.log(string.indexOf('JavaScript')) // 11 -console.log(string.indexOf('Script')) //15 -console.log(string.indexOf('script')) // -1 +console.log(string.indexOf('D')); // 3 +console.log(string.indexOf('Days')); // 3 +console.log(string.indexOf('days')); // -1 +console.log(string.indexOf('a')); // 4 +console.log(string.indexOf('JavaScript')); // 11 +console.log(string.indexOf('Script')); //15 +console.log(string.indexOf('script')); // -1 ``` -14. *lastIndexOf()*: Usando uma substring e o mesmo existe em uma string retorna a última posição da substring, se não existe retornará -1 +14. _lastIndexOf()_: Usando uma substring e o mesmo existe em uma string retorna a última posição da substring, se não existe retornará -1 ```js //syntax -string.lastIndexOf(substring) +string.lastIndexOf(substring); ``` ```js -let string = 'Eu amo JavaScript. Se você não ama JavaScript oque mais voce pode amar?' +let string = + 'Eu amo JavaScript. Se você não ama JavaScript oque mais voce pode amar?'; -console.log(string.lastIndexOf('love')) // 66 -console.log(string.lastIndexOf('you')) // 56 -console.log(string.lastIndexOf('JavaScript')) // 35 +console.log(string.lastIndexOf('love')); // 66 +console.log(string.lastIndexOf('you')); // 56 +console.log(string.lastIndexOf('JavaScript')); // 35 ``` -15. *concat()*: Usando algumas substring e os adiciona (Join). +15. _concat()_: Usando algumas substring e os adiciona (Join). ```js -string.concat(substring, substring, substring) +string.concat(substring, substring, substring); ``` ```js -let string = '30' -console.log(string.concat(" Days ", "Of", " JavaScript")) // 30 Days Of JavaScript +let string = '30'; +console.log(string.concat(' Days ', 'Of', ' JavaScript')); // 30 Days Of JavaScript -let country = 'Fin' -console.log(country.concat("land")) // Finland +let country = 'Fin'; +console.log(country.concat('land')); // Finland ``` -16. *startsWith*: Usando uma substring como argumento, e verifica se a string começa com aquela substring específica. E retorna um boolean(true ou false). +16. _startsWith_: Usando uma substring como argumento, e verifica se a string começa com aquela substring específica. E retorna um boolean(true ou false). ```js //syntax -string.startsWith(substring) +string.startsWith(substring); ``` ```js -let string = 'Love is the best to in this world' +let string = 'Love is the best to in this world'; -console.log(string.startsWith('Love')) // true -console.log(string.startsWith('love')) // false -console.log(string.startsWith('world')) // false +console.log(string.startsWith('Love')); // true +console.log(string.startsWith('love')); // false +console.log(string.startsWith('world')); // false -let country = 'Finland' +let country = 'Finland'; -console.log(country.startsWith('Fin')) // true -console.log(country.startsWith('fin')) // false -console.log(country.startsWith('land')) // false +console.log(country.startsWith('Fin')); // true +console.log(country.startsWith('fin')); // false +console.log(country.startsWith('land')); // false ``` -17. *endsWith*: Usando uma substring como argumento, e verifica se a string termina com aquela substring específica. E retorna um boolean(true ou false). +17. _endsWith_: Usando uma substring como argumento, e verifica se a string termina com aquela substring específica. E retorna um boolean(true ou false). ```js -string.endsWith(substring) +string.endsWith(substring); ``` ```js -let string = 'Love is the most powerful feeling in the world' +let string = 'Love is the most powerful feeling in the world'; -console.log(string.endsWith('world')) // true -console.log(string.endsWith('love')) // false -console.log(string.endsWith('in the world')) // true +console.log(string.endsWith('world')); // true +console.log(string.endsWith('love')); // false +console.log(string.endsWith('in the world')); // true -let pais = 'Finland' +let pais = 'Finland'; -console.log(país.endsWith('land')) // true -console.log(país.endsWith('fin')) // false -console.log(país.endsWith('Fin')) // false +console.log(país.endsWith('land')); // true +console.log(país.endsWith('fin')); // false +console.log(país.endsWith('Fin')); // false ``` -18. *search*: Usando uma substring como um argumento e retorna o index do primeiro resultado. O valor da pesquisa pode ser uma string ou uma expressão regular. +18. _search_: Usando uma substring como um argumento e retorna o index do primeiro resultado. O valor da pesquisa pode ser uma string ou uma expressão regular. ```js -string.search(substring) +string.search(substring); ``` ```js -let string = 'I love JavaScript. If you do not love JavaScript what else can you love.' -console.log(string.search('love')) // 2 -console.log(string.search(/javascript/gi)) // 7 +let string = + 'I love JavaScript. If you do not love JavaScript what else can you love.'; +console.log(string.search('love')); // 2 +console.log(string.search(/javascript/gi)); // 7 ``` -19. *match*: Usando uma substring ou expressão regular como um argumento, e retorna um array se exite um resultado, se nao retorna null. Vamos ver como uma expressão regular se parece. Começa com / sinal e terminar com / sinal. +19. _match_: Usando uma substring ou expressão regular como um argumento, e retorna um array se exite um resultado, se nao retorna null. Vamos ver como uma expressão regular se parece. Começa com / sinal e terminar com / sinal. ```js -let string = 'love' -let patternOne = /love/ // sem nenhuma flag -let patternTwo = /love/gi // g-significa procurar em todo o texto, i - case insensitive +let string = 'love'; +let patternOne = /love/; // sem nenhuma flag +let patternTwo = /love/gi; // g-significa procurar em todo o texto, i - case insensitive ``` Sintaxe ```js // syntax -string.match(substring) +string.match(substring); ``` ```js -let string = 'I love JavaScript. If you do not love JavaScript what else can you love.' -console.log(string.match('love')) +let string = + 'I love JavaScript. If you do not love JavaScript what else can you love.'; +console.log(string.match('love')); ``` ```sh @@ -752,33 +760,34 @@ console.log(string.match('love')) ``` ```js -let pattern = /love/gi -console.log(string.match(pattern)) // ["love", "love", "love"] +let pattern = /love/gi; +console.log(string.match(pattern)); // ["love", "love", "love"] ``` "Vamos extrair números de um texto usando uma expressão regular. Essa não é a seção de expressões regulares, não se assuste! Vamos cobrir expressões regulares mais tarde." ```js -let txt = 'In 2019, I ran 30 Days of Python. Now, in 2020 I am super exited to start this challenge' -let regEx = /\d+/ +let txt = + 'In 2019, I ran 30 Days of Python. Now, in 2020 I am super exited to start this challenge'; +let regEx = /\d+/; // A letra 'd' com o caractere de escape significa 'd' não como uma letra normal, mas sim como um dígito. // O sinal '+' significa um ou mais números de dígitos, // Se houver a letra 'g' depois disso, significa global, pesquisar em todos os lugares. -console.log(txt.match(regEx)) // ["2", "0", "1", "9", "3", "0", "2", "0", "2", "0"] -console.log(txt.match(/\d+/g)) // ["2019", "30", "2020"] +console.log(txt.match(regEx)); // ["2", "0", "1", "9", "3", "0", "2", "0", "2", "0"] +console.log(txt.match(/\d+/g)); // ["2019", "30", "2020"] ``` -20. *repeat()*: Um número como argumento e retorna uma versão repetida de uma string. +20. _repeat()_: Um número como argumento e retorna uma versão repetida de uma string. ```js -string.repeat(n) +string.repeat(n); ``` ```js -let string = 'love' -console.log(string.repeat(10)) // lovelovelovelovelovelovelovelovelovelove +let string = 'love'; +console.log(string.repeat(10)); // lovelovelovelovelovelovelovelovelovelove ``` ## Verificando Tipos de Dados e Casting @@ -793,23 +802,23 @@ Para verificar o tipo de uma variável nós usamos o método _typeOf_. // Diferente tipos de dados javascript // vamos declarar diferentes tipos de dados -let primeiroNome = 'Asabeneh' // string -let ultimoNome = 'Yetayeh' // string -let pais = 'Finland' // string -let cidade = 'Helsinki' // string -let idade = 250 // número, não é minha idade real, não se preocupe com isso -let profissao // undefined, porque o valor não foi definido. - -console.log(typeof 'Asabeneh') // string -console.log(typeof primeiroNome) // string -console.log(typeof 10) // number -console.log(typeof 3.14) // number -console.log(typeof true) // boolean -console.log(typeof false) // boolean -console.log(typeof NaN) // number -console.log(typeof profissao) // undefined -console.log(typeof undefined) // undefined -console.log(typeof null) // object +let primeiroNome = 'Asabeneh'; // string +let ultimoNome = 'Yetayeh'; // string +let pais = 'Finland'; // string +let cidade = 'Helsinki'; // string +let idade = 250; // número, não é minha idade real, não se preocupe com isso +let profissao; // undefined, porque o valor não foi definido. + +console.log(typeof 'Asabeneh'); // string +console.log(typeof primeiroNome); // string +console.log(typeof 10); // number +console.log(typeof 3.14); // number +console.log(typeof true); // boolean +console.log(typeof false); // boolean +console.log(typeof NaN); // number +console.log(typeof profissao); // undefined +console.log(typeof undefined); // undefined +console.log(typeof null); // object ``` ### Mudando Tipo de Dado (Casting) @@ -827,23 +836,23 @@ Podemos converter uma string para um número usando os seguintes métodos: - Plus sign(+) ```js -let num = '10' -let numInt = parseInt(num) -console.log(numInt) // 10 +let num = '10'; +let numInt = parseInt(num); +console.log(numInt); // 10 ``` ```js -let num = '10' -let numInt = Number(num) +let num = '10'; +let numInt = Number(num); -console.log(numInt) // 10 +console.log(numInt); // 10 ``` ```js -let num = '10' -let numInt = +num +let num = '10'; +let numInt = +num; -console.log(numInt) // 10 +console.log(numInt); // 10 ``` #### String para Float @@ -857,24 +866,24 @@ Podemos converter string float número usando os seguintes métodos: - Plus sign(+) ```js -let num = '9.81' -let numFloat = parseFloat(num) +let num = '9.81'; +let numFloat = parseFloat(num); -console.log(numFloat) // 9.81 +console.log(numFloat); // 9.81 ``` ```js -let num = '9.81' -let numFloat = Number(num) +let num = '9.81'; +let numFloat = Number(num); -console.log(numFloat) // 9.81 +console.log(numFloat); // 9.81 ``` ```js -let num = '9.81' -let numFloat = +num +let num = '9.81'; +let numFloat = +num; -console.log(numFloat) // 9.81 +console.log(numFloat); // 9.81 ``` #### Float para Int @@ -883,67 +892,70 @@ Podemos converter float números para inteiro. Vamos usar o seguinte método para converter float para int. - parseInt() - + ```js -let num = 9.81 -let numInt = parseInt(num) +let num = 9.81; +let numInt = parseInt(num); -console.log(numInt) // 9 +console.log(numInt); // 9 ``` -🌕 Você é incrível. Você acabou de completar o dia 2 e está dois passos a frente no seu caminho para o sucesso. Agora faça alguns exercícios para seu cérebro e músculos. +🌕 Você é incrível. Você acabou de completar o dia 2 e está dois passos a frente no seu caminho para o sucesso. Agora faça alguns exercícios para seu cérebro e músculos. ## 💻 Dia 2: Exercícios ### Exercícios: Level 1 -1. Declare uma variável chamada desafio e atribua a ela um valor inicial **'30 Dias de JavaScript'**. -2. Imprimir uma string no console do browser usando __console.log()__ . -3. Imprimir o __length__ da string no console do browser usando o __console.log()__. -4. Troque todos os caracteres da string para letras maiúsculas usando o método __toUpperCase()__. -5. Troque todos os caracteres da string para letras minúsculas usando o método __toLowerCase()__. -6. Retirar (Slice) a primeira letra da string usando os métodos __substr()__ ou __substring()__. -7. Dividir a frase *Days Of JavaScript* de *30 Days Of JavaScript*. -8. Verificar se a string contém a palavra __Script__ usando o método __includes()__. -9. Separar a __string__ em um __array__ usando o método __split()__. -10. Separar a string 30 Dias de JavaScript com espaços usando o método __split()__. -11. "Facebook, Google, Microsoft, Apple, IBM, Oracle, Amazon" __split__ a string com vírgulas e mude-a para um array. -12. Mude 30 Dias de JavaScript para 30 Dias de Python usando o método __replace()__. -13. Qual é o caractere no index 15 em "30 Dias de JavaScript' string? Use o método __charAt()__. -14. Qual é o código do caractere de J em "30 Dias de JavaScript" string usando o método __charCodeAt()__. -15. Use __indexOf__ para determinar a posição da primeira ocorrência de __a__ em 30 Dias de JavaScript. -16. Use __lastIndexOf__ para determinar a posição da última ocorrência de __a__ em 30 Dias de JavaScript. -17. Use __indexOf__ para encontrar a posição da primeira ocorrência da palavra __because__ na seguinte frase:__'You cannot end a sentence with because because because is a conjunction'__. -18. Use __lastIndexOf__ para encontrar a posição da última ocorrência da palavra __because__ na seguinte frase:__'You cannot end a sentence with because because because is a conjunction'__. -19. Use __search__ para encontrar a posição da primeira ocorrência da palavra __because__ na seguinte frase:__'You cannot end a sentence with because because because is a conjunction'__. -20. Use __trim()__ para remover qualquer espaço adicional no início e no final da string .E.g " 30 Dias de JavaScript ". -21. Use __startsWith()__ com a string *30 Dias De JavaScript* e faça o resultado ser verdadeiro. -22. Use __endsWith()__ com a string *30 Dias De JavaScript* e faça o resultado ser verdadeiro. -23. Use __match()__ para encontrar todos os __a__'s em 30 Dias De JavaScript. -24. Use __concat()__ para unir "30 Dias de" e "JavaScript" para uma única string, "30 Dias de JavaScript". -25. Use __repeat()__ para imprimir 30 Dias De JavaScript 2 vezes. +1. Declare uma variável chamada desafio e atribua a ela um valor inicial **'30 Dias de JavaScript'**. +2. Imprimir uma string no console do browser usando **console.log()** . +3. Imprimir o **length** da string no console do browser usando o **console.log()**. +4. Troque todos os caracteres da string para letras maiúsculas usando o método **toUpperCase()**. +5. Troque todos os caracteres da string para letras minúsculas usando o método **toLowerCase()**. +6. Retirar (Slice) a primeira letra da string usando os métodos **substr()** ou **substring()**. +7. Dividir a frase _Days Of JavaScript_ de _30 Days Of JavaScript_. +8. Verificar se a string contém a palavra **Script** usando o método **includes()**. +9. Separar a **string** em um **array** usando o método **split()**. +10. Separar a string 30 Dias de JavaScript com espaços usando o método **split()**. +11. "Facebook, Google, Microsoft, Apple, IBM, Oracle, Amazon" **split** a string com vírgulas e mude-a para um array. +12. Mude 30 Dias de JavaScript para 30 Dias de Python usando o método **replace()**. +13. Qual é o caractere no index 15 em "30 Dias de JavaScript' string? Use o método **charAt()**. +14. Qual é o código do caractere de J em "30 Dias de JavaScript" string usando o método **charCodeAt()**. +15. Use **indexOf** para determinar a posição da primeira ocorrência de **a** em 30 Dias de JavaScript. +16. Use **lastIndexOf** para determinar a posição da última ocorrência de **a** em 30 Dias de JavaScript. +17. Use **indexOf** para encontrar a posição da primeira ocorrência da palavra **because** na seguinte frase:**'You cannot end a sentence with because because because is a conjunction'**. +18. Use **lastIndexOf** para encontrar a posição da última ocorrência da palavra **because** na seguinte frase:**'You cannot end a sentence with because because because is a conjunction'**. +19. Use **search** para encontrar a posição da primeira ocorrência da palavra **because** na seguinte frase:**'You cannot end a sentence with because because because is a conjunction'**. +20. Use **trim()** para remover qualquer espaço adicional no início e no final da string .E.g " 30 Dias de JavaScript ". +21. Use **startsWith()** com a string _30 Dias De JavaScript_ e faça o resultado ser verdadeiro. +22. Use **endsWith()** com a string _30 Dias De JavaScript_ e faça o resultado ser verdadeiro. +23. Use **match()** para encontrar todos os **a**'s em 30 Dias De JavaScript. +24. Use **concat()** para unir "30 Dias de" e "JavaScript" para uma única string, "30 Dias de JavaScript". +25. Use **repeat()** para imprimir 30 Dias De JavaScript 2 vezes. ### Exercícios: Level 2 1. Usando o console.log() imprimir a seguinte citação: - ```sh - "Não há exercício melhor para o coração que ir lá em baixo e levantar as pessoas" by John Holmes nos ensina a ajudar outras pessoas. - ``` + +```sh + "Não há exercício melhor para o coração que ir lá em baixo e levantar as pessoas" by John Holmes nos ensina a ajudar outras pessoas. +``` 2. Usando o console.log() imprimir a seguinte citação de Madre Teresa: - ```sh - "O amor não é paternalista e a caridade não tem a ver com pena, tem a ver com amor. Caridade e amor são a mesma coisa – com a caridade você dá amor, então não dê apenas dinheiro, mas estenda sua mão." - ``` + +```sh + "O amor não é paternalista e a caridade não tem a ver com pena, tem a ver com amor. Caridade e amor são a mesma coisa – com a caridade você dá amor, então não dê apenas dinheiro, mas estenda sua mão." +``` 3. Verificar se typeOf "10" é exatamente igual a 10. Se não, faça ser exatamente igual. 4. Verificar se parseFloat("9.8) é igual a 10. Se não, faça ser exatamente igual com 10. 5. Verificar se "ão" é encontrado em ambos algodão e jargão. -6. _Espero que este curso não tenha muitos jargões_. Verifique se _jargões_ está na frase. +6. _Espero que este curso não tenha muitos jargões_. Verifique se _jargões_ está na frase. 7. Gerar um número aleatório entre incluindo 0 e 100. 8. Gerar um número aleatório entre incluindo 50 e 100. 9. Gerar um número aleatório entre incluindo 0 e 255. 10. Acesse os caracteres da string "JavaScript" usando um número aleatório. 11. Use console.log() e imprimir os caracteres no seguinte padrão. + ```js 1 1 1 1 1 2 1 2 4 8 @@ -952,20 +964,22 @@ console.log(numInt) // 9 5 1 5 25 125 ``` -12. Use __substr__ para retirar da frase __because because because__ da seguinte frase: __'You cannot end a sentence with because because because is a conjunction'__. +12. Use **substr** para retirar da frase **because because because** da seguinte frase: **'You cannot end a sentence with because because because is a conjunction'**. ### Exercícios: Level 3 -1. "Amor é a melhor coisa neste mundo. Alguns encontraram seu amor e alguns ainda estão procurando pelo seu amor." Contar o número de palavras __amor__ nesta frase. +1. "Amor é a melhor coisa neste mundo. Alguns encontraram seu amor e alguns ainda estão procurando pelo seu amor." Contar o número de palavras **amor** nesta frase. -2. Use __match()__ para contar os números de todos os __because__ na seguinte frase: __'You cannot end a sentence with because because because is a conjunction'__. +2. Use **match()** para contar os números de todos os **because** na seguinte frase: **'You cannot end a sentence with because because because is a conjunction'**. 3. Limpar o seguinte texto e encontrar a palavra mais repetida (dica, use replace e expressões regulares) - ```js - const frase = " %I $am@% a %tea@cher%, &and& I lo%#ve %te@a@ching%;. The@re $is no@th@ing; &as& mo@re rewarding as educa@ting &and& @emp%o@weri@ng peo@ple. ;I found tea@ching m%o@re interesting tha@n any ot#her %jo@bs. %Do@es thi%s mo@tiv#ate yo@u to be a tea@cher!? %Th#is 30#Days&OfJavaScript &is al@so $the $resu@lt of &love& of tea&ching " - ``` -4. Calcular o total anual de uma pessoa extraindo os números do seguinte texto. __"Ele recebe 5000 euros de salário por mês, 10000 euros de bônus anual, 15000 euros de cursos onlines por mês.'__. +```js +const frase = + ' %I $am@% a %tea@cher%, &and& I lo%#ve %te@a@ching%;. The@re $is no@th@ing; &as& mo@re rewarding as educa@ting &and& @emp%o@weri@ng peo@ple. ;I found tea@ching m%o@re interesting tha@n any ot#her %jo@bs. %Do@es thi%s mo@tiv#ate yo@u to be a tea@cher!? %Th#is 30#Days&OfJavaScript &is al@so $the $resu@lt of &love& of tea&ching '; +``` + +4. Calcular o total anual de uma pessoa extraindo os números do seguinte texto. **"Ele recebe 5000 euros de salário por mês, 10000 euros de bônus anual, 15000 euros de cursos onlines por mês.'**. 🎉 PARABÉNS ! 🎉 diff --git a/Portuguese/Dia_03_Booleanos_Operadores_Data/Dia_03_booleanos_operadores_data.md b/Portuguese/Dia_03_Booleanos_Operadores_Data/Dia_03_booleanos_operadores_data.md index bd399e662..978455116 100644 --- a/Portuguese/Dia_03_Booleanos_Operadores_Data/Dia_03_booleanos_operadores_data.md +++ b/Portuguese/Dia_03_Booleanos_Operadores_Data/Dia_03_booleanos_operadores_data.md @@ -61,12 +61,12 @@ A boolean data type represents one of the two values:_true_ or _false_. Boolean **Example: Boolean Values** ```js -let isLightOn = true -let isRaining = false -let isHungry = false -let isMarried = true -let truValue = 4 > 3 // true -let falseValue = 4 < 3 // false +let isLightOn = true; +let isRaining = false; +let isHungry = false; +let isMarried = true; +let truValue = 4 > 3; // true +let falseValue = 4 < 3; // false ``` We agreed that boolean values are either true or false. @@ -94,15 +94,15 @@ It is good to remember those truthy values and falsy values. In later section, w If we declare a variable and if we do not assign a value, the value will be undefined. In addition to this, if a function is not returning the value, it will be undefined. ```js -let firstName -console.log(firstName) //not defined, because it is not assigned to a value yet +let firstName; +console.log(firstName); //not defined, because it is not assigned to a value yet ``` ## Null ```js -let empty = null -console.log(empty) // -> null , means no value +let empty = null; +console.log(empty); // -> null , means no value ``` ## Operators @@ -112,13 +112,13 @@ console.log(empty) // -> null , means no value An equal sign in JavaScript is an assignment operator. It uses to assign a variable. ```js -let firstName = 'Asabeneh' -let country = 'Finland' +let firstName = 'Asabeneh'; +let country = 'Finland'; ``` Assignment Operators -![Assignment operators](../images/assignment_operators.png) +![Assignment operators](../../images/assignment_operators.png) ### Arithmetic Operators @@ -126,44 +126,41 @@ Arithmetic operators are mathematical operators. - Addition(+): a + b - Subtraction(-): a - b -- Multiplication(*): a * b +- Multiplication(_): a _ b - Division(/): a / b - Modulus(%): a % b - Exponential(**): a ** b ```js -let numOne = 4 -let numTwo = 3 -let sum = numOne + numTwo -let diff = numOne - numTwo -let mult = numOne * numTwo -let div = numOne / numTwo -let remainder = numOne % numTwo -let powerOf = numOne ** numTwo - -console.log(sum, diff, mult, div, remainder, powerOf) // 7,1,12,1.33,1, 64 +let numOne = 4; +let numTwo = 3; +let sum = numOne + numTwo; +let diff = numOne - numTwo; +let mult = numOne * numTwo; +let div = numOne / numTwo; +let remainder = numOne % numTwo; +let powerOf = numOne ** numTwo; +console.log(sum, diff, mult, div, remainder, powerOf); // 7,1,12,1.33,1, 64 ``` ```js -const PI = 3.14 -let radius = 100 // length in meter +const PI = 3.14; +let radius = 100; // length in meter //Let us calculate area of a circle -const areaOfCircle = PI * radius * radius -console.log(areaOfCircle) // 314 m - +const areaOfCircle = PI * radius * radius; +console.log(areaOfCircle); // 314 m -const gravity = 9.81 // in m/s2 -let mass = 72 // in Kilogram +const gravity = 9.81; // in m/s2 +let mass = 72; // in Kilogram // Let us calculate weight of an object -const weight = mass * gravity -console.log(weight) // 706.32 N(Newton) - -const boilingPoint = 100 // temperature in oC, boiling point of water -const bodyTemp = 37 // body temperature in oC +const weight = mass * gravity; +console.log(weight); // 706.32 N(Newton) +const boilingPoint = 100; // temperature in oC, boiling point of water +const bodyTemp = 37; // body temperature in oC // Concatenating string with numbers using string interpolation /* @@ -173,49 +170,49 @@ const bodyTemp = 37 // body temperature in oC */ console.log( `The boiling point of water is ${boilingPoint} oC.\nHuman body temperature is ${bodyTemp} oC.\nThe gravity of earth is ${gravity} m / s2.` -) +); ``` ### Comparison Operators In programming we compare values, we use comparison operators to compare two values. We check if a value is greater or less or equal to other value. -![Comparison Operators](../images/comparison_operators.png) +![Comparison Operators](../../images/comparison_operators.png) **Example: Comparison Operators** ```js -console.log(3 > 2) // true, because 3 is greater than 2 -console.log(3 >= 2) // true, because 3 is greater than 2 -console.log(3 < 2) // false, because 3 is greater than 2 -console.log(2 < 3) // true, because 2 is less than 3 -console.log(2 <= 3) // true, because 2 is less than 3 -console.log(3 == 2) // false, because 3 is not equal to 2 -console.log(3 != 2) // true, because 3 is not equal to 2 -console.log(3 == '3') // true, compare only value -console.log(3 === '3') // false, compare both value and data type -console.log(3 !== '3') // true, compare both value and data type -console.log(3 != 3) // false, compare only value -console.log(3 !== 3) // false, compare both value and data type -console.log(0 == false) // true, equivalent -console.log(0 === false) // false, not exactly the same -console.log(0 == '') // true, equivalent -console.log(0 == ' ') // true, equivalent -console.log(0 === '') // false, not exactly the same -console.log(1 == true) // true, equivalent -console.log(1 === true) // false, not exactly the same -console.log(undefined == null) // true -console.log(undefined === null) // false -console.log(NaN == NaN) // false, not equal -console.log(NaN === NaN) // false -console.log(typeof NaN) // number - -console.log('mango'.length == 'avocado'.length) // false -console.log('mango'.length != 'avocado'.length) // true -console.log('mango'.length < 'avocado'.length) // true -console.log('milk'.length == 'meat'.length) // true -console.log('milk'.length != 'meat'.length) // false -console.log('tomato'.length == 'potato'.length) // true -console.log('python'.length > 'dragon'.length) // false +console.log(3 > 2); // true, because 3 is greater than 2 +console.log(3 >= 2); // true, because 3 is greater than 2 +console.log(3 < 2); // false, because 3 is greater than 2 +console.log(2 < 3); // true, because 2 is less than 3 +console.log(2 <= 3); // true, because 2 is less than 3 +console.log(3 == 2); // false, because 3 is not equal to 2 +console.log(3 != 2); // true, because 3 is not equal to 2 +console.log(3 == '3'); // true, compare only value +console.log(3 === '3'); // false, compare both value and data type +console.log(3 !== '3'); // true, compare both value and data type +console.log(3 != 3); // false, compare only value +console.log(3 !== 3); // false, compare both value and data type +console.log(0 == false); // true, equivalent +console.log(0 === false); // false, not exactly the same +console.log(0 == ''); // true, equivalent +console.log(0 == ' '); // true, equivalent +console.log(0 === ''); // false, not exactly the same +console.log(1 == true); // true, equivalent +console.log(1 === true); // false, not exactly the same +console.log(undefined == null); // true +console.log(undefined === null); // false +console.log(NaN == NaN); // false, not equal +console.log(NaN === NaN); // false +console.log(typeof NaN); // number + +console.log('mango'.length == 'avocado'.length); // false +console.log('mango'.length != 'avocado'.length); // true +console.log('mango'.length < 'avocado'.length); // true +console.log('milk'.length == 'meat'.length); // true +console.log('milk'.length != 'meat'.length); // false +console.log('tomato'.length == 'potato'.length); // true +console.log('python'.length > 'dragon'.length); // false ``` Try to understand the above comparisons with some logic. Remembering without any logic might be difficult. @@ -234,23 +231,23 @@ The ! operator negates true to false and false to true. ```js // && ampersand operator example -const check = 4 > 3 && 10 > 5 // true && true -> true -const check = 4 > 3 && 10 < 5 // true && false -> false -const check = 4 < 3 && 10 < 5 // false && false -> false +const check = 4 > 3 && 10 > 5; // true && true -> true +const check = 4 > 3 && 10 < 5; // true && false -> false +const check = 4 < 3 && 10 < 5; // false && false -> false // || pipe or operator, example -const check = 4 > 3 || 10 > 5 // true || true -> true -const check = 4 > 3 || 10 < 5 // true || false -> true -const check = 4 < 3 || 10 < 5 // false || false -> false +const check = 4 > 3 || 10 > 5; // true || true -> true +const check = 4 > 3 || 10 < 5; // true || false -> true +const check = 4 < 3 || 10 < 5; // false || false -> false //! Negation examples -let check = 4 > 3 // true -let check = !(4 > 3) // false -let isLightOn = true -let isLightOff = !isLightOn // false -let isMarried = !false // true +let check = 4 > 3; // true +let check = !(4 > 3); // false +let isLightOn = true; +let isLightOff = !isLightOn; // false +let isMarried = !false; // true ``` ### Increment Operator @@ -260,17 +257,17 @@ In JavaScript we use the increment operator to increase a value stored in a vari 1. Pre-increment ```js -let count = 0 -console.log(++count) // 1 -console.log(count) // 1 +let count = 0; +console.log(++count); // 1 +console.log(count); // 1 ``` 1. Post-increment ```js -let count = 0 -console.log(count++) // 0 -console.log(count) // 1 +let count = 0; +console.log(count++); // 0 +console.log(count); // 1 ``` We use most of the time post-increment. At least you should remember how to use post-increment operator. @@ -282,17 +279,17 @@ In JavaScript we use the decrement operator to decrease a value stored in a vari 1. Pre-decrement ```js -let count = 0 -console.log(--count) // -1 -console.log(count) // -1 +let count = 0; +console.log(--count); // -1 +console.log(count); // -1 ``` 2. Post-decrement ```js -let count = 0 -console.log(count--) // 0 -console.log(count) // -1 +let count = 0; +console.log(count--); // 0 +console.log(count); // -1 ``` ### Ternary Operators @@ -301,15 +298,15 @@ Ternary operator allows to write a condition. Another way to write conditionals is using ternary operators. Look at the following examples: ```js -let isRaining = true +let isRaining = true; isRaining ? console.log('You need a rain coat.') - : console.log('No need for a rain coat.') -isRaining = false + : console.log('No need for a rain coat.'); +isRaining = false; isRaining ? console.log('You need a rain coat.') - : console.log('No need for a rain coat.') + : console.log('No need for a rain coat.'); ``` ```sh @@ -318,15 +315,15 @@ No need for a rain coat. ``` ```js -let number = 5 +let number = 5; number > 0 ? console.log(`${number} is a positive number`) - : console.log(`${number} is a negative number`) -number = -5 + : console.log(`${number} is a negative number`); +number = -5; number > 0 ? console.log(`${number} is a positive number`) - : console.log(`${number} is a negative number`) + : console.log(`${number} is a negative number`); ``` ```sh @@ -345,11 +342,11 @@ I would like to recommend you to read about operator precedence from this [link] As you have seen at very beginning alert() method displays an alert box with a specified message and an OK button. It is a builtin method and it takes on argument. ```js -alert(message) +alert(message); ``` ```js -alert('Welcome to 30DaysOfJavaScript') +alert('Welcome to 30DaysOfJavaScript'); ``` Do not use too much alert because it is destructing and annoying, use it just to test. @@ -359,12 +356,12 @@ Do not use too much alert because it is destructing and annoying, use it just to The window prompt methods display a prompt box with an input on your browser to take input values and the input data can be stored in a variable. The prompt() method takes two arguments. The second argument is optional. ```js -prompt('required text', 'optional text') +prompt('required text', 'optional text'); ``` ```js -let number = prompt('Enter number', 'number goes here') -console.log(number) +let number = prompt('Enter number', 'number goes here'); +console.log(number); ``` ### Window confirm() method @@ -374,8 +371,8 @@ A confirm box is often used to ask permission from a user to execute something. Clicking the OK yields true value, whereas clicking the Cancel button yields false value. ```js -const agree = confirm('Are you sure you like to delete? ') -console.log(agree) // result will be true or false based on what you click on the dialog box +const agree = confirm('Are you sure you like to delete? '); +console.log(agree); // result will be true or false based on what you click on the dialog box ``` These are not all the window methods we will have a separate section to go deep into window methods. @@ -385,15 +382,15 @@ These are not all the window methods we will have a separate section to go deep Time is an important thing. We like to know the time a certain activity or event. In JavaScript current time and date is created using JavaScript Date Object. The object we create using Date object provides many methods to work with date and time.The methods we use to get date and time information from a date object values are started with a word _get_ because it provide the information. _getFullYear(), getMonth(), getDate(), getDay(), getHours(), getMinutes, getSeconds(), getMilliseconds(), getTime(), getDay()_ -![Date time Object](../images/date_time_object.png) +![Date time Object](../../images/date_time_object.png) ### Creating a time object Once we create time object. The time object will provide information about time. Let us create a time object ```js -const now = new Date() -console.log(now) // Sat Jan 04 2020 00:56:41 GMT+0200 (Eastern European Standard Time) +const now = new Date(); +console.log(now); // Sat Jan 04 2020 00:56:41 GMT+0200 (Eastern European Standard Time) ``` We have created a time object and we can access any date time information from the object using the get methods we have mentioned on the table. @@ -403,8 +400,8 @@ We have created a time object and we can access any date time information from t Let's extract or get the full year from a time object. ```js -const now = new Date() -console.log(now.getFullYear()) // 2020 +const now = new Date(); +console.log(now.getFullYear()); // 2020 ``` ### Getting month @@ -412,8 +409,8 @@ console.log(now.getFullYear()) // 2020 Let's extract or get the month from a time object. ```js -const now = new Date() -console.log(now.getMonth()) // 0, because the month is January, month(0-11) +const now = new Date(); +console.log(now.getMonth()); // 0, because the month is January, month(0-11) ``` ### Getting date @@ -421,8 +418,8 @@ console.log(now.getMonth()) // 0, because the month is January, month(0-11) Let's extract or get the date of the month from a time object. ```js -const now = new Date() -console.log(now.getDate()) // 4, because the day of the month is 4th, day(1-31) +const now = new Date(); +console.log(now.getDate()); // 4, because the day of the month is 4th, day(1-31) ``` ### Getting day @@ -430,8 +427,8 @@ console.log(now.getDate()) // 4, because the day of the month is 4th, day(1-31) Let's extract or get the day of the week from a time object. ```js -const now = new Date() -console.log(now.getDay()) // 6, because the day is Saturday which is the 7th day +const now = new Date(); +console.log(now.getDay()); // 6, because the day is Saturday which is the 7th day // Sunday is 0, Monday is 1 and Saturday is 6 // Getting the weekday as a number (0-6) ``` @@ -441,8 +438,8 @@ console.log(now.getDay()) // 6, because the day is Saturday which is the 7th day Let's extract or get the hours from a time object. ```js -const now = new Date() -console.log(now.getHours()) // 0, because the time is 00:56:41 +const now = new Date(); +console.log(now.getHours()); // 0, because the time is 00:56:41 ``` ### Getting minutes @@ -450,8 +447,8 @@ console.log(now.getHours()) // 0, because the time is 00:56:41 Let's extract or get the minutes from a time object. ```js -const now = new Date() -console.log(now.getMinutes()) // 56, because the time is 00:56:41 +const now = new Date(); +console.log(now.getMinutes()); // 56, because the time is 00:56:41 ``` ### Getting seconds @@ -459,8 +456,8 @@ console.log(now.getMinutes()) // 56, because the time is 00:56:41 Let's extract or get the seconds from a time object. ```js -const now = new Date() -console.log(now.getSeconds()) // 41, because the time is 00:56:41 +const now = new Date(); +console.log(now.getSeconds()); // 41, because the time is 00:56:41 ``` ### Getting time @@ -470,35 +467,35 @@ This method give time in milliseconds starting from January 1, 1970. It is also 1. Using _getTime()_ ```js -const now = new Date() // -console.log(now.getTime()) // 1578092201341, this is the number of seconds passed from January 1, 1970 to January 4, 2020 00:56:41 +const now = new Date(); // +console.log(now.getTime()); // 1578092201341, this is the number of seconds passed from January 1, 1970 to January 4, 2020 00:56:41 ``` 1. Using _Date.now()_ ```js -const allSeconds = Date.now() // -console.log(allSeconds) // 1578092201341, this is the number of seconds passed from January 1, 1970 to January 4, 2020 00:56:41 +const allSeconds = Date.now(); // +console.log(allSeconds); // 1578092201341, this is the number of seconds passed from January 1, 1970 to January 4, 2020 00:56:41 -const timeInSeconds = new Date().getTime() -console.log(allSeconds == timeInSeconds) // true +const timeInSeconds = new Date().getTime(); +console.log(allSeconds == timeInSeconds); // true ``` Let us format these values to a human readable time format. **Example:** ```js -const now = new Date() -const year = now.getFullYear() // return year -const month = now.getMonth() + 1 // return month(0 - 11) -const date = now.getDate() // return date (1 - 31) -const hours = now.getHours() // return number (0 - 23) -const minutes = now.getMinutes() // return number (0 -59) +const now = new Date(); +const year = now.getFullYear(); // return year +const month = now.getMonth() + 1; // return month(0 - 11) +const date = now.getDate(); // return date (1 - 31) +const hours = now.getHours(); // return number (0 - 23) +const minutes = now.getMinutes(); // return number (0 -59) -console.log(`${date}/${month}/${year} ${hours}:${minutes}`) // 4/1/2020 0:56 +console.log(`${date}/${month}/${year} ${hours}:${minutes}`); // 4/1/2020 0:56 ``` -🌕 You have boundless energy. You have just completed day 3 challenges and you are three steps a head in to your way to greatness. Now do some exercises for your brain and for your muscle. +🌕 You have boundless energy. You have just completed day 3 challenges and you are three steps a head in to your way to greatness. Now do some exercises for your brain and for your muscle. ## 💻 Day 3: Exercises @@ -508,10 +505,12 @@ console.log(`${date}/${month}/${year} ${hours}:${minutes}`) // 4/1/2020 0:56 2. Check if type of '10' is equal to 10 3. Check if parseInt('9.8') is equal to 10 4. Boolean value is either true or false. + 1. Write three JavaScript statement which provide truthy value. 2. Write three JavaScript statement which provide falsy value. 5. Figure out the result of the following comparison expression first without using console.log(). After you decide the result confirm it using console.log() + 1. 4 > 3 2. 4 >= 3 3. 4 < 3 @@ -526,6 +525,7 @@ console.log(`${date}/${month}/${year} ${hours}:${minutes}`) // 4/1/2020 0:56 12. Find the length of python and jargon and make a falsy comparison statement. 6. Figure out the result of the following expressions first without using console.log(). After you decide the result confirm it by using console.log() + 1. 4 > 3 && 10 < 12 2. 4 > 3 && 10 > 12 3. 4 > 3 || 10 < 12 @@ -583,20 +583,20 @@ console.log(`${date}/${month}/${year} ${hours}:${minutes}`) // 4/1/2020 0:56 1. If the length of your name is greater than 7 say, your name is long else say your name is short. 1. Compare your first name length and your family name length and you should get this output. - ```js - let firstName = 'Asabeneh' - let lastName = 'Yetayeh' - ``` + ```js + let firstName = 'Asabeneh'; + let lastName = 'Yetayeh'; + ``` - ```sh + ```sh Your first name, Asabeneh is longer than your family name, Yetayeh ``` 1. Declare two variables _myAge_ and _yourAge_ and assign them initial values and myAge and yourAge. ```js - let myAge = 250 - let yourAge = 25 + let myAge = 250; + let yourAge = 25; ``` ```sh diff --git a/Portuguese/Dia_05_Arrays/Dia_05_arrays.md b/Portuguese/Dia_05_Arrays/Dia_05_arrays.md index 244d46e57..662eb8b45 100644 --- a/Portuguese/Dia_05_Arrays/Dia_05_arrays.md +++ b/Portuguese/Dia_05_Arrays/Dia_05_arrays.md @@ -16,7 +16,7 @@ [<< Dia 4](../Dia_04_Condicionais.md) | [Dia 6 >>](../Dia_06_Loops/Dia_06_Loops.md) -![Dia 5](../../images/banners/day_1_5.png) +![Dia 5](/images/banners/day_1_5.png) - [📔 Dia 5](#-dia-5) - [Arrays](#arrays) @@ -169,7 +169,7 @@ console.log(words); Acessamos cada elemento em um array usando seu índice. O índice de um array começa do 0. A imagem abaixo mostra claramente o índice de cada elemento no array. -![arr index](../../images/array_index.png) +![arr index](/images/array_index.png) ```js const frutas = ['banana', 'laranja', 'manga', 'limão']; From 4954e0057d7e8bb8dd8eaf3231aeadd189266dcd Mon Sep 17 00:00:00 2001 From: Zanderlan Date: Tue, 13 Feb 2024 18:01:04 -0300 Subject: [PATCH 4/8] fix images path and format --- .../Dia_02_Tipos_Dados/dia_02_tipos_dados.md | 4 +- Portuguese/Dia_05_Arrays/Dia_05_arrays.md | 4 +- Portuguese/readMe.md | 349 +++++++++--------- 3 files changed, 179 insertions(+), 178 deletions(-) diff --git a/Portuguese/Dia_02_Tipos_Dados/dia_02_tipos_dados.md b/Portuguese/Dia_02_Tipos_Dados/dia_02_tipos_dados.md index be626dd18..6ea6c418b 100644 --- a/Portuguese/Dia_02_Tipos_Dados/dia_02_tipos_dados.md +++ b/Portuguese/Dia_02_Tipos_Dados/dia_02_tipos_dados.md @@ -17,7 +17,7 @@ [<< Dia 1](../readMe.md) | [Dia 3 >>](../Dia_03_Booleanos_Operadores_Data/dia_03_booleanos_operadores_data.md) -![Thirty Days Of JavaScript](/images/banners/day_1_2.png) +![Thirty Days Of JavaScript](../../images/banners/day_1_2.png) - [📔 Dia 2](#-dia-2) - [Tipo de Dados](#tipos-de-dados) @@ -450,7 +450,7 @@ console.log(primeiroNome.length); // 8 2. _Acessando caracteres em uma string_: Nós podemos acessar cada caractere em uma string usando seu index. Em programação, a contagem começa em 0. O primeiro index de uma string é zero, e o último index é o length de uma string - 1. -![Accessing string by index](/images/string_indexes.png) +![Accessing string by index](../../images/string_indexes.png) Vamos acessar diferentes caracteres em 'JavaScript' string. diff --git a/Portuguese/Dia_05_Arrays/Dia_05_arrays.md b/Portuguese/Dia_05_Arrays/Dia_05_arrays.md index 662eb8b45..244d46e57 100644 --- a/Portuguese/Dia_05_Arrays/Dia_05_arrays.md +++ b/Portuguese/Dia_05_Arrays/Dia_05_arrays.md @@ -16,7 +16,7 @@ [<< Dia 4](../Dia_04_Condicionais.md) | [Dia 6 >>](../Dia_06_Loops/Dia_06_Loops.md) -![Dia 5](/images/banners/day_1_5.png) +![Dia 5](../../images/banners/day_1_5.png) - [📔 Dia 5](#-dia-5) - [Arrays](#arrays) @@ -169,7 +169,7 @@ console.log(words); Acessamos cada elemento em um array usando seu índice. O índice de um array começa do 0. A imagem abaixo mostra claramente o índice de cada elemento no array. -![arr index](/images/array_index.png) +![arr index](../../images/array_index.png) ```js const frutas = ['banana', 'laranja', 'manga', 'limão']; diff --git a/Portuguese/readMe.md b/Portuguese/readMe.md index f65cc97ce..8c05d55e9 100644 --- a/Portuguese/readMe.md +++ b/Portuguese/readMe.md @@ -1,43 +1,43 @@ # 30 Dias de JavaScript -| # Dia | Tópicos | -| ----- | :-------------------------------------------------------------------------------------------------------------------------------------------------: | -| 01 | [Introdução](./readMe.md) | -| 02 | [Tipos de Dados](./02_Day_Data_types/02_day_data_types.md) | -| 03 | [Booleanos, Operadores, Data](./03_Day_Booleans_operators_date/03_booleans_operators_date.md) | -| 04 | [Condicionais](./04_Day_Conditionals/04_day_conditionals.md) | -| 05 | [Arrays](./05_Day_Arrays/05_day_arrays.md) | -| 06 | [Loops](./06_Day_Loops/06_day_loops.md) | -| 07 | [Funções](./07_Day_Functions/07_day_functions.md) | -| 08 | [Objetos](./08_Day_Objects/08_day_objects.md) | -| 09 | [Higher Order Functions](./09_Day_Higher_order_functions/09_day_higher_order_functions.md) | -| 10 | [Sets and Maps](./10_Day_Sets_and_Maps/10_day_Sets_and_Maps.md) | -| 11 | [Destructuring and Spreading](./11_Day_Destructuring_and_spreading/11_day_destructuring_and_spreading.md) | -| 12 | [Expressões Regulares](./12_Day_Regular_expressions/12_day_regular_expressions.md) | -| 13 | [Método Console Objeto](./13_Day_Console_object_methods/13_day_console_object_methods.md) | +| # Dia | Tópicos | +| ----- | :------------------------------------------------------------------------------------------------------------------------------------------------------: | +| 01 | [Introdução](./readMe.md) | +| 02 | [Tipos de Dados](./02_Day_Data_types/02_day_data_types.md) | +| 03 | [Booleanos, Operadores, Data](./03_Day_Booleans_operators_date/03_booleans_operators_date.md) | +| 04 | [Condicionais](./04_Day_Conditionals/04_day_conditionals.md) | +| 05 | [Arrays](./05_Day_Arrays/05_day_arrays.md) | +| 06 | [Loops](./06_Day_Loops/06_day_loops.md) | +| 07 | [Funções](./07_Day_Functions/07_day_functions.md) | +| 08 | [Objetos](./08_Day_Objects/08_day_objects.md) | +| 09 | [Higher Order Functions](./09_Day_Higher_order_functions/09_day_higher_order_functions.md) | +| 10 | [Sets and Maps](./10_Day_Sets_and_Maps/10_day_Sets_and_Maps.md) | +| 11 | [Destructuring and Spreading](./11_Day_Destructuring_and_spreading/11_day_destructuring_and_spreading.md) | +| 12 | [Expressões Regulares](./12_Day_Regular_expressions/12_day_regular_expressions.md) | +| 13 | [Método Console Objeto](./13_Day_Console_object_methods/13_day_console_object_methods.md) | | 14 | [Tratamento de Errors](./14_Day_Error_handling/14_day_error_handling.md) | -| 15 | [Classes](./15_Day_Classes/15_day_classes.md) | -| 16 | [JSON](./16_Day_JSON/16_day_json.md) | -| 17 | [Armazenamento na Web](./17_Day_Web_storages/17_day_web_storages.md) | -| 18 | [Promises](./18_Day_Promises/18_day_promises.md) | -| 19 | [Closure](./19_Day_Closures/19_day_closures.md) | +| 15 | [Classes](./15_Day_Classes/15_day_classes.md) | +| 16 | [JSON](./16_Day_JSON/16_day_json.md) | +| 17 | [Armazenamento na Web](./17_Day_Web_storages/17_day_web_storages.md) | +| 18 | [Promises](./18_Day_Promises/18_day_promises.md) | +| 19 | [Closure](./19_Day_Closures/19_day_closures.md) | | 20 | [Escrevendo Código Limpo](./20_Day_Writing_clean_codes/20_day_writing_clean_codes.md) | -| 21 | [DOM](./21_Day_DOM/21_day_dom.md) | -| 22 | [Manipulando DOM Objetos](./22_Day_Manipulating_DOM_object/22_day_manipulating_DOM_object.md) | -| 23 | [Event Listeners](./23_Day_Event_listeners/23_day_event_listeners.md) | -| 24 | [Mini Projeto: Sistema Solar](./24_Day_Project_solar_system/24_day_project_solar_system.md) | -| 25 | [Mini Projeto: Visualização de Dados de Paises do mundo](./25_Day_World_countries_data_visualization_1/25_day_world_countries_data_visualization_1.md) | +| 21 | [DOM](./21_Day_DOM/21_day_dom.md) | +| 22 | [Manipulando DOM Objetos](./22_Day_Manipulating_DOM_object/22_day_manipulating_DOM_object.md) | +| 23 | [Event Listeners](./23_Day_Event_listeners/23_day_event_listeners.md) | +| 24 | [Mini Projeto: Sistema Solar](./24_Day_Project_solar_system/24_day_project_solar_system.md) | +| 25 | [Mini Projeto: Visualização de Dados de Paises do mundo](./25_Day_World_countries_data_visualization_1/25_day_world_countries_data_visualization_1.md) | | 26 | [Mini Projeto: Visualização de Dados de Paises do mundo 2](./26_Day_World_countries_data_visualization_2/26_day_world_countries_data_visualization_2.md) | -| 27 | [Mini Projeto: Portfólio](./27_Day_Mini_project_portfolio/27_day_mini_project_portfolio.md) | -| 28 | [Mini Projeto: Leaderboard](./28_Day_Mini_project_leaderboard/28_day_mini_project_leaderboard.md) | -| 29 | [Mini Projeto: Caracteres Animados](./29_Day_Mini_project_animating_characters/29_day_mini_project_animating_characters.md) | -| 30 | [Projetos Finais](./30_Day_Mini_project_final/30_day_mini_project_final.md) | +| 27 | [Mini Projeto: Portfólio](./27_Day_Mini_project_portfolio/27_day_mini_project_portfolio.md) | +| 28 | [Mini Projeto: Leaderboard](./28_Day_Mini_project_leaderboard/28_day_mini_project_leaderboard.md) | +| 29 | [Mini Projeto: Caracteres Animados](./29_Day_Mini_project_animating_characters/29_day_mini_project_animating_characters.md) | +| 30 | [Projetos Finais](./30_Day_Mini_project_final/30_day_mini_project_final.md) | 🧡🧡🧡 HAPPY CODING 🧡🧡🧡
Dê suporte ao Autor para criar mais materiais educacionais
-Paypal Logo +Paypal Logo
@@ -74,40 +74,40 @@ [Dia 2 >>](./02_Day_Data_types/02_day_data_types.md) -![Trinta Dias de JavaScript](/images/day_1_1.png) +![Trinta Dias de JavaScript](../images/day_1_1.png) - [30 dias de JavaScript](#30-dias-de-javascript) - [📔 Dia 1](#-dia-1) - - [Introdução](#introdução) - - [Requisitos](#requisitos) - - [Setup](#setup) - - [Instalação Node.js](#instalação-nodejs) - - [Navegador](#navegador) - - [Instalando Google Chrome](#instalando-google-chrome) - - [Abrindo o Google Chrome Console](#abrindo-o-google-chrome-console) - - [Escrevendo Código no console do Navegador](#escrevendo-código-no-console-do-navegador) - - [Console.log](#consolelog) - - [Console.log com Múltiplos Argumentos](#console.log-com-múltiplos-argumentos) - - [Comentários](#comentários) - - [Sintaxe](#sintaxe) - - [Aritimética](#aritimética) - - [Editor de Código](#editor-de-código) - - [Instalando o Visual Studio Code](#instalando-o-visual-studio-code) - - [Como usar o Visual Studio Code](#como-usar-o-visual-studio-code) - - [Adicionando JavaScript Para uma Página na Web ](#adicionando-javaScript-para-uma-página-na-web ) - - [Script em Linha](#inline-script) - - [Script Interno](#script-interno) - - [Script Externo](#script-externo) - - [Múltiplos Scripts Externos](#múltiplos-scripts-externos) - - [Introdução a tipo de Dados](#introdução-a-tipo-de-dados) - - [Números](#números) - - [Strings](#strings) - - [Booleanos](#booleans) - - [Undefined](#undefined) - - [Null](#null) - - [Verificando Tipos de Dados](#verificando-tipos-de-dados) - - [Comentários novamente](#comentários-novamente) - - [Variáveis](#variáveis) + - [Introdução](#introdução) + - [Requisitos](#requisitos) + - [Setup](#setup) + - [Instalação Node.js](#instalação-nodejs) + - [Navegador](#navegador) + - [Instalando Google Chrome](#instalando-google-chrome) + - [Abrindo o Google Chrome Console](#abrindo-o-google-chrome-console) + - [Escrevendo Código no console do Navegador](#escrevendo-código-no-console-do-navegador) + - [Console.log](#consolelog) + - [Console.log com Múltiplos Argumentos](#console.log-com-múltiplos-argumentos) + - [Comentários](#comentários) + - [Sintaxe](#sintaxe) + - [Aritimética](#aritimética) + - [Editor de Código](#editor-de-código) + - [Instalando o Visual Studio Code](#instalando-o-visual-studio-code) + - [Como usar o Visual Studio Code](#como-usar-o-visual-studio-code) + - [Adicionando JavaScript Para uma Página na Web ](#adicionando-javaScript-para-uma-página-na-web) + - [Script em Linha](#inline-script) + - [Script Interno](#script-interno) + - [Script Externo](#script-externo) + - [Múltiplos Scripts Externos](#múltiplos-scripts-externos) + - [Introdução a tipo de Dados](#introdução-a-tipo-de-dados) + - [Números](#números) + - [Strings](#strings) + - [Booleanos](#booleans) + - [Undefined](#undefined) + - [Null](#null) + - [Verificando Tipos de Dados](#verificando-tipos-de-dados) + - [Comentários novamente](#comentários-novamente) + - [Variáveis](#variáveis) - [💻 Dia 1: Exercícios](#-dia-1-exercícios) # 📔 Dia 1 @@ -125,6 +125,7 @@ JavaScript é usado **_para adicionar interatividade aos websites, desenvolvimen ## Requisitos Sem conhecimentos prévios de programação é exigido para seguir este desafio. Precisará apenas: + 1. Motivação 2. Um computador 3. Internet @@ -139,11 +140,11 @@ Eu acredito que voce tem a motivação e o forte desejo de ser um desenvolvedor, Você pode não precisar do Node.js agora mas você precisará mais tarde. Instalação do [node.js](https://nodejs.org/en/). -![Node download](/images/download_node.png) +![Node download](../images/download_node.png) Depois do download click duplo no ícone e intalar -![Instalação node](/images/install_node.png) +![Instalação node](../images/install_node.png) Nós podemos verificar se o Node está instalador na nossa máquina local abrindo nosso terminal do dispositivo ou prompt de comando. @@ -162,13 +163,13 @@ Existe muitos navegadores por ai, Entento, Eu fortemente recomento o Google Chro Instalar o [Google Chrome](https://www.google.com.br/chrome/) se você não tem um ainda. Nós podemos escrever um pequeno código de JavaScript no console do browser, mas nós não usamos o console do navegador para desenvolver aplicações. -![Google Chrome](/images/google_chrome.png) +![Google Chrome](../images/google_chrome.png) #### Abrindo o Google Chrome Console -Você pode abrir o Google Chrome console por um ou outro clicando nos 3 pontos no topo do lado direito do navegador, selecionando _Mais ferramentas -> Ferramenta para desenvolvedores ou usando o atalho do teclado. Eu prefiro os atalhos. +Você pode abrir o Google Chrome console por um ou outro clicando nos 3 pontos no topo do lado direito do navegador, selecionando \_Mais ferramentas -> Ferramenta para desenvolvedores ou usando o atalho do teclado. Eu prefiro os atalhos. -![Abrindo o chrome](/images/opening_developer_tool.png) +![Abrindo o chrome](../images/opening_developer_tool.png) Para abrir o console do Chrome usando o atalho do teclado. @@ -180,16 +181,16 @@ Windows/Linux: Ctl+Shift+J ``` -![Abrindo o console](/images/opening_chrome_console_shortcut.png) +![Abrindo o console](../images/opening_chrome_console_shortcut.png) Depois de você abrir o console do Google Chrome, tente explorar os botões marcados. Nós vamos passar a maior parte do tempo no Console. O Console é o lugar onde vai seu código de JavaScript. O Console do Google Chrome V8 engine muda seu codigo de JavaScript para código de máquina. -Vamos escrever códigos de JavaScript no Google Chome console: +Vamos escrever códigos de JavaScript no Google Chome console: -![Escrevendo codigo no console](/images/js_code_on_chrome_console.png) +![Escrevendo codigo no console](../images/js_code_on_chrome_console.png) #### Escrevendo Código no console do Navegador -Nós podemos escrever qualquer código de JavaScript no console do Google Chrome ou qualquer outro console de navegador, para este desafio, nós vamos focar no Console do Google Chrome. Abra o Console usando: +Nós podemos escrever qualquer código de JavaScript no console do Google Chrome ou qualquer outro console de navegador, para este desafio, nós vamos focar no Console do Google Chrome. Abra o Console usando: ```sh Mac @@ -201,25 +202,25 @@ Ctl+Shift+I ##### Console.log -Para escrever nosso primeiro código em JavaScript, vamos usar uma função built-it **console.log()**. Nós passamos um argumento como dados de input, e a função mostra o output. Nós passamos `'Olá, Mundo!'` como dados de input ou argumento na função console.log(). +Para escrever nosso primeiro código em JavaScript, vamos usar uma função built-it **console.log()**. Nós passamos um argumento como dados de input, e a função mostra o output. Nós passamos `'Olá, Mundo!'` como dados de input ou argumento na função console.log(). ```js -console.log('Olá, Mundo!') +console.log('Olá, Mundo!'); ``` ##### Console.log com Múltiplos Argumentos -A funçao **`console.log()`** pode receber múltiplos parâmetros separados por vírgulas. A sintaxe é similar ao seguinte modo:**`console.log(param1, param2, param3)`** +A funçao **`console.log()`** pode receber múltiplos parâmetros separados por vírgulas. A sintaxe é similar ao seguinte modo:**`console.log(param1, param2, param3)`** -![console.log com Múltiplos Argumentos](/images/console_log_multipl_arguments.png) +![console.log com Múltiplos Argumentos](../images/console_log_multipl_arguments.png) ```js -console.log('Olá', 'Mundo', '!') -console.log('Feliz', 'Ano', 'Novo', 2020) -console.log('Bem vindo', 'aos', 30, 'Dias', 'de', 'JavaScript') +console.log('Olá', 'Mundo', '!'); +console.log('Feliz', 'Ano', 'Novo', 2020); +console.log('Bem vindo', 'aos', 30, 'Dias', 'de', 'JavaScript'); ``` -Como você pode ver pelo trecho de código acima, _`console.log()`_ pode receber múltiplos argumentos. +Como você pode ver pelo trecho de código acima, _`console.log()`_ pode receber múltiplos argumentos. Parabéns! Você escreveu seu primeiro código de JavaScript usando _`console.log()`_. @@ -230,7 +231,7 @@ Nós podemos adicionar comentários para nosso código. Comentários são import **Exemplo: Comentário de linha única** ```js -// Este é o primeiro comentário +// Este é o primeiro comentário // Este é o segundo comentário // Eu sou um comentário de linha única ``` @@ -244,17 +245,18 @@ Nós podemos adicionar comentários para nosso código. Comentários são import JavaScript é a Linguagem da Web */ ``` + ##### Sintaxe Linguagens de programação são similares com a linguagem humana. Portugês ou qualquer outra linguagem usa palavras, frases, orações, períodos, e outras mais para criar uma mensagem com significado. A definição em Português de sintaxe é _ Estrutura essencial para que frases, orações e períodos façam sentido e sejam de fácil compreensão por parte do leitor_. A definição técnica é a estrutura de declarações em uma linguagem de computador. Linguagens de programação tem sintaxes. JavaScript é uma linguagem de programação como outras linguagens de programação tem sua própria sintaxe. Se nós nao escrevermos uma sintaxe que JavaScript entenda, diferentes tipos de errors aparecerá. Nós iremos explorar diferentes tipos de errors no JavaScript depois. Por enquanto, vamos ver sintaxes de errors. -![Error](/images/raising_syntax_error.png) +![Error](../images/raising_syntax_error.png) -Eu fiz uma confusão proposital. Como resultado, criou vários errors. Na realidade, a sintaxe é muito informativa. Informa quais tipos de errors foi feito. lendo as mensagens do feedback de error, nós podemos corrigir a sintaxe e resolver o problema. O processo de identificar e remover errors de um programa é chamado de Debugging. Vamos resolver os errors: +Eu fiz uma confusão proposital. Como resultado, criou vários errors. Na realidade, a sintaxe é muito informativa. Informa quais tipos de errors foi feito. lendo as mensagens do feedback de error, nós podemos corrigir a sintaxe e resolver o problema. O processo de identificar e remover errors de um programa é chamado de Debugging. Vamos resolver os errors: ```js -console.log('Olá, Mundo!') -console.log('Olá, Mundo!') +console.log('Olá, Mundo!'); +console.log('Olá, Mundo!'); ``` Até agora, nós vimos como exibir texto usando o _`console.log()`_. Se estamos imprimindo texto ou string usando _`console.log()`_, o texto tem que estar dentro de uma aspa simples, aspas duplas, ou crase. @@ -262,9 +264,9 @@ Até agora, nós vimos como exibir texto usando o _`console.log()`_. Se estamos **Exemplo:** ```js -console.log('Olá, Mundo!') -console.log("Olá, Mundo!") -console.log(`Hello, World!`) +console.log('Olá, Mundo!'); +console.log('Olá, Mundo!'); +console.log(`Hello, World!`); ``` #### Aritimética @@ -273,15 +275,15 @@ Agora, vamos praticar escrevendo mais códigos JavaScript usando _`console.log() Em adição ao texto, nós podemos tamem fazer calculos matemáticos usando javaSCript. Vamos fazer calculos simples a seguir. É possivel escrever códigos JavaScript no console do Google Chome diretamente sem o função **_`console.log()`_** Entretanto, está incluso nesta introdução porque maior parte deste desafio pode ocorrer no editor de texto onde o uso de funcões pode ser mantario. Você pode brincar diretamente com ins -![Arithmetic](/images/arithmetic.png) +![Arithmetic](../images/arithmetic.png) ```js -console.log(2 + 3) // Adição -console.log(3 - 2) // Subtração -console.log(2 * 3) // Muiltiplição -console.log(3 / 2) // Divisão -console.log(3 % 2) // Modulo - Resto da divisão -console.log(3 ** 2) // Exponenciação 3 ** 2 == 3 * 3 +console.log(2 + 3); // Adição +console.log(3 - 2); // Subtração +console.log(2 * 3); // Muiltiplição +console.log(3 / 2); // Divisão +console.log(3 % 2); // Modulo - Resto da divisão +console.log(3 ** 2); // Exponenciação 3 ** 2 == 3 * 3 ``` ### Editor de Código @@ -292,7 +294,7 @@ Nós podemos escrever nosso código no console do navegador. mas isso nao é usa Visual Studio Code é editor de texto open-source muito popular. Eu poderia recomendar o [download Visual Studio Code](https://code.visualstudio.com/), mas se você está familiarizado com outro editor, sinta livre para seguir oque você tem. -![Vscode](/images/vscode.png) +![Vscode](../images/vscode.png) Se você instalou o Visual Studio Code, Vamos começar usando-o. @@ -300,21 +302,21 @@ Se você instalou o Visual Studio Code, Vamos começar usando-o. Abra o Visual Studio Code clicando duas vezes com o mouse no ícone. Quando abrir, você terá esta interface. Tente interagir com os ícones rotulados. -![Vscode ui](/images/vscode_ui.png) +![Vscode ui](../images/vscode_ui.png) -![Vscode add project](/images/adding_project_to_vscode.png) +![Vscode add project](../images/adding_project_to_vscode.png) -![Vscode open project](/images/opening_project_on_vscode.png) +![Vscode open project](../images/opening_project_on_vscode.png) -![script file](/images/scripts_on_vscode.png) +![script file](../images/scripts_on_vscode.png) -![Installing Live Server](/images/vsc_live_server.png) +![Installing Live Server](../images/vsc_live_server.png) -![running script](/images/running_script.png) +![running script](../images/running_script.png) -![coding running](/images/launched_on_new_tab.png) +![coding running](../images/launched_on_new_tab.png) -## Adicionando JavaScript Para uma Página na Web +## Adicionando JavaScript Para uma Página na Web JavaScript pode ser adicionado para uma página na internet em três diferentes maneiras: @@ -330,7 +332,6 @@ As diferentes sessões mostra diferentes maneiras de adicionar códigos JavaScri Crie uma pasta do projeto no seu desktop ou em qualquer localização, nomeie de 30DaysOfJS e crie um **_`index.html`_** documento na sua pasta do projeto. Então copie os seguintes códigos e abra-o no navegador, por exemplo [Chrome](https://www.google.com/chrome/). - ```html @@ -342,6 +343,7 @@ Então copie os seguintes códigos e abra-o no navegador, por exemplo [Chrome](h ``` + Agora, você escreveu seu primeiro script em linha. Nós podemos criar uma mensagem pop up usando o _`alert()`_ função built-it ### Script Interno @@ -354,7 +356,7 @@ O script interno pode ser escrito no _`head`_ ou _`body`_, mas é preferível co 30DaysOfScript: Script Interno @@ -372,7 +374,7 @@ Isto é como nós escrevemos scripts internos na maioria das vezes. Escrevemos o @@ -380,7 +382,7 @@ Isto é como nós escrevemos scripts internos na maioria das vezes. Escrevemos o Abra o console do navegador e veja o output do `console.log()`. -![js code from vscode](/images/js_code_vscode.png) +![js code from vscode](../images/js_code_vscode.png) ### Script Externo @@ -388,7 +390,7 @@ Similar com o script interno, o link do script externo pode estar no header ou b Primeiro, nós podemos criar scripts externos de JavaScript com a .js extensão. Todos os arquivos terminados com a .js extensão são JavaScript documentos. Crie uma pasta nomeada Introdução.js dentro do diretório do projeto e escreva o seguinte código e copie o link do arquivo .js no bottom do body. ```js -console.log('Welcome to 30DaysOfJavaScript') +console.log('Welcome to 30DaysOfJavaScript'); ``` Scripts Externo no _head_: @@ -413,10 +415,8 @@ Scripts Externo no _body_: 30DaysOfJavaScript: Scripts Externo - - - - + + @@ -430,7 +430,7 @@ Nós tambem podemos colocar o link de vários arquivos externos de JavaScript em Crie um `helloworld.js` documento dentro da pasta 30DaysOfJS e escreva o seguinte código. ```js -console.log('Olá, Mundo!') +console.log('Olá, Mundo!'); ``` ```html @@ -448,7 +448,7 @@ console.log('Olá, Mundo!') _Seu arquivo main.js deve estar abaixo de todos os outros scripts_. E isto é muito importante de relembrar -![Multiple Script](/images/multiple_script.png) +![Multiple Script](../images/multiple_script.png) ## Introdução a tipo de Dados @@ -457,7 +457,7 @@ Em JavaScript e tambem em outras linguagens de programação, existem vários ti ### Números - Integers: Inteiros (Negativo, zero e positivos) números -Examplo: + Examplo: ... -3, -2, -1, 0, 1, 2, 3 ... - Float-point numbers: Números decimais. ... -3.5, -2.25, -1.0, 0.0, 1.1, 2.2, 3.5 ... @@ -469,16 +469,15 @@ Uma coleção de um ou mais caracteres entre duas aspas simples, aspas duplas, o **Examplo:** ```js -'a' -'Asabeneh' -"Asabeneh" -'Finland' -'JavaScript is a beautiful programming language' -'I love teaching' -'I hope you are enjoying the first day' -`We can also create a string using a backtick` -'A string could be just as small as one character or as big as many pages' -'Any data type under a single quote, double quote or backtick is a string' +'a'; +'Asabeneh'; +'Asabeneh'; +'Finland'; +'JavaScript is a beautiful programming language'; +'I love teaching'; +'I hope you are enjoying the first day'`We can also create a string using a backtick`; +('A string could be just as small as one character or as big as many pages'); +('Any data type under a single quote, double quote or backtick is a string'); ``` ### Booleans @@ -490,8 +489,8 @@ Um tipo de dado boleanno é verdadeiro ou um valor falso **Examplo:** ```js -true // if the light is on, the value is true -false // if the light is off, the value is false +true; // if the light is on, the value is true +false; // if the light is off, the value is false ``` ### Undefined @@ -499,8 +498,8 @@ false // if the light is off, the value is false Em JavaScript, se nós não atribuirmos um valor a uma variável, o valor é undefined. Em adição a isto, se uma funcção não está retornando nada, ela retorna undefined ```js -let firstName -console.log(firstName) // undefined, because it is not assigned to a value yet +let firstName; +console.log(firstName); // undefined, because it is not assigned to a value yet ``` ### Null @@ -508,19 +507,19 @@ console.log(firstName) // undefined, because it is not assigned to a value yet Null em JavaScript significa um valor vazio. ```js -let valorVazio = null +let valorVazio = null; ``` ## Verificando Tipos de Dados -Para verificar o tipo de dado de uma determinada variável, nós usamos o operador **typeof**. Veja o seguinte exemplo. +Para verificar o tipo de dado de uma determinada variável, nós usamos o operador **typeof**. Veja o seguinte exemplo. ```js -console.log(typeof 'Asabeneh') // string -console.log(typeof 5) // number -console.log(typeof true) // boolean -console.log(typeof null) // object type -console.log(typeof undefined) // undefined +console.log(typeof 'Asabeneh'); // string +console.log(typeof 5); // number +console.log(typeof true); // boolean +console.log(typeof null); // object type +console.log(typeof undefined); // undefined ``` ## Comentários novamente @@ -550,7 +549,7 @@ Comentando em várias linhas: ## Variáveis -Variáveis são _containers_ de dados. Variáveis são usadas para _armazenar_ dados na memória alocada. Quando variáveis são declaradas, uma memória alocada é reservada. Quando uma variável é atribuída para um valor (dados), espaço na memória irá ser preenchido com aqueles dados. Para declarar uma variável, nós usamos as palavras-chaves _var_, _let_, ou _const_. +Variáveis são _containers_ de dados. Variáveis são usadas para _armazenar_ dados na memória alocada. Quando variáveis são declaradas, uma memória alocada é reservada. Quando uma variável é atribuída para um valor (dados), espaço na memória irá ser preenchido com aqueles dados. Para declarar uma variável, nós usamos as palavras-chaves _var_, _let_, ou _const_. Para uma variável que muda com o tempo, nós usamos _let_. Se os dados não vão mudar, nós usamos _const_. Por exemplo, PI, nome de país, gravidade não muda, e nós podemos usar _const_. Nós não vamos usar var neste desafio e eu nao recomendo usa-lo. Nós vamos falar mais sobre var, let, e const em detalhes em outras sessões (scope). Por enquanto, a explicação acima é suficiente. @@ -564,25 +563,25 @@ Um nome de variável em JavaScript apenas segue a seguinte regra: Os seguintes exemplos são de variáveis válidas em JavaScript. ```js -firstName -lastName -country -city -capitalCity -age -isMarried - -first_name -last_name -is_married -capital_city - -num1 -num_1 -_num_1 -$num1 -year2020 -year_2020 +firstName; +lastName; +country; +city; +capitalCity; +age; +isMarried; + +first_name; +last_name; +is_married; +capital_city; + +num1; +num_1; +_num_1; +$num1; +year2020; +year_2020; ``` A primeira e a segunda variável na lista segue a convenção camelCase de declaração no JavaScript. Neste material, nós vamos usar variáveis em camelCase (camelWithOneHump). Nós usamos CamelCase (CamelWithTwoHump) para declarar classes, nós vamos discutir sobre classes e objetos em outras sessões. @@ -599,7 +598,7 @@ Vamos declarar variáveis com diferentes tipos de dados. Para declarar uma vari ```js // Sintaxe -let nameOfVariable = value +let nameOfVariable = value; ``` O nomeDaVariavel é o nome que armazena diferente tipos de dados. Veja abaixo exemplos para mais detalhes. @@ -608,14 +607,14 @@ O nomeDaVariavel é o nome que armazena diferente tipos de dados. Veja abaixo ex ```js // Declarando diferentes variáveis de diferentes tipos de dados -let firstName = 'Asabeneh' // primeiro nome de uma pessoa -let lastName = 'Yetayeh' // ultimo nome de uma pessoa -let country = 'Finland' // país -let city = 'Helsinki' // capital da cidade -let age = 100 // Idade -let isMarried = true +let firstName = 'Asabeneh'; // primeiro nome de uma pessoa +let lastName = 'Yetayeh'; // ultimo nome de uma pessoa +let country = 'Finland'; // país +let city = 'Helsinki'; // capital da cidade +let age = 100; // Idade +let isMarried = true; -console.log(firstName, lastName, country, city, age, isMarried) +console.log(firstName, lastName, country, city, age, isMarried); ``` ```sh @@ -624,11 +623,11 @@ Asabeneh Yetayeh Finland Helsinki 100 true ```js // Declarando variáveis com o valor numérico -let age = 100 // idade -const gravity = 9.81 // gravidade na terra em m/s2 -const boilingPoint = 100 // ponto de ebulição da água, temperatura em °C -const PI = 3.14 // constante geométrica -console.log(gravity, boilingPoint, PI) +let age = 100; // idade +const gravity = 9.81; // gravidade na terra em m/s2 +const boilingPoint = 100; // ponto de ebulição da água, temperatura em °C +const PI = 3.14; // constante geométrica +console.log(gravity, boilingPoint, PI); ``` ```sh @@ -637,8 +636,10 @@ console.log(gravity, boilingPoint, PI) ```js // Variáveis tambem podem ser declaradas em uma linha separadas por uma vírgula, entretanto eu recomento usar a separação por linha para facilitar a leitura do código -let name = 'Asabeneh', job = 'teacher', live = 'Finland' -console.log(name, job, live) +let name = 'Asabeneh', + job = 'teacher', + live = 'Finland'; +console.log(name, job, live); ``` ```sh @@ -647,7 +648,7 @@ Asabeneh teacher Finland Quando você executa o arquivo _index.html_ na pasta dia-1 você deve conseguir isto: -![Day one](/images/day_1.png) +![Day one](../images/day_1.png) 🌕 Você é incrivel! Você acabou de completar o desafio do dia 1 e você está no seu caminho para o sucesso. Agora faça alguns exercícios para seu cérebro e músculos. @@ -656,11 +657,11 @@ Quando você executa o arquivo _index.html_ na pasta dia-1 você deve conseguir 1. Escreva um comentário de linha única que diga, _comentários faz seu código ser fácil de ler_ 2. Escreva outro comentário de linha única que diga, _Welcome to 30DaysOfJavaScript_ 3. Escreva um comentário de várias linhas que diga, _comentários faz seu código ser fácil de ler, fácil de reusar_ _e informátivo_ -4. Crie um arquivo variavel.js e declare variáveis e atribua uma string, boolean, undefined e null +4. Crie um arquivo variavel.js e declare variáveis e atribua uma string, boolean, undefined e null 5. Crie um arquivo tiposdedados.js e use o JavaScript **_typeof_** operador para verificar diferentes tipos de dados. Verifique o tipo de dado de cada variável 6. Declare quatro variáveis sem atribuir valores -7. Declare quatro variáveis e atribuir valores -8. Declare variáveis para armazenar seu primeiro nome, ultimo nome, estado civil, país e idade em multiplas linhas +7. Declare quatro variáveis e atribuir valores +8. Declare variáveis para armazenar seu primeiro nome, ultimo nome, estado civil, país e idade em multiplas linhas 9. Declare variáveis para armazenar seu primeiro nome, ultimo nome, estado civil, país e idade em uma única linha 10. Declare duas variáveis _minhaIdade_ e _suaIdade_ e atribua valores iniciais e mostre no console do navegador. From f35734c5984a99db93e612f77a52dd5f9d7c3e25 Mon Sep 17 00:00:00 2001 From: Zanderlan Date: Wed, 14 Feb 2024 12:01:15 -0300 Subject: [PATCH 5/8] pt-br - day 06 --- .../06_day_starter/data/countries.js | 195 +++++++ .../Dia_06_Loops/06_day_starter/index.html | 17 + .../06_day_starter/scripts/main.js | 2 + Portuguese/Dia_06_Loops/dia_06_Loops.md | 491 ++++++++++++++++++ 4 files changed, 705 insertions(+) create mode 100644 Portuguese/Dia_06_Loops/06_day_starter/data/countries.js create mode 100644 Portuguese/Dia_06_Loops/06_day_starter/index.html create mode 100644 Portuguese/Dia_06_Loops/06_day_starter/scripts/main.js create mode 100644 Portuguese/Dia_06_Loops/dia_06_Loops.md diff --git a/Portuguese/Dia_06_Loops/06_day_starter/data/countries.js b/Portuguese/Dia_06_Loops/06_day_starter/data/countries.js new file mode 100644 index 000000000..e57b00501 --- /dev/null +++ b/Portuguese/Dia_06_Loops/06_day_starter/data/countries.js @@ -0,0 +1,195 @@ +const countries = [ + 'Afghanistan', + 'Albania', + 'Algeria', + 'Andorra', + 'Angola', + 'Antigua and Barbuda', + 'Argentina', + 'Armenia', + 'Australia', + 'Austria', + 'Azerbaijan', + 'Bahamas', + 'Bahrain', + 'Bangladesh', + 'Barbados', + 'Belarus', + 'Belgium', + 'Belize', + 'Benin', + 'Bhutan', + 'Bolivia', + 'Bosnia and Herzegovina', + 'Botswana', + 'Brazil', + 'Brunei', + 'Bulgaria', + 'Burkina Faso', + 'Burundi', + 'Cambodia', + 'Cameroon', + 'Canada', + 'Cape Verde', + 'Central African Republic', + 'Chad', + 'Chile', + 'China', + 'Colombi', + 'Comoros', + 'Congo (Brazzaville)', + 'Congo', + 'Costa Rica', + "Cote d'Ivoire", + 'Croatia', + 'Cuba', + 'Cyprus', + 'Czech Republic', + 'Denmark', + 'Djibouti', + 'Dominica', + 'Dominican Republic', + 'East Timor (Timor Timur)', + 'Ecuador', + 'Egypt', + 'El Salvador', + 'Equatorial Guinea', + 'Eritrea', + 'Estonia', + 'Ethiopia', + 'Fiji', + 'Finland', + 'France', + 'Gabon', + 'Gambia, The', + 'Georgia', + 'Germany', + 'Ghana', + 'Greece', + 'Grenada', + 'Guatemala', + 'Guinea', + 'Guinea-Bissau', + 'Guyana', + 'Haiti', + 'Honduras', + 'Hungary', + 'Iceland', + 'India', + 'Indonesia', + 'Iran', + 'Iraq', + 'Ireland', + 'Israel', + 'Italy', + 'Jamaica', + 'Japan', + 'Jordan', + 'Kazakhstan', + 'Kenya', + 'Kiribati', + 'Korea, North', + 'Korea, South', + 'Kuwait', + 'Kyrgyzstan', + 'Laos', + 'Latvia', + 'Lebanon', + 'Lesotho', + 'Liberia', + 'Libya', + 'Liechtenstein', + 'Lithuania', + 'Luxembourg', + 'Macedonia', + 'Madagascar', + 'Malawi', + 'Malaysia', + 'Maldives', + 'Mali', + 'Malta', + 'Marshall Islands', + 'Mauritania', + 'Mauritius', + 'Mexico', + 'Micronesia', + 'Moldova', + 'Monaco', + 'Mongolia', + 'Morocco', + 'Mozambique', + 'Myanmar', + 'Namibia', + 'Nauru', + 'Nepal', + 'Netherlands', + 'New Zealand', + 'Nicaragua', + 'Niger', + 'Nigeria', + 'Norway', + 'Oman', + 'Pakistan', + 'Palau', + 'Panama', + 'Papua New Guinea', + 'Paraguay', + 'Peru', + 'Philippines', + 'Poland', + 'Portugal', + 'Qatar', + 'Romania', + 'Russia', + 'Rwanda', + 'Saint Kitts and Nevis', + 'Saint Lucia', + 'Saint Vincent', + 'Samoa', + 'San Marino', + 'Sao Tome and Principe', + 'Saudi Arabia', + 'Senegal', + 'Serbia and Montenegro', + 'Seychelles', + 'Sierra Leone', + 'Singapore', + 'Slovakia', + 'Slovenia', + 'Solomon Islands', + 'Somalia', + 'South Africa', + 'Spain', + 'Sri Lanka', + 'Sudan', + 'Suriname', + 'Swaziland', + 'Sweden', + 'Switzerland', + 'Syria', + 'Taiwan', + 'Tajikistan', + 'Tanzania', + 'Thailand', + 'Togo', + 'Tonga', + 'Trinidad and Tobago', + 'Tunisia', + 'Turkey', + 'Turkmenistan', + 'Tuvalu', + 'Uganda', + 'Ukraine', + 'United Arab Emirates', + 'United Kingdom', + 'United States', + 'Uruguay', + 'Uzbekistan', + 'Vanuatu', + 'Vatican City', + 'Venezuela', + 'Vietnam', + 'Yemen', + 'Zambia', + 'Zimbabwe' +] diff --git a/Portuguese/Dia_06_Loops/06_day_starter/index.html b/Portuguese/Dia_06_Loops/06_day_starter/index.html new file mode 100644 index 000000000..697bdd617 --- /dev/null +++ b/Portuguese/Dia_06_Loops/06_day_starter/index.html @@ -0,0 +1,17 @@ + + + + + 30DaysOfJavaScript:06 Day + + + +

30DaysOfJavaScript:06 Day

+

Loops

+ + + + + + + \ No newline at end of file diff --git a/Portuguese/Dia_06_Loops/06_day_starter/scripts/main.js b/Portuguese/Dia_06_Loops/06_day_starter/scripts/main.js new file mode 100644 index 000000000..c6045c836 --- /dev/null +++ b/Portuguese/Dia_06_Loops/06_day_starter/scripts/main.js @@ -0,0 +1,2 @@ +console.log(countries) +alert('Open the console and check if the countries has been loaded') \ No newline at end of file diff --git a/Portuguese/Dia_06_Loops/dia_06_Loops.md b/Portuguese/Dia_06_Loops/dia_06_Loops.md new file mode 100644 index 000000000..93b3f4ce8 --- /dev/null +++ b/Portuguese/Dia_06_Loops/dia_06_Loops.md @@ -0,0 +1,491 @@ +
+

30 Dias de JavaScript: Loops

+ + + + + Seguir no Twitter + + +Autor: +Asabeneh Yetayeh
+ Janeiro, 2020 +
+ +
+ +[<< Dia 5](../Dia_05_Arrays/Dia_05_Arrays.md) | [Dia 7 >>](../Dia_07_Funcoes/Dia_07_Funcoes.md) + +![Dia 5](../../images/banners/day_1_6.png) + +- [📔 Dia 6](#-dia-6) + - [Loops](#loops) + - [Loop for](#for-loop) + - [Loop while](#while-loop) + - [Loop do while](#do-while-loop) + - [Loop for of](#for-of-loop) + - [break](#break) + - [continue](#continue) + - [💻 Exercícios: Dia 6](#-exercíciosdia-6) + - [Exercícios: Nível 1](#exercícios-nível-1) + - [Exercícios: Nível 2](#exercícios-nível-2) + - [Exercícios: Nível 3](#exercícios-nível-3) + +# 📔 Dia 6 + +## Loops + +A maioria das atividades que fazemos na vida estão cheias de repetições. Imagine se eu pedisse para você imprimir de 0 a 100 usando console.log(). Para implementar esta simples tarefa pode levar de 2 a 5 minutos, esse tipo de tarefa tediosa e repetitiva pode ser realizada usando loop. Se você prefere assistir a vídeos, pode conferir os [tutoriais em vídeo](https://www.youtube.com/channel/UCM4xOopkYiPwJqyKsSqL9mw) + +Em linguagens de programação para realizar tarefa repetitiva usamos diferentes tipos de loops. Os seguintes exemplos são os loops mais usados em JavaScript e outras linguagens de programação. + +### Loop for + +```js +// Estrutura do loop for +for(initialization, condition, increment/decrement){ + // código vai aqui +} +``` + +```js +for (let i = 0; i <= 5; i++) { + console.log(i); +} + +// 0 1 2 3 4 5 +``` + +```js +for (let i = 5; i >= 0; i--) { + console.log(i); +} + +// 5 4 3 2 1 0 +``` + +```js +for (let i = 0; i <= 5; i++) { + console.log(`${i} * ${i} = ${i * i}`); +} +``` + +```sh +0 * 0 = 0 +1 * 1 = 1 +2 * 2 = 4 +3 * 3 = 9 +4 * 4 = 16 +5 * 5 = 25 +``` + +```js +const paises = ['Finlandia', 'Suecia', 'Dinamarca', 'Noruega', 'Islandia']; +const novoArray = []; +for (let i = 0; i < paises.length; i++) { + novoArray.push(paises[i].toUpperCase()); +} + +// ["FINLAND", "SWEDEN", "DENMARK", "NORWAY", "ICELAND"] +``` + +Adicionando todos os elementos no array + +```js +const numeros = [1, 2, 3, 4, 5]; +let soma = 0; +for (let i = 0; i < numeros.length; i++) { + soma = soma + numeros[i]; // pode ser encurtado, soma += numeros[i] +} + +console.log(soma); // 15 +``` + +Criando um novo array com base no array existente + +```js +const numeros = [1, 2, 3, 4, 5]; +const novoArray = []; +let soma = 0; +for (let i = 0; i < numeros.length; i++) { + novoArray.push(numeros[i] ** 2); +} + +console.log(novoArray); // [1, 4, 9, 16, 25] +``` + +```js +const paises = ['Finlandia', 'Suecia', 'Noruega', 'Dinamarca', 'Islandia']; +const novoArray = []; +for (let i = 0; i < paises.length; i++) { + // A função toUpperCase() é usada para converter o texto em maiúsculas + novoArray.push(paises[i].toUpperCase()); +} + +console.log(novoArray); // ['FINLANDIA', 'SUECIA', 'NORUEGA', 'DINAMARCA', 'ISLANDIA'] +``` + +### loop while + +```js +let i = 0; +while (i <= 5) { + console.log(i); + i++; +} + +// 0 1 2 3 4 5 +``` + +### loop do while + +```js +let i = 0; +do { + console.log(i); + i++; +} while (i <= 5); + +// 0 1 2 3 4 5 +``` + +### for of loop + +Nos usamos o loop for of para arrays. É uma maneira muito útil de iterar através de um array se não estivermos interessados no índice de cada elemento no array. + +```js +for (const element of arr) { + // código vai aqui +} +``` + +```js +const numeros = [1, 2, 3, 4, 5]; + +for (const num of numeros) { + console.log(num); +} + +// 1 2 3 4 5 + +for (const num of numeros) { + console.log(num * num); +} + +// 1 4 9 16 25 + +// adicionando todos os elementos no array +let soma = 0; +for (const num of numeros) { + soma = soma + num; + // pode ser encurtado assim, soma += num + // depois disso, usaremos a sintaxe mais curta (+=, -=, *=, /= etc) +} +console.log(soma); // 15 + +const webTechs = [ + 'HTML', + 'CSS', + 'JavaScript', + 'React', + 'Redux', + 'Node', + 'MongoDB', +]; + +for (const tech of webTechs) { + console.log(tech.toUpperCase()); +} + +// HTML CSS JAVASCRIPT REACT NODE MONGODB + +for (const tech of webTechs) { + console.log(tech[0]); // pega apenas a primeira letra de cada elemento, H C J R N M +} +``` + +```js +const paises = ['Finlandia', 'Suecia', 'Noruega', 'Dinamarca', 'Islandia']; +const novoArray = []; +for (const country of paises) { + novoArray.push(country.toUpperCase()); +} + +console.log(novoArray); // ['FINLANDIA', 'SUECIA', 'NORUEGA', 'DINAMARCA', 'ISLANDIA'] +``` + +### break + +Break é usado para interromper um loop. + +```js +for (let i = 0; i <= 5; i++) { + if (i == 3) { + break; + } + console.log(i); +} + +// 0 1 2 +``` + +O código acima para se 3 for encontrado no processo de iteração. + +### continue + +Nós usamos a palavra-chave _continue_ para pular certas iterações. + +```js +for (let i = 0; i <= 5; i++) { + if (i == 3) { + continue; + } + console.log(i); +} + +// 0 1 2 4 5 +``` + +🌕 Você é tão corajoso, você chegou tão longe. Agora, você ganhou o poder de automatizar tarefas repetitivas e tediosas. Você acabou de completar os desafios do dia 6 e está 6 etapas a mais para sua grandiosidade. Agora alguns exercícios para seu cérebro e seus músculos. + +## 💻 Exercícios:Dia 6 + +### Exercícios: Nível 1 + +```js +const paises = [ + 'Albania', + 'Bolivia', + 'Canada', + 'Dinamarca', + 'Ethiopia', + 'Finlandia', + 'Germany', + 'Hungary', + 'Ireland', + 'Japan', + 'Kenya', +]; + +const webTechs = [ + 'HTML', + 'CSS', + 'JavaScript', + 'React', + 'Redux', + 'Node', + 'MongoDB', +]; + +const mernStack = ['MongoDB', 'Express', 'React', 'Node']; +``` + +1. Itere de 0 a 10 usando um loop for, faça o mesmo usando um loop while e um loop do while +2. Itere de 10 a 0 usando um loop for, faça o mesmo usando um loop while e um loop do while +3. Itere de 0 para n usando um loop for + +4. Escreva um loop que faz o seguinte padrão usando console.log(): + + ```js + # + ## + ### + #### + ##### + ###### + ####### + ``` + +5. Use loop para imprimir o seguinte padrão: + + ```sh + 0 x 0 = 0 + 1 x 1 = 1 + 2 x 2 = 4 + 3 x 3 = 9 + 4 x 4 = 16 + 5 x 5 = 25 + 6 x 6 = 36 + 7 x 7 = 49 + 8 x 8 = 64 + 9 x 9 = 81 + 10 x 10 = 100 + ``` + +6. Usando loop imprima o seguinte padrão + + ```sh + i i^2 i^3 + 0 0 0 + 1 1 1 + 2 4 8 + 3 9 27 + 4 16 64 + 5 25 125 + 6 36 216 + 7 49 343 + 8 64 512 + 9 81 729 + 10 100 1000 + ``` + +7. Use um loop para iterar de 0 a 100 e imprimir apenas números pares +8. Use um loop para iterar de 0 a 100 e imprimir apenas números ímpares +9. Use um loop para iterar de 0 a 100 e imprimir apenas números primos +10. Use um loop for para iterar de 0 a 100 e imprimir a soma de todos os números. + + ```sh + A soma de todos os números de 0 a 100 é 5050. + ``` + +11. Use um loop for para iterar de 0 a 100 e imprimir a soma de todos os números pares e a soma de todos os números ímpares. + + ```sh + A soma de todos os números pares de 0 a 100 é 2550. E a soma de todos os números ímpares de 0 a 100 é 2500. + ``` + +12. Use um loop for para iterar de 0 a 100 e imprimir a soma de todos os números pares e a soma de todos os números ímpares. Imprima a soma de pares e a soma de ímpares como array. + + ````sh + [2550, 2500] + + ```sh + [2550, 2500] + ```` + +13. Desenvolva um pequeno script que gere um array de 5 números aleatórios. +14. Desenvolva um pequeno script que gere um array de 5 números aleatórios e os números devem ser únicos +15. Desenvolva um pequeno script que gere um id aleatório de seis caracteres: + + ```sh + 5j2khz + ``` + +### Exercícios: Nível 2 + +1. Desenvolva um pequeno script que gere um id aleatório de qualquer número de caracteres: + + ```sh + fe3jo1gl124g + ``` + + ```sh + xkqci4utda1lmbelpkm03rba + ``` + +1. Escreva um script que gere um número hexadecimal aleatório. + + ```sh + '#ee33df' + ``` + +1. Escreva um script que gere um número de cor rgb aleatório. + + ```sh + rgb(240,180,80) + ``` + +1. Usando o array paises acima, crie o seguinte novo array. + + ```sh + ["ALBANIA", "BOLIVIA", "CANADA", "DENMARK", "ETHIOPIA", "FINLAND", "GERMANY", "HUNGARY", "IRELAND", "JAPAN", "KENYA"] + ``` + +1. Usando o array paises acima, crie um array para o comprimento dos paises. + + ```sh + [7, 7, 6, 7, 8, 7, 7, 7, 7, 5, 5] + ``` + + + +1. Use o array paises para criar o seguinte array de arrays: + + ```sh + [ + ['Albania', 'ALB', 7], + ['Bolivia', 'BOL', 7], + ['Canada', 'CAN', 6], + ['Dinamarca', 'DEN', 7], + ['Ethiopia', 'ETH', 8], + ['Finlandia', 'FIN', 7], + ['Germany', 'GER', 7], + ['Hungary', 'HUN', 7], + ['Ireland', 'IRE', 7], + ['Islandia', 'ICE', 7], + ['Japan', 'JAP', 5], + ['Kenya', 'KEN', 5] + ] + ``` + +1. No array de paises acima, verifique se algum dos paises contem a palavra "land". Se algum pais conter "land", imprima como um array. Se nenhum paises conter a palavra "land", imprima "Todos os paises são sem land". + + ```sh + ['Finlandia','Ireland', 'Islandia'] + ``` + + + +1. No array de paises acima, verifique se algum dos paises termina com a substring "ia". Se algum dos paises terminar, imprima como um array. Se nenhum dos paises conter a palavra "ai", imprima "Esses são os paises terminados com ia" + + ```sh + ['Albania', 'Bolivia','Ethiopia'] + ``` + +1. Usando o array de paises acima, procure o paises que contenha a maior quantidade de caracteres. + + ```sh + Ethiopia + ``` + +1. Usando o array de paises acima, encontre o paises que contenha apenas 5 caracteres. + + ```sh + ['Japan', 'Kenya'] + ``` + +1. Encontre a palavra mais longa no array webTechs + +1. Use o array webTechs para criar o seguinte array de arrays: + + ```sh + [["HTML", 4], ["CSS", 3],["JavaScript", 10],["React", 5],["Redux", 5],["Node", 4],["MongoDB", 7]] + ``` + +1. Uma aplicação criada usando MongoDB, Express, React e Node é chamada de aplicativo MERN. Crie o acrônimo MERN usando o array mernStack +1. Itere através do array, ["HTML", "CSS", "JS", "React", "Redux", "Node", "Express", "MongoDB"] usando um loop for ou um loop for of e imprima os itens. +1. Este é um array de frutas, ['banana', 'orange', 'mango', 'lemon'] inverta a ordem usando um loop sem usar o método reverse. +1. Imprima todos os elementos do array como mostrado abaixo. + + ```js + const fullStack = [ + ['HTML', 'CSS', 'JS', 'React'], + ['Node', 'Express', 'MongoDB'], + ]; + ``` + + ```sh + HTML + CSS + JS + REACT + NODE + EXPRESS + MONGODB + ``` + +### Exercícios: Nível 3 + +1. Copie o array de paises (Evite mutação) +1. Arrays são mutáveis. Crie uma cópia do array que não modifique o original. Ordene o array copiado e armazene em uma variável sortedCountries +1. Ordene o array webTechs e o array mernStack +1. Extraia todos os paises que contenham a palavra "land" do [array de paises](https://github.com/Asabeneh/30DaysOfJavaScript/tree/master/data/paises.js) e imprima como array +1. Encontre o paises que contenha a maior quantidade de caracteres no [array de paises](https://github.com/Asabeneh/30DaysOfJavaScript/tree/master/data/paises.js) +1. Extraia todos os paises que contenham a palavra "land" do [array de paises](https://github.com/Asabeneh/30DaysOfJavaScript/tree/master/data/paises.js) e imprima como array +1. Extraia todos os paises que contenham apenas quatro caracteres do [array de paises](https://github.com/Asabeneh/30DaysOfJavaScript/tree/master/data/paises.js) e imprima como array +1. Extraia todos os paises que contenham duas ou mais palavras do [array de paises](https://github.com/Asabeneh/30DaysOfJavaScript/tree/master/data/paises.js) e imprima como array +1. Inverta o [array de paises](https://github.com/Asabeneh/30DaysOfJavaScript/tree/master/data/paises.js) e coloque cada país em maiúsculas e armazene como um array + +🎉 PARABÉNS ! 🎉 + +[<< Dia 5](../Dia_05_Arrays/Dia_05_Arrays.md) | [Dia 7 >>](../Dia_07_Funcoes/Dia_07_Funcoes.md) From 29a334aa90f9df74149a6e12afe8dfbfa2a2c332 Mon Sep 17 00:00:00 2001 From: Zanderlan Date: Sun, 18 Feb 2024 18:50:00 -0300 Subject: [PATCH 6/8] pt-br - day 03 --- .../Dia_03_booleanos_operadores_data.md | 739 +++++++++--------- 1 file changed, 369 insertions(+), 370 deletions(-) diff --git a/Portuguese/Dia_03_Booleanos_Operadores_Data/Dia_03_booleanos_operadores_data.md b/Portuguese/Dia_03_Booleanos_Operadores_Data/Dia_03_booleanos_operadores_data.md index 978455116..47f742ce4 100644 --- a/Portuguese/Dia_03_Booleanos_Operadores_Data/Dia_03_booleanos_operadores_data.md +++ b/Portuguese/Dia_03_Booleanos_Operadores_Data/Dia_03_booleanos_operadores_data.md @@ -1,210 +1,210 @@
-

30 Dias De JavaScript: Boleanos, Operadores e Data

+

30 Dias de JavaScript: Booleanos, Operadores e Data

- Twitter Follow + Seguir no Twitter -Autor; +Autor: Asabeneh Yetayeh
Janeiro, 2020
-[<< Day 2](../Dia_02_Tipos_Dados/dia_02_tipos_dados.md) | [Day 4 >>](../Dia_04_Condicionais/Dia_04_condicionais.md) - -![Thirty Days Of JavaScript](../../images/banners/day_1_3.png) - -- [📔 Day 3](#-day-3) - - [Booleans](#booleans) - - [Truthy values](#truthy-values) - - [Falsy values](#falsy-values) - - [Undefined](#undefined) - - [Null](#null) - - [Operators](#operators) - - [Assignment operators](#assignment-operators) - - [Arithmetic Operators](#arithmetic-operators) - - [Comparison Operators](#comparison-operators) - - [Logical Operators](#logical-operators) - - [Increment Operator](#increment-operator) - - [Decrement Operator](#decrement-operator) - - [Ternary Operators](#ternary-operators) - - [Operator Precedence](#operator-precedence) - - [Window Methods](#window-methods) - - [Window alert() method](#window-alert-method) - - [Window prompt() method](#window-prompt-method) - - [Window confirm() method](#window-confirm-method) - - [Date Object](#date-object) - - [Creating a time object](#creating-a-time-object) - - [Getting full year](#getting-full-year) - - [Getting month](#getting-month) - - [Getting date](#getting-date) - - [Getting day](#getting-day) - - [Getting hours](#getting-hours) - - [Getting minutes](#getting-minutes) - - [Getting seconds](#getting-seconds) - - [Getting time](#getting-time) - - [💻 Day 3: Exercises](#-day-3-exercises) - - [Exercises: Level 1](#exercises-level-1) - - [Exercises: Level 2](#exercises-level-2) - - [Exercises: Level 3](#exercises-level-3) - -# 📔 Day 3 - -## Booleans - -A boolean data type represents one of the two values:_true_ or _false_. Boolean value is either true or false. The use of these data types will be clear when you start the comparison operator. Any comparisons return a boolean value which is either true or false. - -**Example: Boolean Values** - -```js -let isLightOn = true; -let isRaining = false; -let isHungry = false; -let isMarried = true; -let truValue = 4 > 3; // true -let falseValue = 4 < 3; // false -``` - -We agreed that boolean values are either true or false. - -### Truthy values - -- All numbers(positive and negative) are truthy except zero -- All strings are truthy except an empty string ('') -- The boolean true - -### Falsy values +[<< Dia 2](../Dia_02_Tipos_Dados/dia_02_tipos_dados.md) | [Dia 4 >>](../Dia_04_Condicionais/Dia_04_condicionais.md) + +![Trinta Dias De JavaScript](../../images/banners/day_1_3.png) + +- [📔 Dia 3](#-dia-3) + - [Booleanos](#booleanos) + - [Valores Verdadeiros](#valores-verdadeiros) + - [Valores Falsos](#valores-falsos) + - [Indefinido](#indefinido) + - [Nulo](#nulo) + - [Operadores](#operadores) + - [Operadores de Atribuição](#operadores-de-atribuição) + - [Operadores Aritméticos](#operadores-aritméticos) + - [Operadores de Comparação](#operadores-de-comparação) + - [Operadores Lógicos](#operadores-lógicos) + - [Operador de Incremento](#operador-de-incremento) + - [Operador de Decremento](#operador-de-decremento) + - [Operadores Ternários](#operadores-ternários) + - [Precedência de Operadores](#precedência-de-operadores) + - [Métodos da Janela](#métodos-da-janela) + - [Método alert() da Janela](#método-alert-da-janela) + - [Método prompt() da Janela](#método-prompt-da-janela) + - [Método confirm() da Janela](#método-confirm-da-janela) + - [Objeto Data](#objeto-data) + - [Criando um objeto de tempo](#criando-um-objeto-de-tempo) + - [Obtendo o ano completo](#obtendo-o-ano-completo) + - [Obtendo o mês](#obtendo-o-mês) + - [Obtendo a data](#obtendo-a-data) + - [Obtendo o dia](#obtendo-o-dia) + - [Obtendo as horas](#obtendo-as-horas) + - [Obtendo os minutos](#obtendo-os-minutos) + - [Obtendo os segundos](#obtendo-os-segundos) + - [Obtendo o tempo](#obtendo-o-tempo) + - [💻 Dia 3: Exercícios](#-dia-3-exercícios) + - [Exercícios: Nível 1](#exercícios-nível-1) + - [Exercícios: Nível 2](#exercícios-nível-2) + - [Exercícios: Nível 3](#exercícios-nível-3) + +# 📔 Dia 3 + +## Booleanos + +O tipo de dado booleano representa um de dois valores: _true_ ou _false_. O valor booleano é verdadeiro ou falso. O uso desses tipos de dados ficará claro quando você começar com o operador de comparação. Qualquer comparação retorna um valor booleano que é verdadeiro ou falso. + +**Exemplo: Valores Booleanos** + +```js +let luzAcessa = true; +let estaChovendo = false; +let estaComFome = false; +let estaCasado = true; +let valorVerdadeiro = 4 > 3; // true +let valorFalso = 4 < 3; // false +``` + +Concordamos que os valores booleanos são verdadeiros ou falsos. + +### Valores Verdadeiros + +- Todos os números (positivos e negativos) são verdadeiros exceto zero +- Todas as strings são verdadeiras exceto uma string vazia ('') +- O booleano true + +### Valores Falsos - 0 - 0n - null -- undefined +- indefinido - NaN -- the boolean false -- '', "", ``, empty string +- o booleano false +- '', "", ``, string vazia -It is good to remember those truthy values and falsy values. In later section, we will use them with conditions to make decisions. +É bom lembrar esses valores verdadeiros e falsos. Na próxima seção, usaremos eles com condições para tomar decisões. -## Undefined +## Undefined (Indefinido) -If we declare a variable and if we do not assign a value, the value will be undefined. In addition to this, if a function is not returning the value, it will be undefined. +Se declararmos uma variável e não atribuirmos um valor, o valor será Undefined (indefinido). Além disso, se uma função não estiver retornando o valor, será Undefined (indefinido). ```js -let firstName; -console.log(firstName); //not defined, because it is not assigned to a value yet +let primeiroNome; +console.log(primeiroNome); // não definido, porque ainda não foi atribuído um valor ``` -## Null +## Null (Nulo) ```js -let empty = null; -console.log(empty); // -> null , means no value +let vazio = null; +console.log(vazio); // -> null, significa sem valor ``` -## Operators +## Operadores -### Assignment operators +### Operadores de Atribuição -An equal sign in JavaScript is an assignment operator. It uses to assign a variable. +Um sinal de igual em JavaScript é um operador de atribuição. É usado para atribuir uma variável. ```js -let firstName = 'Asabeneh'; -let country = 'Finland'; +let primeiroNome = 'Asabeneh'; +let pais = 'Finlândia'; ``` -Assignment Operators +Operadores de Atribuição -![Assignment operators](../../images/assignment_operators.png) +![Operadores de Atribuição](../../images/assignment_operators.png) -### Arithmetic Operators +### Operadores Aritméticos -Arithmetic operators are mathematical operators. +Operadores aritméticos são operadores matemáticos. -- Addition(+): a + b -- Subtraction(-): a - b -- Multiplication(_): a _ b -- Division(/): a / b -- Modulus(%): a % b -- Exponential(**): a ** b +- Adição(+): a + b +- Subtração(-): a - b +- Multiplicação(_): a _ b +- Divisão(/): a / b +- Módulo(%): a % b +- Exponencial(**): a ** b ```js -let numOne = 4; -let numTwo = 3; -let sum = numOne + numTwo; -let diff = numOne - numTwo; -let mult = numOne * numTwo; -let div = numOne / numTwo; -let remainder = numOne % numTwo; -let powerOf = numOne ** numTwo; +let numUm = 4; +let numDois = 3; +let soma = numUm + numDois; +let dif = numUm - numDois; +let mult = numUm * numDois; +let div = numUm / numDois; +let resto = numUm % numDois; +let potencia = numUm ** numDois; -console.log(sum, diff, mult, div, remainder, powerOf); // 7,1,12,1.33,1, 64 +console.log(soma, dif, mult, div, resto, potencia); // 7,1,12,1.33,1, 64 ``` ```js const PI = 3.14; -let radius = 100; // length in meter +let raio = 100; // comprimento em metros -//Let us calculate area of a circle -const areaOfCircle = PI * radius * radius; -console.log(areaOfCircle); // 314 m +//Vamos calcular a área de um círculo +const areaDoCirculo = PI * raio * raio; +console.log(areaDoCirculo); // 314 m -const gravity = 9.81; // in m/s2 -let mass = 72; // in Kilogram +const gravidade = 9.81; // em m/s2 +let massa = 72; // em Quilogramas -// Let us calculate weight of an object -const weight = mass * gravity; -console.log(weight); // 706.32 N(Newton) +// Vamos calcular o peso de um objeto +const peso = massa * gravidade; +console.log(peso); // 706.32 N (Newton) -const boilingPoint = 100; // temperature in oC, boiling point of water -const bodyTemp = 37; // body temperature in oC +const pontoDeEbulicao = 100; // temperatura em oC, ponto de ebulição da água +const tempCorporal = 37; // temperatura corporal em oC -// Concatenating string with numbers using string interpolation +// Concatenando string com números usando interpolação de string /* - The boiling point of water is 100 oC. - Human body temperature is 37 oC. - The gravity of earth is 9.81 m/s2. + O ponto de ebulição da água é 100 oC. + A temperatura corporal humana é 37 oC. + A gravidade da terra é 9.81 m/s2. */ console.log( - `The boiling point of water is ${boilingPoint} oC.\nHuman body temperature is ${bodyTemp} oC.\nThe gravity of earth is ${gravity} m / s2.` + `O ponto de ebulição da água é ${pontoDeEbulicao} oC.\nA temperatura corporal humana é ${tempCorporal} oC.\nA gravidade da terra é ${gravidade} m/s2.` ); ``` -### Comparison Operators - -In programming we compare values, we use comparison operators to compare two values. We check if a value is greater or less or equal to other value. - -![Comparison Operators](../../images/comparison_operators.png) -**Example: Comparison Operators** - -```js -console.log(3 > 2); // true, because 3 is greater than 2 -console.log(3 >= 2); // true, because 3 is greater than 2 -console.log(3 < 2); // false, because 3 is greater than 2 -console.log(2 < 3); // true, because 2 is less than 3 -console.log(2 <= 3); // true, because 2 is less than 3 -console.log(3 == 2); // false, because 3 is not equal to 2 -console.log(3 != 2); // true, because 3 is not equal to 2 -console.log(3 == '3'); // true, compare only value -console.log(3 === '3'); // false, compare both value and data type -console.log(3 !== '3'); // true, compare both value and data type -console.log(3 != 3); // false, compare only value -console.log(3 !== 3); // false, compare both value and data type -console.log(0 == false); // true, equivalent -console.log(0 === false); // false, not exactly the same -console.log(0 == ''); // true, equivalent -console.log(0 == ' '); // true, equivalent -console.log(0 === ''); // false, not exactly the same -console.log(1 == true); // true, equivalent -console.log(1 === true); // false, not exactly the same +### Operadores de Comparação + +Na programação, comparamos valores; usamos operadores de comparação para comparar dois valores. Verificamos se um valor é maior, menor ou igual a outro valor. + +![Operadores de Comparação](../../images/comparison_operators.png) +**Exemplo: Operadores de Comparação** + +```js +console.log(3 > 2); // true, porque 3 é maior que 2 +console.log(3 >= 2); // true, porque 3 é maior que 2 +console.log(3 < 2); // false, porque 3 é maior que 2 +console.log(2 < 3); // true, porque 2 é menor que 3 +console.log(2 <= 3); // true, porque 2 é menor que 3 +console.log(3 == 2); // false, porque 3 não é igual a 2 +console.log(3 != 2); // true, porque 3 não é igual a 2 +console.log(3 == '3'); // true, compara apenas o valor +console.log(3 === '3'); // false, compara tanto o valor quanto o tipo de dado +console.log(3 !== '3'); // true, compara tanto o valor quanto o tipo de dado +console.log(3 != 3); // false, compara apenas o valor +console.log(3 !== 3); // false, compara tanto o valor quanto o tipo de dado +console.log(0 == false); // true, equivalente +console.log(0 === false); // false, não exatamente o mesmo +console.log(0 == ''); // true, equivalente +console.log(0 == ' '); // true, equivalente +console.log(0 === ''); // false, não exatamente o mesmo +console.log(1 == true); // true, equivalente +console.log(1 === true); // false, não exatamente o mesmo console.log(undefined == null); // true console.log(undefined === null); // false -console.log(NaN == NaN); // false, not equal +console.log(NaN == NaN); // false, não é igual console.log(NaN === NaN); // false -console.log(typeof NaN); // number +console.log(typeof NaN); // número console.log('mango'.length == 'avocado'.length); // false console.log('mango'.length != 'avocado'.length); // true @@ -215,301 +215,301 @@ console.log('tomato'.length == 'potato'.length); // true console.log('python'.length > 'dragon'.length); // false ``` -Try to understand the above comparisons with some logic. Remembering without any logic might be difficult. -JavaScript is somehow a wired kind of programming language. JavaScript code run and give you a result but unless you are good at it may not be the desired result. +Tente entender as comparações acima com alguma lógica. Lembrar sem qualquer lógica pode ser difícil. +JavaScript é de certa forma um tipo peculiar de linguagem de programação. O código JavaScript é executado e fornece um resultado, mas a menos que você seja bom nisso, pode não ser o resultado desejado. -As rule of thumb, if a value is not true with == it will not be equal with ===. Using === is safer than using ==. The following [link](https://dorey.github.io/JavaScript-Equality-Table/) has an exhaustive list of comparison of data types. +Como regra geral, se um valor não é verdadeiro com ==, ele não será igual com ===. Usar === é mais seguro do que usar ==. O seguinte [link](https://dorey.github.io/JavaScript-Equality-Table/) possui uma lista exaustiva de comparação de tipos de dados. -### Logical Operators +### Operadores Lógicos -The following symbols are the common logical operators: -&&(ampersand) , ||(pipe) and !(negation). -The && operator gets true only if the two operands are true. -The || operator gets true either of the operand is true. -The ! operator negates true to false and false to true. +Os seguintes símbolos são os operadores lógicos comuns: +&&(e), ||(ou) e !(negação). +O operador && obtém verdadeiro apenas se os dois operandos forem verdadeiros. +O operador || obtém verdadeiro se qualquer um dos operandos for verdadeiro. +O operador ! nega verdadeiro para falso e falso para verdadeiro. ```js -// && ampersand operator example +// Exemplo do operador && -const check = 4 > 3 && 10 > 5; // true && true -> true -const check = 4 > 3 && 10 < 5; // true && false -> false -const check = 4 < 3 && 10 < 5; // false && false -> false +const verificacao = 4 > 3 && 10 > 5; // true && true -> true +const verificacao = 4 > 3 && 10 < 5; // true && false -> false +const verificacao = 4 < 3 && 10 < 5; // false && false -> false -// || pipe or operator, example +// Exemplo do operador || -const check = 4 > 3 || 10 > 5; // true || true -> true -const check = 4 > 3 || 10 < 5; // true || false -> true -const check = 4 < 3 || 10 < 5; // false || false -> false +const verificacao = 4 > 3 || 10 > 5; // true || true -> true +const verificacao = 4 > 3 || 10 < 5; // true || false -> true +const verificacao = 4 < 3 || 10 < 5; // false || false -> false -//! Negation examples +// Exemplos de negação -let check = 4 > 3; // true -let check = !(4 > 3); // false -let isLightOn = true; -let isLightOff = !isLightOn; // false -let isMarried = !false; // true +let verificacao = 4 > 3; // true +let verificacao = !(4 > 3); // false +let luzAcesa = true; +let luzApagada = !luzAcesa; // false +let estaCasado = !false; // true ``` -### Increment Operator +### Operador de Incremento -In JavaScript we use the increment operator to increase a value stored in a variable. The increment could be pre or post increment. Let us see each of them: +No JavaScript, usamos o operador de incremento para aumentar o valor armazenado em uma variável. O incremento pode ser pré ou pós-incremento. Vamos ver cada um deles: -1. Pre-increment +1. Pré-incremento ```js -let count = 0; -console.log(++count); // 1 -console.log(count); // 1 +let contador = 0; +console.log(++contador); // 1 +console.log(contador); // 1 ``` -1. Post-increment +2. Pós-incremento ```js -let count = 0; -console.log(count++); // 0 -console.log(count); // 1 +let contador = 0; +console.log(contador++); // 0 +console.log(contador); // 1 ``` -We use most of the time post-increment. At least you should remember how to use post-increment operator. +Geralmente, usamos mais o pós-incremento. Pelo menos, você deve se lembrar de como usar o operador de pós-incremento. -### Decrement Operator +### Operador de Decremento -In JavaScript we use the decrement operator to decrease a value stored in a variable. The decrement could be pre or post decrement. Let us see each of them: +No JavaScript, usamos o operador de decremento para diminuir o valor armazenado em uma variável. O decremento pode ser pré ou pós-decremento. Vamos ver cada um deles: -1. Pre-decrement +1. Pré-decremento ```js -let count = 0; -console.log(--count); // -1 -console.log(count); // -1 +let contador = 0; +console.log(--contador); // -1 +console.log(contador); // -1 ``` -2. Post-decrement +2. Pós-decremento ```js -let count = 0; -console.log(count--); // 0 -console.log(count); // -1 +let contador = 0; +console.log(contador--); // 0 +console.log(contador); // -1 ``` -### Ternary Operators +### Operadores Ternários -Ternary operator allows to write a condition. -Another way to write conditionals is using ternary operators. Look at the following examples: +O operador ternário permite escrever uma condição. +Outra maneira de escrever condicionais é usando operadores ternários. Veja os seguintes exemplos: ```js -let isRaining = true; -isRaining - ? console.log('You need a rain coat.') - : console.log('No need for a rain coat.'); -isRaining = false; +let estaChovendo = true; +estaChovendo + ? console.log('Você precisa de um casaco de chuva.') + : console.log('Não precisa de casaco de chuva.'); +estaChovendo = false; -isRaining - ? console.log('You need a rain coat.') - : console.log('No need for a rain coat.'); +estaChovendo + ? console.log('Você precisa de um casaco de chuva.') + : console.log('Não precisa de casaco de chuva.'); ``` ```sh -You need a rain coat. -No need for a rain coat. +Você precisa de um casaco de chuva. +Não precisa de casaco de chuva. ``` ```js -let number = 5; -number > 0 - ? console.log(`${number} is a positive number`) - : console.log(`${number} is a negative number`); -number = -5; +let numero = 5; +numero > 0 + ? console.log(`${numero} é um número positivo`) + : console.log(`${numero} é um número negativo`); +numero = -5; -number > 0 - ? console.log(`${number} is a positive number`) - : console.log(`${number} is a negative number`); +numero > 0 + ? console.log(`${numero} é um número positivo`) + : console.log(`${numero} é um número negativo`); ``` ```sh -5 is a positive number --5 is a negative number +5 é um número positivo +-5 é um número negativo ``` -### Operator Precedence +### Precedência de Operadores -I would like to recommend you to read about operator precedence from this [link](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Operator_Precedence) +Eu gostaria de recomendar que você leia sobre a precedência de operadores neste [link](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Operator_Precedence) -## Window Methods +## Métodos da Janela -### Window alert() method +### Método alert() da Janela -As you have seen at very beginning alert() method displays an alert box with a specified message and an OK button. It is a builtin method and it takes on argument. +Como você viu no início, o método alert() exibe uma caixa de alerta com uma mensagem especificada e um botão OK. É um método embutido e aceita um argumento. ```js -alert(message); +alert(mensagem); ``` ```js -alert('Welcome to 30DaysOfJavaScript'); +alert('Bem-vindo ao 30DiasDeJavaScript'); ``` -Do not use too much alert because it is destructing and annoying, use it just to test. +Não use alerta demais porque é destrutivo e irritante, use apenas para testar. -### Window prompt() method +### Método prompt() da Janela -The window prompt methods display a prompt box with an input on your browser to take input values and the input data can be stored in a variable. The prompt() method takes two arguments. The second argument is optional. +Os métodos prompt da janela exibem uma caixa de prompt com uma entrada no seu navegador para receber valores de entrada e os dados de entrada podem ser armazenados em uma variável. O método prompt() aceita dois argumentos. O segundo argumento é opcional. ```js -prompt('required text', 'optional text'); +prompt('texto obrigatório', 'texto opcional'); ``` ```js -let number = prompt('Enter number', 'number goes here'); -console.log(number); +let numero = prompt('Digite um número', 'o número vai aqui'); +console.log(numero); ``` -### Window confirm() method +### Método confirm() da Janela -The confirm() method displays a dialog box with a specified message, along with an OK and a Cancel button. -A confirm box is often used to ask permission from a user to execute something. Window confirm() takes a string as an argument. -Clicking the OK yields true value, whereas clicking the Cancel button yields false value. +O método confirm() exibe uma caixa de diálogo com uma mensagem especificada, junto com um botão OK e um botão Cancelar. +Uma caixa de confirmação é frequentemente usada para pedir permissão de um usuário para executar algo. O Window confirm() aceita uma string como argumento. +Clicar em OK resulta em valor verdadeiro, enquanto clicar no botão Cancelar resulta em valor falso. ```js -const agree = confirm('Are you sure you like to delete? '); -console.log(agree); // result will be true or false based on what you click on the dialog box +const concorda = confirm('Você tem certeza que gostaria de deletar? '); +console.log(concorda); // o resultado será verdadeiro ou falso baseado no que você clicar na caixa de diálogo ``` -These are not all the window methods we will have a separate section to go deep into window methods. +Estes não são todos os métodos da janela, teremos uma seção separada para aprofundar nos métodos da janela. -## Date Object +## Objeto Data -Time is an important thing. We like to know the time a certain activity or event. In JavaScript current time and date is created using JavaScript Date Object. The object we create using Date object provides many methods to work with date and time.The methods we use to get date and time information from a date object values are started with a word _get_ because it provide the information. -_getFullYear(), getMonth(), getDate(), getDay(), getHours(), getMinutes, getSeconds(), getMilliseconds(), getTime(), getDay()_ +O tempo é uma coisa importante. Gostamos de saber o tempo de uma certa atividade ou evento. No JavaScript, o tempo e a data atual são criados usando o Objeto Data do JavaScript. O objeto que criamos usando o Objeto Data fornece muitos métodos para trabalhar com data e hora. Os métodos que usamos para obter informações de data e hora de um objeto de data começam com a palavra _get_ porque fornecem a informação. +_getFullYear(), getMonth(), getDate(), getDay(), getHours(), getMinutes(), getSeconds(), getMilliseconds(), getTime(), getDay()_ -![Date time Object](../../images/date_time_object.png) +![Objeto Data e Hora](../../images/date_time_object.png) -### Creating a time object +### Criando um objeto de tempo -Once we create time object. The time object will provide information about time. Let us create a time object +Uma vez que criamos um objeto de tempo. O objeto de tempo fornecerá informações sobre o tempo. Vamos criar um objeto de tempo ```js -const now = new Date(); -console.log(now); // Sat Jan 04 2020 00:56:41 GMT+0200 (Eastern European Standard Time) +const agora = new Date(); +console.log(agora); // Sat Jan 04 2020 00:56:41 GMT+0200 (Horário Padrão do Leste Europeu) ``` -We have created a time object and we can access any date time information from the object using the get methods we have mentioned on the table. +Criamos um objeto de tempo e podemos acessar qualquer informação de data e hora do objeto usando os métodos get que mencionamos na tabela. -### Getting full year +### Obtendo o ano completo -Let's extract or get the full year from a time object. +Vamos extrair ou obter o ano completo de um objeto de tempo. ```js -const now = new Date(); -console.log(now.getFullYear()); // 2020 +const agora = new Date(); +console.log(agora.getFullYear()); // 2020 ``` -### Getting month +### Obtendo o mês -Let's extract or get the month from a time object. +Vamos extrair ou obter o mês de um objeto de tempo. ```js -const now = new Date(); -console.log(now.getMonth()); // 0, because the month is January, month(0-11) +const agora = new Date(); +console.log(agora.getMonth()); // 0, porque o mês é Janeiro, mês(0-11) ``` -### Getting date +### Obtendo a data -Let's extract or get the date of the month from a time object. +Vamos extrair ou obter a data do mês de um objeto de tempo. ```js -const now = new Date(); -console.log(now.getDate()); // 4, because the day of the month is 4th, day(1-31) +const agora = new Date(); +console.log(agora.getDate()); // 4, porque o dia do mês é 4, dia(1-31) ``` -### Getting day +### Obtendo o dia -Let's extract or get the day of the week from a time object. +Vamos extrair ou obter o dia da semana de um objeto de tempo. ```js -const now = new Date(); -console.log(now.getDay()); // 6, because the day is Saturday which is the 7th day -// Sunday is 0, Monday is 1 and Saturday is 6 -// Getting the weekday as a number (0-6) +const agora = new Date(); +console.log(agora.getDay()); // 6, porque o dia é Sábado, que é o 7º dia +// Domingo é 0, Segunda é 1 e Sábado é 6 +// Obtendo o dia da semana como um número (0-6) ``` -### Getting hours +### Obtendo as horas -Let's extract or get the hours from a time object. +Vamos extrair ou obter as horas de um objeto de tempo. ```js -const now = new Date(); -console.log(now.getHours()); // 0, because the time is 00:56:41 +const agora = new Date(); +console.log(agora.getHours()); // 0, porque a hora é 00:56:41 ``` -### Getting minutes +### Obtendo os minutos -Let's extract or get the minutes from a time object. +Vamos extrair ou obter os minutos de um objeto de tempo. ```js -const now = new Date(); -console.log(now.getMinutes()); // 56, because the time is 00:56:41 +const agora = new Date(); +console.log(agora.getMinutes()); // 56, porque a hora é 00:56:41 ``` -### Getting seconds +### Obtendo os segundos -Let's extract or get the seconds from a time object. +Vamos extrair ou obter os segundos de um objeto de tempo. ```js -const now = new Date(); -console.log(now.getSeconds()); // 41, because the time is 00:56:41 +const agora = new Date(); +console.log(agora.getSeconds()); // 41, porque a hora é 00:56:41 ``` -### Getting time +### Obtendo o tempo -This method give time in milliseconds starting from January 1, 1970. It is also know as Unix time. We can get the unix time in two ways: +Este método fornece o tempo em milissegundos a partir de 1º de janeiro de 1970. Também é conhecido como tempo Unix. Podemos obter o tempo Unix de duas maneiras: -1. Using _getTime()_ +1. Usando _getTime()_ ```js -const now = new Date(); // -console.log(now.getTime()); // 1578092201341, this is the number of seconds passed from January 1, 1970 to January 4, 2020 00:56:41 +const agora = new Date(); +console.log(agora.getTime()); // 1578092201341, este é o número de segundos passados de 1º de janeiro de 1970 até 4 de janeiro de 2020 00:56:41 ``` -1. Using _Date.now()_ +2. Usando _Date.now()_ ```js -const allSeconds = Date.now(); // -console.log(allSeconds); // 1578092201341, this is the number of seconds passed from January 1, 1970 to January 4, 2020 00:56:41 +const todosOsSegundos = Date.now(); +console.log(todosOsSegundos); // 1578092201341, este é o número de segundos passados de 1º de janeiro de 1970 até 4 de janeiro de 2020 00:56:41 -const timeInSeconds = new Date().getTime(); -console.log(allSeconds == timeInSeconds); // true +const tempoEmSegundos = new Date().getTime(); +console.log(todosOsSegundos == tempoEmSegundos); // true ``` -Let us format these values to a human readable time format. -**Example:** +Vamos formatar esses valores para um formato de tempo legível por humanos. +**Exemplo:** ```js -const now = new Date(); -const year = now.getFullYear(); // return year -const month = now.getMonth() + 1; // return month(0 - 11) -const date = now.getDate(); // return date (1 - 31) -const hours = now.getHours(); // return number (0 - 23) -const minutes = now.getMinutes(); // return number (0 -59) +const agora = new Date(); +const ano = agora.getFullYear(); // retorna o ano +const mes = agora.getMonth() + 1; // retorna o mês(0 - 11) +const data = agora.getDate(); // retorna a data (1 - 31) +const horas = agora.getHours(); // retorna número (0 - 23) +const minutos = agora.getMinutes(); // retorna número (0 -59) -console.log(`${date}/${month}/${year} ${hours}:${minutes}`); // 4/1/2020 0:56 +console.log(`${data}/${mes}/${ano} ${horas}:${minutos}`); // 4/1/2020 0:56 ``` -🌕 You have boundless energy. You have just completed day 3 challenges and you are three steps a head in to your way to greatness. Now do some exercises for your brain and for your muscle. +🌕 Você tem energia sem limites. Você acabou de concluir os desafios do dia 3 e está três passos à frente no seu caminho para a grandeza. Agora faça alguns exercícios para o seu cérebro e para o seu músculo. -## 💻 Day 3: Exercises +## 💻 Exercícios do Dia 3 -### Exercises: Level 1 +### Exercícios: Nível 1 -1. Declare firstName, lastName, country, city, age, isMarried, year variable and assign value to it and use the typeof operator to check different data types. -2. Check if type of '10' is equal to 10 -3. Check if parseInt('9.8') is equal to 10 -4. Boolean value is either true or false. +1. Declare as variáveis firstName, lastName, country, city, age, isMarried, year e atribua valores a elas e utilize o operador typeof para verificar os diferentes tipos de dados. +2. Verifique se o tipo de '10' é igual a 10. +3. Verifique se parseInt('9.8') é igual a 10. +4. O valor booleano é verdadeiro ou falso. - 1. Write three JavaScript statement which provide truthy value. - 2. Write three JavaScript statement which provide falsy value. + 1. Escreva três declarações JavaScript que forneçam valor verdadeiro. + 2. Escreva três declarações JavaScript que forneçam valor falso. -5. Figure out the result of the following comparison expression first without using console.log(). After you decide the result confirm it using console.log() +5. Descubra o resultado das seguintes expressões de comparação primeiro sem usar console.log(). Após decidir o resultado, confirme-o usando console.log(): 1. 4 > 3 2. 4 >= 3 @@ -522,9 +522,9 @@ console.log(`${date}/${month}/${year} ${hours}:${minutes}`); // 4/1/2020 0:56 9. 4 != '4' 10. 4 == '4' 11. 4 === '4' - 12. Find the length of python and jargon and make a falsy comparison statement. + 12. Encontre o comprimento de python e jargon e faça uma declaração falsa de comparação. -6. Figure out the result of the following expressions first without using console.log(). After you decide the result confirm it by using console.log() +6. Descubra o resultado das seguintes expressões primeiro sem usar console.log(). Após decidir o resultado, confirme-o usando console.log(): 1. 4 > 3 && 10 < 12 2. 4 > 3 && 10 > 12 @@ -536,99 +536,98 @@ console.log(`${date}/${month}/${year} ${hours}:${minutes}`); // 4/1/2020 0:56 8. !(4 > 3 && 10 < 12) 9. !(4 > 3 && 10 > 12) 10. !(4 === '4') - 11. There is no 'on' in both dragon and python + 11. Não há 'on' em ambos dragon e python -7. Use the Date object to do the following activities - 1. What is the year today? - 2. What is the month today as a number? - 3. What is the date today? - 4. What is the day today as a number? - 5. What is the hours now? - 6. What is the minutes now? - 7. Find out the numbers of seconds elapsed from January 1, 1970 to now. +7. Use o objeto Date para realizar as seguintes atividades: + 1. Qual é o ano atual? + 2. Qual é o mês atual como um número? + 3. Qual é a data de hoje? + 4. Qual é o dia atual como um número? + 5. Qual é a hora atual? + 6. Quantos minutos estão agora? + 7. Descubra o número de segundos que se passaram desde 1º de janeiro de 1970 até agora. -### Exercises: Level 2 +### Exercícios: Nível 2 -1. Write a script that prompt the user to enter base and height of the triangle and calculate an area of a triangle (area = 0.5 x b x h). +1. Escreva um script que peça ao usuário para inserir a base e a altura do triângulo e calcule a área de um triângulo (área = 0,5 x b x h). ```sh - Enter base: 20 - Enter height: 10 - The area of the triangle is 100 + Insira a base: 20 + Insira a altura: 10 + A área do triângulo é 100 ``` -1. Write a script that prompt the user to enter side a, side b, and side c of the triangle and and calculate the perimeter of triangle (perimeter = a + b + c) +1. Escreva um script que solicite ao usuário para inserir os lados a, b e c do triângulo e calcule o perímetro do triângulo (perímetro = a + b + c) ```sh - Enter side a: 5 - Enter side b: 4 - Enter side c: 3 - The perimeter of the triangle is 12 + Insira o lado a: 5 + Insira o lado b: 4 + Insira o lado c: 3 + O perímetro do triângulo é 12 ``` -1. Get length and width using prompt and calculate an area of rectangle (area = length x width and the perimeter of rectangle (perimeter = 2 x (length + width)) -1. Get radius using prompt and calculate the area of a circle (area = pi x r x r) and circumference of a circle(c = 2 x pi x r) where pi = 3.14. -1. Calculate the slope, x-intercept and y-intercept of y = 2x -2 -1. Slope is m = (y2-y1)/(x2-x1). Find the slope between point (2, 2) and point(6,10) -1. Compare the slope of above two questions. -1. Calculate the value of y (y = x2 + 6x + 9). Try to use different x values and figure out at what x value y is 0. -1. Writ a script that prompt a user to enter hours and rate per hour. Calculate pay of the person? +1. Obtenha o comprimento e a largura usando prompt e calcule a área de um retângulo (área = comprimento x largura) e o perímetro do retângulo (perímetro = 2 x (comprimento + largura)) +1. Obtenha o raio usando prompt e calcule a área de um círculo (área = pi x r x r) e a circunferência de um círculo (c = 2 x pi x r) onde pi = 3.14. +1. Calcule a inclinação, interseção x e interseção y de y = 2x -2 +1. A inclinação é m = (y2-y1)/(x2-x1). Encontre a inclinação entre o ponto (2, 2) e o ponto (6,10) +1. Compare a inclinação das duas questões acima. +1. Calcule o valor de y (y = x^2 + 6x + 9). Tente usar diferentes valores de x e descubra em que valor de x y é 0. +1. Escreva um script que solicite ao usuário para inserir horas e taxa por hora. Calcule o pagamento da pessoa? ```sh - Enter hours: 40 - Enter rate per hour: 28 - Your weekly earning is 1120 + Insira horas: 40 + Insira a taxa por hora: 28 + Seu ganho semanal é 1120 ``` -1. If the length of your name is greater than 7 say, your name is long else say your name is short. -1. Compare your first name length and your family name length and you should get this output. +1. Se o comprimento do seu nome for maior que 7, diga que seu nome é longo, caso contrário, diga que seu nome é curto. +1. Compare o comprimento do seu primeiro nome e do seu sobrenome e você deve obter este resultado: - ```js - let firstName = 'Asabeneh'; - let lastName = 'Yetayeh'; - ``` - - ```sh - Your first name, Asabeneh is longer than your family name, Yetayeh - ``` +```js +let firstName = 'Asabeneh'; +let lastName = 'Yetayeh'; +``` -1. Declare two variables _myAge_ and _yourAge_ and assign them initial values and myAge and yourAge. +```sh +Seu primeiro nome, Asabeneh, é maior que seu sobrenome, Yetayeh +``` - ```js - let myAge = 250; - let yourAge = 25; - ``` +11. Declare duas variáveis myAge e yourAge e atribua valores iniciais a elas e myAge e yourAge. - ```sh - I am 225 years older than you. - ``` +```js +let myAge = 250; +let yourAge = 25; +``` -1. Using prompt get the year the user was born and if the user is 18 or above allow the user to drive if not tell the user to wait a certain amount of years. +```sh +Eu sou 225 anos mais velho que você. +``` - ```sh +12. Usando prompt, obtenha o ano de nascimento do usuário e, se o usuário tiver 18 anos ou mais, permita que o usuário dirija, se não, diga ao usuário para esperar uma certa quantidade de anos. - Enter birth year: 1995 - You are 25. You are old enough to drive +```sh +Insira o ano de nascimento: 1995 +Você tem 25 anos. Você é velho o suficiente para dirigir - Enter birth year: 2005 - You are 15. You will be allowed to drive after 3 years. - ``` +Insira o ano de nascimento: 2005 +Você tem 15 anos. Você será permitido dirigir após 3 anos. +``` -1. Write a script that prompt the user to enter number of years. Calculate the number of seconds a person can live. Assume some one lives just hundred years +13. Escreva um script que solicite ao usuário para inserir o número de anos. Calcule o número de segundos que uma pessoa pode viver. Suponha que alguém viva apenas cem anos - ```sh - Enter number of years you live: 100 - You lived 3153600000 seconds. - ``` +```sh +Insira o número de anos que você vive: 100 +Você viveu 3153600000 segundos. +``` -1. Create a human readable time format using the Date time object - 1. YYYY-MM-DD HH:mm - 2. DD-MM-YYYY HH:mm - 3. DD/MM/YYYY HH:mm +14. Crie um formato de tempo legível por humanos usando o objeto Date +1. YYYY-MM-DD HH:mm +1. DD-MM-YYYY HH:mm +1. DD/MM/YYYY HH:mm -### Exercises: Level 3 +### Exercícios: Nível 3 -1. Create a human readable time format using the Date time object. The hour and the minute should be all the time two digits(7 hours should be 07 and 5 minutes should be 05 ) - 1. YYY-MM-DD HH:mm eg. 20120-01-02 07:05 +1. Crie um formato de tempo legível por humanos usando o objeto Date. A hora e o minuto devem ser sempre dois dígitos (7 horas deve ser 07 e 5 minutos deve ser 05) + 1. YYYY-MM-DD HH:mm ex. 2020-01-02 07:05 [<< Dia 2](../Dia_02_Tipos_Dados/dia_02_tipos_dados.md) | [Dia 4 >>](../Dia_04_Condicionais/Dia_04_condicionais.md) From 28f6a54bbe8ae39fd60a93eef64806176459185d Mon Sep 17 00:00:00 2001 From: Zanderlan Date: Sun, 18 Feb 2024 19:17:01 -0300 Subject: [PATCH 7/8] pt-br - day 07 --- .../07_day_starter/data/countries.js | 195 +++++ .../Dia_07_Funcoes/07_day_starter/index.html | 17 + .../07_day_starter/scripts/main.js | 2 + Portuguese/Dia_07_Funcoes/Dia_07_Funcoes.md | 724 ++++++++++++++++++ 4 files changed, 938 insertions(+) create mode 100644 Portuguese/Dia_07_Funcoes/07_day_starter/data/countries.js create mode 100644 Portuguese/Dia_07_Funcoes/07_day_starter/index.html create mode 100644 Portuguese/Dia_07_Funcoes/07_day_starter/scripts/main.js create mode 100644 Portuguese/Dia_07_Funcoes/Dia_07_Funcoes.md diff --git a/Portuguese/Dia_07_Funcoes/07_day_starter/data/countries.js b/Portuguese/Dia_07_Funcoes/07_day_starter/data/countries.js new file mode 100644 index 000000000..e57b00501 --- /dev/null +++ b/Portuguese/Dia_07_Funcoes/07_day_starter/data/countries.js @@ -0,0 +1,195 @@ +const countries = [ + 'Afghanistan', + 'Albania', + 'Algeria', + 'Andorra', + 'Angola', + 'Antigua and Barbuda', + 'Argentina', + 'Armenia', + 'Australia', + 'Austria', + 'Azerbaijan', + 'Bahamas', + 'Bahrain', + 'Bangladesh', + 'Barbados', + 'Belarus', + 'Belgium', + 'Belize', + 'Benin', + 'Bhutan', + 'Bolivia', + 'Bosnia and Herzegovina', + 'Botswana', + 'Brazil', + 'Brunei', + 'Bulgaria', + 'Burkina Faso', + 'Burundi', + 'Cambodia', + 'Cameroon', + 'Canada', + 'Cape Verde', + 'Central African Republic', + 'Chad', + 'Chile', + 'China', + 'Colombi', + 'Comoros', + 'Congo (Brazzaville)', + 'Congo', + 'Costa Rica', + "Cote d'Ivoire", + 'Croatia', + 'Cuba', + 'Cyprus', + 'Czech Republic', + 'Denmark', + 'Djibouti', + 'Dominica', + 'Dominican Republic', + 'East Timor (Timor Timur)', + 'Ecuador', + 'Egypt', + 'El Salvador', + 'Equatorial Guinea', + 'Eritrea', + 'Estonia', + 'Ethiopia', + 'Fiji', + 'Finland', + 'France', + 'Gabon', + 'Gambia, The', + 'Georgia', + 'Germany', + 'Ghana', + 'Greece', + 'Grenada', + 'Guatemala', + 'Guinea', + 'Guinea-Bissau', + 'Guyana', + 'Haiti', + 'Honduras', + 'Hungary', + 'Iceland', + 'India', + 'Indonesia', + 'Iran', + 'Iraq', + 'Ireland', + 'Israel', + 'Italy', + 'Jamaica', + 'Japan', + 'Jordan', + 'Kazakhstan', + 'Kenya', + 'Kiribati', + 'Korea, North', + 'Korea, South', + 'Kuwait', + 'Kyrgyzstan', + 'Laos', + 'Latvia', + 'Lebanon', + 'Lesotho', + 'Liberia', + 'Libya', + 'Liechtenstein', + 'Lithuania', + 'Luxembourg', + 'Macedonia', + 'Madagascar', + 'Malawi', + 'Malaysia', + 'Maldives', + 'Mali', + 'Malta', + 'Marshall Islands', + 'Mauritania', + 'Mauritius', + 'Mexico', + 'Micronesia', + 'Moldova', + 'Monaco', + 'Mongolia', + 'Morocco', + 'Mozambique', + 'Myanmar', + 'Namibia', + 'Nauru', + 'Nepal', + 'Netherlands', + 'New Zealand', + 'Nicaragua', + 'Niger', + 'Nigeria', + 'Norway', + 'Oman', + 'Pakistan', + 'Palau', + 'Panama', + 'Papua New Guinea', + 'Paraguay', + 'Peru', + 'Philippines', + 'Poland', + 'Portugal', + 'Qatar', + 'Romania', + 'Russia', + 'Rwanda', + 'Saint Kitts and Nevis', + 'Saint Lucia', + 'Saint Vincent', + 'Samoa', + 'San Marino', + 'Sao Tome and Principe', + 'Saudi Arabia', + 'Senegal', + 'Serbia and Montenegro', + 'Seychelles', + 'Sierra Leone', + 'Singapore', + 'Slovakia', + 'Slovenia', + 'Solomon Islands', + 'Somalia', + 'South Africa', + 'Spain', + 'Sri Lanka', + 'Sudan', + 'Suriname', + 'Swaziland', + 'Sweden', + 'Switzerland', + 'Syria', + 'Taiwan', + 'Tajikistan', + 'Tanzania', + 'Thailand', + 'Togo', + 'Tonga', + 'Trinidad and Tobago', + 'Tunisia', + 'Turkey', + 'Turkmenistan', + 'Tuvalu', + 'Uganda', + 'Ukraine', + 'United Arab Emirates', + 'United Kingdom', + 'United States', + 'Uruguay', + 'Uzbekistan', + 'Vanuatu', + 'Vatican City', + 'Venezuela', + 'Vietnam', + 'Yemen', + 'Zambia', + 'Zimbabwe' +] diff --git a/Portuguese/Dia_07_Funcoes/07_day_starter/index.html b/Portuguese/Dia_07_Funcoes/07_day_starter/index.html new file mode 100644 index 000000000..eff81009e --- /dev/null +++ b/Portuguese/Dia_07_Funcoes/07_day_starter/index.html @@ -0,0 +1,17 @@ + + + + + 30DaysOfJavaScript:07 Day + + + +

30DaysOfJavaScript:07 Day

+

Functions

+ + + + + + + \ No newline at end of file diff --git a/Portuguese/Dia_07_Funcoes/07_day_starter/scripts/main.js b/Portuguese/Dia_07_Funcoes/07_day_starter/scripts/main.js new file mode 100644 index 000000000..c6045c836 --- /dev/null +++ b/Portuguese/Dia_07_Funcoes/07_day_starter/scripts/main.js @@ -0,0 +1,2 @@ +console.log(countries) +alert('Open the console and check if the countries has been loaded') \ No newline at end of file diff --git a/Portuguese/Dia_07_Funcoes/Dia_07_Funcoes.md b/Portuguese/Dia_07_Funcoes/Dia_07_Funcoes.md new file mode 100644 index 000000000..c581f18e0 --- /dev/null +++ b/Portuguese/Dia_07_Funcoes/Dia_07_Funcoes.md @@ -0,0 +1,724 @@ +
+

30 Dias De JavaScript: Funções

+ + + + + Twitter Follow + + +Autor: +Asabeneh Yetayeh
+Janeiro, 2020 +
+ +
+ +[<< Dia 6](../Dia_06_Loops/dia_06_Loops.md) | [Dia 8 >>](../Dia_08_Objetos/dia_08_Objetos.md) + +![Thirty Days Of JavaScript](../images/banners/day_1_7.png) + +- [📔 Dia 7](#-dia-7) + - [Funções](#funções) + - [Declaração de Função](#declaração-de-função) + - [Função sem parâmetro e retorno](#função-sem-parâmetro-e-retorno) + - [Função retornando valor](#função-retornando-valor) + - [Função com um parâmetro](#função-com-um-parâmetro) + - [Função com dois parâmetros](#função-com-dois-parâmetros) + - [Função com muitos parâmetros](#função-com-muitos-parâmetros) + - [Função com número ilimitado de parâmetros](#função-com-número-ilimitado-de-parâmetros) + - [Número ilimitado de parâmetros em função regular](#número-ilimitado-de-parâmetros-em-função-regular) + - [Número ilimitado de parâmetros em função de seta](#número-ilimitado-de-parâmetros-em-função-de-seta) + - [Função Anônima](#função-anônima) + - [Função de Expressão](#função-de-expressão) + - [Funções Autoinvocáveis](#funções-autoinvocáveis) + - [Função de Seta](#função-de-seta) + - [Função com parâmetros padrão](#função-com-parâmetros-padrão) + - [Declaração de função versus Função de seta](#declaração-de-função-versus-função-de-seta) + - [💻 Exercícios](#-exercícios) + - [Exercícios: Nível 1](#exercícios-nível-1) + - [Exercícios: Nível 2](#exercícios-nível-2) + - [Exercícios: Nível 3](#exercícios-nível-3) + +# 📔 Dia 7 + +## Funções + +Até agora, vimos muitas funções integradas no JavaScript. Nesta seção, focaremos em funções personalizadas. O que é uma função? Antes de começarmos a criar funções, vamos entender o que é uma função e por que precisamos de funções? + +Uma função é um bloco de código reutilizável ou declarações de programação projetadas para realizar uma tarefa específica. +Uma função é declarada pela palavra-chave function seguida de um nome, seguido por parênteses (). Os parênteses podem conter um parâmetro. Se uma função tiver um parâmetro, ela será chamada com um argumento. Uma função também pode ter um parâmetro padrão. Para armazenar dados em uma função, ela deve retornar algum tipo de dado. Para obter o valor, chamamos ou invocamos uma função. +Funções tornam o código: + +- Limpo e fácil de ler +- Reutilizável +- Fácil de testar + +Uma função pode ser declarada ou criada de várias maneiras: + +- _Declaração de função_ +- _Função de expressão_ +- _Função anônima_ +- _Função de seta_ (Arrow Function) + +### Declaração de Função + +Vamos ver como declarar uma função e como chamá-la. + +```js +// declarando uma função sem um parâmetro +function nomeDaFuncao() { + // o código vai aqui +} +nomeDaFuncao(); // chamando a função pelo nome e com parênteses +``` + +### Função sem parâmetro e retorno + +A função pode ser declarada sem um parâmetro. + +**Exemplo:** + +```js +// função sem parâmetro, uma função que faz um número ao quadrado +function quadrado() { + let num = 2; + let sq = num * num; + console.log(sq); +} + +quadrado(); // 4 + +// função sem parâmetro +function somarDoisNumeros() { + let numUm = 10; + let numDois = 20; + let soma = numUm + numDois; + + console.log(soma); +} + +somarDoisNumeros(); // uma função tem que ser chamada pelo seu nome para ser executada +``` + +```js +function imprimirNomeCompleto() { + let primeiroNome = 'Asabeneh'; + let sobrenome = 'Yetayeh'; + let espaco = ' '; + let nomeCompleto = primeiroNome + espaco + sobrenome; + console.log(nomeCompleto); +} + +imprimirNomeCompleto(); // chamando uma função +``` + +### Função retornando valor + +A função também pode retornar valores, se uma função não retornar valores o valor da função é indefinido. Vamos escrever as funções acima com retorno. De agora em diante, retornamos valor para uma função em vez de imprimi-lo. + +```js +function imprimirNomeCompleto() { + let primeiroNome = 'Asabeneh'; + let sobrenome = 'Yetayeh'; + let espaco = ' '; + let nomeCompleto = primeiroNome + espaco + sobrenome; + return nomeCompleto; +} +console.log(imprimirNomeCompleto()); +``` + +```js +function somarDoisNumeros() { + let numUm = 2; + let numDois = 3; + let total = numUm + numDois; + return total; +} + +console.log(somarDoisNumeros()); +``` + +### Função com um parâmetro + +Em uma função, podemos passar diferentes tipos de dados (número, string, booleano, objeto, função) como um parâmetro. + +```js +// função com um parâmetro +function nomeDaFuncao(param1) { + // o código vai aqui +} +nomeDaFuncao(param1); // durante a chamada ou invocação, um argumento é necessário + +function areaDoCirculo(r) { + let area = Math.PI * r * r; + return area; +} + +console.log(areaDoCirculo(10)); // deve ser chamada com um argumento + +function quadrado(numero) { + return numero * numero; +} + +console.log(quadrado(10)); +``` + +### Função com dois parâmetros + +```js +// função com dois parâmetros +function nomeDaFuncao(param1, param2) { + // o código vai aqui +} +nomeDaFuncao(param1, param2); // durante a chamada ou invocação, dois argumentos são necessários +// Função sem parâmetro não recebe entrada, então vamos fazer uma função com parâmetros +function somarDoisNumeros(numUm, numDois) { + let soma = numUm + numDois; + console.log(soma); +} +somarDoisNumeros(10, 20); // chamando funções +// Se uma função não retornar, ela não armazena dados, então ela deve retornar + +function somarDoisNumeros(numUm, numDois) { + let soma = numUm + numDois; + return soma; +} + +console.log(somarDoisNumeros(10, 20)); +function imprimirNomeCompleto(primeiroNome, sobrenome) { + return `${primeiroNome} ${sobrenome}`; +} +console.log(imprimirNomeCompleto('Asabeneh', 'Yetayeh')); +``` + +### Função com muitos parâmetros + +```js +// função com vários parâmetros +function nomeDaFuncao(param1, param2, param3,...) { + // o código vai aqui +} +nomeDaFuncao(param1, param2, param3,...); // durante a chamada ou invocação, três argumentos são necessários + +// esta função recebe um array como parâmetro e soma os números no array +function somarValoresArray(arr) { + let soma = 0; + for (let i = 0; i < arr.length; i++) { + soma = soma + arr[i]; + } + return soma; +} +const numeros = [1, 2, 3, 4, 5]; +// chamando a função +console.log(somarValoresArray(numeros)); + +const areaDoCirculo = (raio) => { + let area = Math.PI * raio * raio; + return area; +} +console.log(areaDoCirculo(10)); +``` + +### Função com número ilimitado de parâmetros + +Às vezes, não sabemos quantos argumentos o usuário vai passar. Portanto, devemos saber como escrever uma função que pode receber um número ilimitado de argumentos. A maneira de fazer isso tem uma diferença significativa entre uma declaração de função (função regular) e uma função de seta. Vamos ver exemplos em ambas declaração de função e função de seta. + +#### Número ilimitado de parâmetros em função regular + +Uma declaração de função fornece um objeto de argumentos de escopo de função. Qualquer coisa que passarmos como argumento na função pode ser acessada a partir do objeto arguments dentro das funções. Vamos ver um exemplo. + +```js +// Vamos acessar o objeto arguments + +function somarTodosNums() { + console.log(arguments); +} + +somarTodosNums(1, 2, 3, 4); +// Arguments(4) [1, 2, 3, 4, callee: ƒ, Symbol(Symbol.iterator): ƒ] +``` + +```js +// declaração de função + +function somarTodosNums() { + let soma = 0; + for (let i = 0; i < arguments.length; i++) { + soma += arguments[i]; + } + return soma; +} + +console.log(somarTodosNums(1, 2, 3, 4)); // 10 +console.log(somarTodosNums(10, 20, 13, 40, 10)); // 93 +console.log(somarTodosNums(15, 20, 30, 25, 10, 33, 40)); // 173 +``` + +#### Número ilimitado de parâmetros em função de seta + +A função de seta não possui o objeto de argumentos de escopo de função. Para implementar uma função que recebe um número ilimitado de argumentos em uma função de seta, usamos o operador de propagação seguido por qualquer nome de parâmetro. Qualquer coisa que passarmos como argumento na função pode ser acessada como array na função de seta. Vamos ver um exemplo. + +```js +// Vamos acessar o objeto arguments + +const somarTodosNums = (...args) => { + // console.log(arguments), objeto de arguments não encontrado em função de seta + // em vez disso, usamos um parâmetro seguido pelo operador de propagação (...) + console.log(args); +}; + +somarTodosNums(1, 2, 3, 4); +// [1, 2, 3, 4] +``` + +```js +// declaração de função + +const somarTodosNums = (...args) => { + let soma = 0; + for (const elemento of args) { + soma += elemento; + } + return soma; +}; + +console.log(somarTodosNums(1, 2, 3, 4)); // 10 +console.log(somarTodosNums(10, 20, 13, 40, 10)); // 93 +console.log(somarTodosNums(15, 20, 30, 25, 10, 33, 40)); // 173 +``` + +### Função Anônima + +Função anônima ou sem nome. + +```js +const funcaoAnonima = function () { + console.log( + 'Eu sou uma função anônima e meu valor está armazenado em funcaoAnonima' + ); +}; +``` + +### Função de Expressão + +Funções de expressão são funções anônimas. Depois de criarmos uma função sem nome e a atribuímos a uma variável. Para retornar um valor da função, devemos chamar a variável. Veja o exemplo abaixo. + +```js +// Função de expressão +const quadrado = function (n) { + return n * n; +}; + +console.log(quadrado(2)); // -> 4 +``` + +### Funções Autoinvocáveis + +Funções autoinvocáveis são funções anônimas que não precisam ser chamadas para retornar um valor. + +```js +(function (n) { + console.log(n * n); +})(2); // 4, mas em vez de apenas imprimir, se quisermos retornar e armazenar os dados, fazemos como mostrado abaixo + +let numeroAoQuadrado = (function (n) { + return n * n; +})(10); + +console.log(numeroAoQuadrado); +``` + +### Função de Seta + +A função de seta é uma alternativa para escrever uma função, no entanto, declaração de função e função de seta têm algumas pequenas diferenças. + +A função de seta usa seta em vez da palavra-chave function para declarar uma função. Vamos ver tanto a declaração de função quanto a função de seta. + +```js +// Assim é como escrevemos uma função normal ou de declaração +// Vamos mudar esta função de declaração para uma função de seta +function quadrado(n) { + return n * n; +} + +console.log(quadrado(2)); // 4 + +const quadrado = (n) => { + return n * n; +}; + +console.log(quadrado(2)); // -> 4 + +// se tivermos apenas uma linha no bloco de código, pode ser escrito da seguinte forma, retorno explícito +const quadrado = (n) => n * n; // -> 4 +``` + +```js +const mudarParaMaiusculo = (arr) => { + const newArr = []; + for (const elemento of arr) { + newArr.push(elemento.toUpperCase()); + } + return newArr; +}; + +const paises = ['Finlândia', 'Suécia', 'Noruega', 'Dinamarca', 'Islândia']; +console.log(mudarParaMaiusculo(paises)); + +// ["FINLÂNDIA", "SUÉCIA", "NORUEGA", "DINAMARCA", "ISLÂNDIA"] +``` + +```js +const imprimirNomeCompleto = (primeiroNome, ultimoNome) => { + return `${primeiroNome} ${ultimoNome}`; +}; + +console.log(imprimirNomeCompleto('Asabeneh', 'Yetayeh')); +``` + +A função acima tem apenas a declaração de retorno, portanto, podemos retorná-la explicitamente da seguinte forma. + +```js +const imprimirNomeCompleto = (primeiroNome, ultimoNome) => + `${primeiroNome} ${ultimoNome}`; + +console.log(imprimirNomeCompleto('Asabeneh', 'Yetayeh')); +``` + +### Função com parâmetros padrão + +Às vezes passamos valores padrão para os parâmetros, quando invocamos a função se não passarmos um argumento o valor padrão será usado. Tanto a declaração de função quanto a função de seta podem ter um valor padrão ou valores. + +```js +// sintaxe +// Declarando uma função +function nomeDaFuncao(param = valor) { + //códigos +} + +// Chamando função +nomeDaFuncao(); +nomeDaFuncao(arg); +``` + +**Exemplo:** + +```js +function saudacoes(nome = 'Pedro') { + let mensagem = `${nome}, bem-vindo aos 30 Dias De JavaScript!`; + return mensagem; +} + +console.log(saudacoes()); +console.log(saudacoes('Asabeneh')); +``` + +```js +function gerarNomeCompleto(primeiroNome = 'Asabeneh', ultimoNome = 'Yetayeh') { + let espaco = ' '; + let nomeCompleto = primeiroNome + espaco + ultimoNome; + return nomeCompleto; +} + +console.log(gerarNomeCompleto()); +console.log(gerarNomeCompleto('David', 'Smith')); +``` + +```js +function calcularIdade(anoDeNascimento, anoAtual = 2019) { + let idade = anoAtual - anoDeNascimento; + return idade; +} + +console.log('Idade: ', calcularIdade(1819)); +``` + +```js +function pesoDoObjeto(massa, gravidade = 9.81) { + let peso = massa * gravidade + ' N'; // o valor deve ser convertido para string primeiro + return peso; +} + +console.log('Peso de um objeto em Newton: ', pesoDoObjeto(100)); // gravidade na superfície da Terra +console.log('Peso de um objeto em Newton: ', pesoDoObjeto(100, 1.62)); // gravidade na superfície da Lua +``` + +Vamos ver como escrevemos as funções acimas com funções de seta + +```js +// sintaxe +// Declarando uma função +const nomeDaFuncao = (param = valor) => { + //códigos +}; + +// Chamando função +nomeDaFuncao(); +nomeDaFuncao(arg); +``` + +**Exemplo:** + +```js +const saudacoes = (nome = 'Pedro') => { + let mensagem = nome + ', bem-vindo aos 30 Dias De JavaScript!'; + return mensagem; +}; + +console.log(saudacoes()); +console.log(saudacoes('Asabeneh')); +``` + +```js +const gerarNomeCompleto = ( + primeiroNome = 'Asabeneh', + ultimoNome = 'Yetayeh' +) => { + let espaco = ' '; + let nomeCompleto = primeiroNome + espaco + ultimoNome; + return nomeCompleto; +}; + +console.log(gerarNomeCompleto()); +console.log(gerarNomeCompleto('David', 'Smith')); +``` + +```js +const calcularIdade = (anoDeNascimento, anoAtual = 2019) => + anoAtual - anoDeNascimento; +console.log('Idade: ', calcularIdade(1819)); +``` + +```js +const pesoDoObjeto = (massa, gravidade = 9.81) => massa * gravidade + ' N'; + +console.log('Peso de um objeto em Newton: ', pesoDoObjeto(100)); // gravidade na superfície da Terra +console.log('Peso de um objeto em Newton: ', pesoDoObjeto(100, 1.62)); // gravidade na superfície da Lua +``` + +### Declaração de função versus Função de seta + +Será abordado em outra seção. + +🌕 Você é uma estrela em ascensão, agora você conhece funções. Agora, você está super carregado com o poder das funções. Você acabou de completar os desafios do dia 7 e está 7 passos à frente no seu caminho para a grandeza. Agora faça alguns exercícios para o seu cérebro e para o seu músculo. + +## 💻 Exercícios + +### Exercícios: Nível 1 + +1. Declare uma função _fullName_ e ela imprime seu nome completo. +2. Declare uma função _fullName_ e agora ela recebe firstName, lastName como parâmetro e retorna seu nome completo. +3. Declare uma função _addNumbers_ e ela recebe dois parâmetros e retorna a soma. +4. A área de um retângulo é calculada como segue: _área = comprimento x largura_. Escreva uma função que calcula _areaOfRectangle_. +5. O perímetro de um retângulo é calculado como segue: _perímetro= 2x(comprimento + largura)_. Escreva uma função que calcula _perimeterOfRectangle_. +6. O volume de um prisma retangular é calculado como segue: _volume = comprimento x largura x altura_. Escreva uma função que calcula _volumeOfRectPrism_. +7. A área de um círculo é calculada como segue: _área = π x r x r_. Escreva uma função que calcula _areaOfCircle_ +8. A circunferência de um círculo é calculada como segue: _circunferência = 2πr_. Escreva uma função que calcula _circumOfCircle_ +9. A densidade de uma substância é calculada como segue:_densidade= massa/volume_. Escreva uma função que calcula _density_. +10. A velocidade é calculada dividindo a distância total coberta por um objeto em movimento pela quantidade total de tempo tomado. Escreva uma função que calcula a velocidade de um objeto em movimento, _speed_. +11. O peso de uma substância é calculado como segue: _peso = massa x gravidade_. Escreva uma função que calcula _weight_. +12. A temperatura em oC pode ser convertida para oF usando esta fórmula: _oF = (oC x 9/5) + 32_. Escreva uma função que converte oC para oF _convertCelsiusToFahrenheit_. +13. O índice de massa corporal (IMC) é calculado como segue: _imc = peso em Kg / (altura x altura) em m2_. Escreva uma função que calcula _bmi_. O IMC é usado para definir amplamente diferentes grupos de peso em adultos de 20 anos ou mais. Verifique se uma pessoa está _abaixo do peso, peso normal, sobrepeso_ ou _obesa_ com base nas informações fornecidas abaixo. + + - Os mesmos grupos se aplicam a homens e mulheres. + - _Abaixo do peso_: IMC é menor que 18.5 + - _Peso normal_: IMC é 18.5 a 24.9 + - _Sobrepeso_: IMC é 25 a 29.9 + - _Obeso_: IMC é 30 ou mais + +14. Escreva uma função chamada _checkSeason_, ela recebe um parâmetro de mês e retorna a estação: Outono, Inverno, Primavera ou Verão. +15. Math.max retorna seu maior argumento. Escreva uma função findMax que recebe três argumentos e retorna o máximo deles sem usar o método Math.max. + + ```js + console.log(findMax(0, 10, 5)); + 10; + console.log(findMax(0, -10, -2)); + 0; + ``` + +### Exercícios: Nível 2 + +1. Equação linear é calculada como segue: _ax + by + c = 0_. Escreva uma função que calcula o valor de uma equação linear, _solveLinEquation_. +2. Equação quadrática é calculada como segue: _ax2 + bx + c = 0_. Escreva uma função que calcula o valor ou valores de uma equação quadrática, _solveQuadEquation_. + + ```js + console.log(solveQuadratic()); // {0} + console.log(solveQuadratic(1, 4, 4)); // {-2} + console.log(solveQuadratic(1, -1, -2)); // {2, -1} + console.log(solveQuadratic(1, 7, 12)); // {-3, -4} + console.log(solveQuadratic(1, 0, -4)); //{2, -2} + console.log(solveQuadratic(1, -1, 0)); //{1, 0} + ``` + +3. Declare uma função chamada _printArray_. Ela recebe um array como parâmetro e imprime cada valor do array. +4. Escreva uma função chamada _showDateTime_ que mostra a hora neste formato: 08/01/2020 04:08 usando o objeto Date. + + ```sh + showDateTime() + 08/01/2020 04:08 + ``` + +5. Declare uma função chamada _swapValues_. Esta função troca o valor de x por y. + + ```js + swapValues(3, 4); // x => 4, y=>3 + swapValues(4, 5); // x = 5, y = 4 + ``` + +6. Declare uma função chamada _reverseArray_. Ela recebe um array como parâmetro e retorna o inverso do array (não use o método). + + ```js + console.log(reverseArray([1, 2, 3, 4, 5])); + //[5, 4, 3, 2, 1] + console.log(reverseArray(['A', 'B', 'C'])); + //['C', 'B', 'A'] + ``` + +7. Declare uma função chamada _capitalizeArray_. Ela recebe um array como parâmetro e retorna o array com letras maiúsculas. + +8. Declare uma função chamada _addItem_. Ela recebe um item como parâmetro e retorna um array após adicionar o item. + +9. Declare uma função chamada _removeItem_. Ela recebe um índice como parâmetro e retorna um array após remover um item. + +10. Declare uma função chamada _sumOfNumbers_. Ela recebe um número como parâmetro e soma todos os números naquele intervalo. + +11. Declare uma função chamada _sumOfOdds_. Ela recebe um número como parâmetro e soma todos os números ímpares naquele intervalo. + +12. Declare uma função chamada _sumOfEven_. Ela recebe um número como parâmetro e soma todos os números pares naquele intervalo. + +13. Declare uma função chamada _evensAndOdds_. Ela recebe um inteiro positivo como parâmetro e conta o número de pares e ímpares no número. + +```sh +evensAndOdds(100); +The number of odds are 50. +The number of evens are 51. +``` + +14. Escreva uma função que recebe qualquer número de argumentos e retorna a soma dos argumentos. + +```js +sum(1, 2, 3); // -> 6 +sum(1, 2, 3, 4); // -> 10 +``` + +15. Escreva uma função que gera um _randomUserIp_. + +16. Escreva uma função que gera um _randomMacAddress_. + +17. Declare uma função chamada _randomHexaNumberGenerator_. Quando esta função é chamada, ela gera um número hexadecimal aleatório. A função retorna o número hexadecimal. + +```sh +console.log(randomHexaNumberGenerator()); +'#ee33df' +``` + +18. Declare uma função chamada _userIdGenerator_. Quando esta função é chamada, ela gera um id de sete caracteres. A função retorna o id. + +```sh +console.log(userIdGenerator()); +41XTDbE +``` + +### Exercícios: Nível 3 + +1. Modifique a função _userIdGenerator_. Declare uma função chamada _userIdGeneratedByUser_. Ela não recebe nenhum parâmetro, mas recebe duas entradas usando prompt(). Uma das entradas é o número de caracteres e a segunda entrada é o número de ids que devem ser gerados. + + ```sh + userIdGeneratedByUser() + 'kcsy2 + SMFYb + bWmeq + ZXOYh + 2Rgxf + ' + userIdGeneratedByUser() + '1GCSgPLMaBAVQZ26 + YD7eFwNQKNs7qXaT + ycArC5yrRupyG00S + UbGxOFI7UXSWAyKN + dIV0SSUTgAdKwStr + ' + ``` + +2. Escreva uma função chamada _rgbColorGenerator_ e ela gera cores RGB. + + ```sh + rgbColorGenerator() + rgb(125,244,255) + ``` + +3. Escreva uma função **_arrayOfHexaColors_** que retorna qualquer número de cores hexadecimais em um array. + +4. Escreva uma função **_arrayOfRgbColors_** que retorna qualquer número de cores RGB em um array. + +5. Escreva uma função **_convertHexaToRgb_** que converte cor hexadecimal para RGB e retorna uma cor RGB. + +6. Escreva uma função **_convertRgbToHexa_** que converte cor RGB para hexadecimal e retorna uma cor hexadecimal. + +7. Escreva uma função **_generateColors_** que pode gerar qualquer número de cores hexadecimais ou RGB. + + ```js + console.log(generateColors('hexa', 3)); // ['#a3e12f', '#03ed55', '#eb3d2b'] + console.log(generateColors('hexa', 1)); // '#b334ef' + console.log(generateColors('rgb', 3)); // ['rgb(5, 55, 175)', 'rgb(50, 105, 100)', 'rgb(15, 26, 80)'] + console.log(generateColors('rgb', 1)); // 'rgb(33,79, 176)' + ``` + +8. Chame sua função _shuffleArray_, ela recebe um array como parâmetro e retorna um array embaralhado. + +9. Chame sua função _factorial_, ela recebe um número inteiro como parâmetro e retorna um fatorial do número. + +10. Chame sua função _isEmpty_, ela recebe um parâmetro e verifica se está vazio ou não. + +11. Chame sua função _sum_, ela recebe qualquer número de argumentos e retorna a soma. + +12. Escreva uma função chamada _sumOfArrayItems_, ela recebe um parâmetro de array e retorna a soma de todos os itens. Verifique se todos os itens do array são do tipo número. Se não, forneça um feedback adequado. + +13. Escreva uma função chamada _average_, ela recebe um parâmetro de array e retorna a média dos itens. Verifique se todos os itens do array são do tipo número. Se não, forneça um feedback adequado. + +14. Escreva uma função chamada _modifyArray_ que recebe um array como parâmetro e modifica o quinto item do array e retorna o array. Se o comprimento do array for menor que cinco, retorna 'item não encontrado'. + +```js +console.log(modifyArray(['Avocado', 'Tomato', 'Potato','Mango', 'Lemon','Carrot']); +``` + +```sh +['Avocado', 'Tomato', 'Potato','Mango', 'LEMON', 'Carrot'] +``` + +```js +console.log(modifyArray(['Google', 'Facebook','Apple', 'Amazon','Microsoft', 'IBM']); +``` + +```sh +['Google', 'Facebook','Apple', 'Amazon','MICROSOFT', 'IBM'] +``` + +```js +console.log(modifyArray(['Google', 'Facebook','Apple', 'Amazon']); +``` + +```sh + 'Not Found' +``` + +15. Escreva uma função chamada _isPrime_, que verifica se um número é um número primo. + +16. Escreva uma função que verifica se todos os itens são únicos no array. + +17. Escreva uma função que verifica se todos os itens do array são do mesmo tipo de dados. + +18. O nome de variável em JavaScript não suporta caracteres especiais ou símbolos exceto \$ ou \_. Escreva uma função **isValidVariable** que verifica se uma variável é válida ou inválida. + +19. Escreva uma função que retorna um array de sete números aleatórios em uma faixa de 0-9. Todos os números devem ser únicos. + +```js +sevenRandomNumbers()[(1, 4, 5, 7, 9, 8, 0)]; +``` + +20. Escreva uma função chamada reverseCountries, ela recebe o array de países e, primeiro, copia o array e retorna a inversão do array original. + +🎉 PARABÉNS ! 🎉 + +[<< Dia 6](../Dia_06_Loops/dia_06_Loops.md) | [Dia 8 >>](../Dia_08_Objetos/dia_08_Objetos.md) From a1caf177ad9e269b791a3134d171153eac59d3c5 Mon Sep 17 00:00:00 2001 From: Beatriz Gebhardt Date: Tue, 1 Jul 2025 19:30:13 -0300 Subject: [PATCH 8/8] Adds JavaScript exercises in Portuguese Introduces exercises for days 1-5 in Portuguese, covering basic data types, variables, string manipulation, boolean logic, and arrays. These exercises aim to provide a practical introduction to JavaScript fundamentals. --- .../data-types-1.js" | 4 + .../exercices-1.js" | 46 ++++ .../variable-1.js" | 12 + .../dia_02_starter/exercices-2.js | 209 ++++++++++++++++++ .../03_day_starter/scripts/exercices-3.js | 46 ++++ .../03_day_starter/scripts/tiposdedados-3.js | 12 + .../03_day_starter/scripts/variavel-3.js | 5 + .../04_day_starter/exercices- 4.js | 140 ++++++++++++ Portuguese/Dia_05_Arrays/exercices-5.js | 149 +++++++++++++ 9 files changed, 623 insertions(+) create mode 100644 "Portuguese/Dia_01_introdu\303\247\303\243o/data-types-1.js" create mode 100644 "Portuguese/Dia_01_introdu\303\247\303\243o/exercices-1.js" create mode 100644 "Portuguese/Dia_01_introdu\303\247\303\243o/variable-1.js" create mode 100644 Portuguese/Dia_02_Tipos_Dados/dia_02_starter/exercices-2.js create mode 100644 Portuguese/Dia_03_Booleanos_Operadores_Data/03_day_starter/scripts/exercices-3.js create mode 100644 Portuguese/Dia_03_Booleanos_Operadores_Data/03_day_starter/scripts/tiposdedados-3.js create mode 100644 Portuguese/Dia_03_Booleanos_Operadores_Data/03_day_starter/scripts/variavel-3.js create mode 100644 Portuguese/Dia_04_Condicionais/04_day_starter/exercices- 4.js create mode 100644 Portuguese/Dia_05_Arrays/exercices-5.js diff --git "a/Portuguese/Dia_01_introdu\303\247\303\243o/data-types-1.js" "b/Portuguese/Dia_01_introdu\303\247\303\243o/data-types-1.js" new file mode 100644 index 000000000..bdae2d61c --- /dev/null +++ "b/Portuguese/Dia_01_introdu\303\247\303\243o/data-types-1.js" @@ -0,0 +1,4 @@ +console.log(typeof nome); +console.log(typeof isBeautiful); +console.log(typeof idade); +console.log(typeof cidade); diff --git "a/Portuguese/Dia_01_introdu\303\247\303\243o/exercices-1.js" "b/Portuguese/Dia_01_introdu\303\247\303\243o/exercices-1.js" new file mode 100644 index 000000000..9cffce25b --- /dev/null +++ "b/Portuguese/Dia_01_introdu\303\247\303\243o/exercices-1.js" @@ -0,0 +1,46 @@ +//1 - Escreva um comentário de linha única que diga, comentários faz seu código ser fácil de ler +// Comentários fazem seu código ser fácil de ler + +//2 - Escreva outro comentário de linha única que diga, Welcome to 30DaysOfJavaScript +// Welcome to 30DaysOfJavaScript + +//3 - Escreva um comentário de várias linhas que diga, comentários faz seu código ser fácil de ler, fácil de reusar e informativo +/* +Comentários faz seu código ser fácil de ler, +fácil de reusar e informativo +*/ + +//4 - Crie um arquivo variavel.js e declare variáveis e atribua uma string, boolean, undefined e null + +//5 - Crie um arquivo tiposdedados.js e use o JavaScript typeof operador para verificar diferentes tipos de dados. Verifique o tipo de dado de cada variável + +//6 - Declare quatro variáveis sem atribuir valores +let carro; +let chuva; +let ano; +let diaDaSemana; + +//7 - Declare quatro variáveis e atribuir valores +let cor = "azul"; +let idade = 30; +let cidade = "Goiânia"; +let isFriday = true; + +//8 - Declare variáveis para armazenar seu primeiro nome, ultimo nome, estado civil, país e idade em multiplas linhas +let primeiroNome = "Beatriz"; +let ultimoNome = "Almeida"; +let estadoCivil = "Solteira"; +let pais = "Brasil"; +let minhaIdade = 27; + +//9 - Declare variáveis para armazenar seu primeiro nome, ultimo nome, estado civil, país e idade em uma única linha +let nomeCompleto = "Beatriz Almeida", + maritalState = "Solteira", + paisOrigem = "Brasil", + idadeAtual = 27; + +//10 - Declare duas variáveis minhaIdade e suaIdade e atribua valores iniciais e mostre no console do navegador. +let myAge = 27; +let yourAge = 30; +console.log("Minha idade:", minhaIdade); +console.log("Sua idade:", suaIdade); diff --git "a/Portuguese/Dia_01_introdu\303\247\303\243o/variable-1.js" "b/Portuguese/Dia_01_introdu\303\247\303\243o/variable-1.js" new file mode 100644 index 000000000..7814db1f7 --- /dev/null +++ "b/Portuguese/Dia_01_introdu\303\247\303\243o/variable-1.js" @@ -0,0 +1,12 @@ +//string +let nome = "Liz"; + +// boolean +let isBeautiful = true; + +// undefined +let idade; +console.log(idade); + +// null +let cidade = null; diff --git a/Portuguese/Dia_02_Tipos_Dados/dia_02_starter/exercices-2.js b/Portuguese/Dia_02_Tipos_Dados/dia_02_starter/exercices-2.js new file mode 100644 index 000000000..508fc5f33 --- /dev/null +++ b/Portuguese/Dia_02_Tipos_Dados/dia_02_starter/exercices-2.js @@ -0,0 +1,209 @@ +//1 - Declare uma variável chamada desafio e atribua a ela um valor inicial '30 Dias de JavaScript'. +let desafio = "30 Dias de JavaScript"; + +//2 - Imprimir uma string no console do browser usando console.log() +console.log(javaScript); + +//3 - Imprimir o length da string no console do browser usando o console.log(). +console.log(javaScript.length); + +//4 - Troque todos os caracteres da string para letras maiúsculas usando o método toUpperCase(). +console.log(desafio.toUpperCase()); + +//5 - Troque todos os caracteres da string para letras minúsculas usando o método toLowerCase(). +console.log(desafio.toLowerCase()); + +//6 - Retirar (Slice) a primeira letra da string usando os métodos substr() ou substring(). +console.log(desafio.substring(1)); +console.log(desafio.slice(1)); + +//7 - Dividir a frase Days Of JavaScript de 30 Days Of JavaScript. +console.log(desafio.split("")); + +//8 - Verificar se a string contém a palavra Script usando o método includes(). +console.log(desafio.includes("Script")); + +//9 - Separar a string em um array usando o método split(). +console.log(desafio.split()); + +//10 - Separar a string 30 Dias de JavaScript com espaços usando o método split(). +console.log(desafio.split(" ")); + +//11 - "Facebook, Google, Microsoft, Apple, IBM, Oracle, Amazon" split a string com vírgulas e mude-a para um array. +empresas = "Facebook, Google, Microsoft, Apple, IBM, Oracle, Amazon"; +console.log(empresas.split(", ")); + +//12 - Mude 30 Dias de JavaScript para 30 Dias de Python usando o método replace(). +console.log(desafio.split("Javascript").join("Phyton")); + +//13 - Qual é o caractere no index 15 em "30 Dias de JavaScript' string? Use o método charAt(). +let texto = "30 Dias de JavaScript"; +let caractere = texto.charAt(15); +console.log(caractere); + +//14 - Qual é o código do caractere de J em "30 Dias de JavaScript" string usando o método charCodeAt(). +let texto1 = "30 Dias de JavaScript"; +let codigo = texto1.charCodeAt(11); +console.log(codigo); + +//15 - Use indexOf para determinar a posição da primeira ocorrência de a em 30 Dias de JavaScript. +console.log(desafio.indexOf("a")); + +//16 - Use lastIndexOf para determinar a posição da última ocorrência de a em 30 Dias de JavaScript. +console.log(desafio.lastIndexOf("a")); + +//17 - Use indexOf para encontrar a posição da primeira ocorrência da palavra because na seguinte frase:'You cannot end a sentence with because because because is a conjunction'. +let frase = + "You cannot end a sentence with because because because is a conjunction"; +console.log(frase.indexOf("because")); + +//18 - Use lastIndexOf para encontrar a posição da última ocorrência da palavra because na seguinte frase:'You cannot end a sentence with because because because is a conjunction'. +console.log(frase.lastIndexOf("because")); + +//19 - Use search para encontrar a posição da primeira ocorrência da palavra because na seguinte frase:'You cannot end a sentence with because because because is a conjunction'. +console.log(frase.search("because")); + +//20 - Use trim() para remover qualquer espaço adicional no início e no final da string .E.g " 30 Dias de JavaScript ". +let fraseComEspacos = " 30 Dias de JavaScript "; +console.log(fraseComEspacos.trim()); + +//21 - Use startsWith() com a string 30 Dias De JavaScript e faça o resultado ser verdadeiro. +console.log(desafio.startsWith("30 Dias De JavaScript")); + +//22 - Use endsWith() com a string 30 Dias De JavaScript e faça o resultado ser verdadeiro. +let desafio2 = "30 Dias De JavaScript"; +console.log(desafio2.endsWith("30 Dias De JavaScript")); + +//23 - Use match() para encontrar todos os a's em 30 Dias De JavaScript. +let desafio3 = "30 Dias De JavaScript"; +console.log(desafio3.match(/a/g)); + +//24 - Use concat() para unir "30 Dias de" e "JavaScript" para uma única string, "30 Dias de JavaScript". +let parte1 = "30 Dias de"; +let parte2 = "JavaScript"; +console.log(parte1.concat(" ", parte2)); + +//25 - Use repeat() para imprimir 30 Dias De JavaScript 2 vezes. +let repeticao = desafio.repeat(2); +console.log(repeticao); + +//Exercícios 2 + +//Usando o console.log() imprimir a seguinte citação: +// "Não há exercício melhor para o coração que ir lá em baixo e levantar as pessoas" by John Holmes nos ensina a ajudar outras pessoas. +let citação = `"Não há exercício melhor para o coração que ir lá em baixo e levantar as pessoas" by John Holmes nos ensina a ajudar outras pessoas.`; +console.log(citação); + +//Usando o console.log() imprimir a seguinte citação de Madre Teresa: +// "O amor não é paternalista e a caridade não tem a ver com pena, tem a ver com amor. Caridade e amor são a mesma coisa – com a caridade você dá amor, então não dê apenas dinheiro, mas estenda sua mão." +let citação2 = `"O amor não é paternalista e a caridade não tem a ver com pena, tem a ver com amor. Caridade e amor são a mesma coisa – com a caridade você dá amor, então não dê apenas dinheiro, mas estenda sua mão."`; +console.log(citação2); + +//Verificar se typeOf "10" é exatamente igual a 10. Se não, faça ser exatamente igual. +let numero = "10"; +console.log(typeof numero === "number" ? numero : Number(numero)); + +//Verificar se parseFloat("9.8) é igual a 10. Se não, faça ser exatamente igual com 10. +let numeroFloat = parseFloat("9.8"); +console.log(numeroFloat === 10 ? numeroFloat : 10); + +//Verificar se "ão" é encontrado em ambos algodão e jargão. +let palavra1 = "algodão"; +let palavra2 = "jargão"; +console.log(palavra1.includes("ão") && palavra2.includes("ão")); + +//Espero que este curso não tenha muitos jargões. Verifique se jargões está na frase. +let fraseJargao = "Espero que este curso não tenha muitos jargões."; +console.log(fraseJargao.includes("jargões")); + +//Gerar um número aleatório entre incluindo 0 e 100. +let numeroAleatorio = Math.floor(Math.random() * 101); +console.log(numeroAleatorio); + +//Gerar um número aleatório entre incluindo 50 e 100. +let numeroAleatorio50a100 = Math.floor(Math.random() * 51) + 50; +console.log(numeroAleatorio50a100); + +//Gerar um número aleatório entre incluindo 0 e 255. +let numeroAleatorio0a255 = Math.floor(Math.random() * 256); +console.log(numeroAleatorio0a255); + +//Acesse os caracteres da string "JavaScript" usando um número aleatório. +let stringJavaScript = "JavaScript"; +let indiceAleatorio = Math.floor(Math.random() * stringJavaScript.length); +console.log(stringJavaScript.charAt(indiceAleatorio)); + +//Use console.log() e imprimir os caracteres no seguinte padrão. + +/* +1 1 1 1 1 +2 1 2 4 8 +3 1 3 9 27 +4 1 4 16 64 +5 1 5 25 125*/ +console.log("1 1 1 1 1"); +console.log("2 1 2 4 8"); +console.log("3 1 3 9 27"); +console.log("4 1 4 16 64"); +console.log("5 1 5 25 125"); + +//Use substr para retirar da frase because because because da seguinte frase: 'You cannot end a sentence with because because because is a conjunction'. +let fraseRetirada = + "You cannot end a sentence with because because because is a conjunction"; +let inicio = fraseRetirada.indexOf("because"); +let fim = inicio + "because because because".length; +let resultado = fraseRetirada.substring(inicio, fim); +console.log(resultado); + +//Exercícios 3 + +//"Amor é a melhor coisa neste mundo. Alguns encontraram seu amor e alguns ainda estão procurando pelo seu amor." Contar o número de palavras amor nesta frase. +let amor = + "Amor é a melhor coisa neste mundo. Alguns encontraram seu amor e alguns ainda estão procurando pelo seu amor."; +let contagemAmor = amor.match(/amor/gi); +console.log( + `A palavra "amor" aparece ${ + contagemAmor ? contagemAmor.length : 0 + } vezes na frase.` +); + +//Use match() para contar os números de todos os because na seguinte frase: 'You cannot end a sentence with because because because is a conjunction'. +let fraseBecause = + "You cannot end a sentence with because because because is a conjunction"; +let contagemBecause = fraseBecause.match(/because/gi); +console.log( + `A palavra "because" aparece ${ + contagemBecause ? contagemBecause.length : 0 + } vezes na frase.` +); + +//Limpar o seguinte texto e encontrar a palavra mais repetida (dica, use replace e expressões regulares) +// const frase = " %I $am@% a %tea@cher%, &and& I lo%#ve %te@a@ching%;. The@re $is no@th@ing; &as& mo@re rewarding as educa@ting &and& @emp%o@weri@ng peo@ple. ;I found tea@ching m%o@re interesting tha@n any ot#her %jo@bs. %Do@es thi%s mo@tiv#ate yo@u to be a tea@cher!? %Th#is 30#Days&OfJavaScript &is al@so $the $resu@lt of &love& of tea&ching " +let textoLimpar = + " %I $am@% a %tea@cher%, &and& I lo%#ve %te@a@ching%;. The@re $is no@th@ing; &as& mo@re rewarding as educa@ting &and& @emp%o@weri@ng peo@ple. ;I found tea@ching m%o@re interesting tha@n any ot#her %jo@bs. %Do@es thi%s mo@tiv#ate yo@u to be a tea@cher!? %Th#is 30#Days&OfJavaScript &is al@so $the $resu@lt of &love& of tea&ching "; +let textoLimpo = textoLimpar + .replace(/[%$@&#;]/g, "") + .replace(/\s+/g, " ") + .trim() + .toLowerCase(); +let palavras = textoLimpo.split(" "); +let contagemPalavras = {}; +palavras.forEach((palavra) => { + contagemPalavras[palavra] = (contagemPalavras[palavra] || 0) + 1; +}); +let palavraMaisRepetida = Object.keys(contagemPalavras).reduce((a, b) => + contagemPalavras[a] > contagemPalavras[b] ? a : b +); +console.log( + `A palavra mais repetida é "${palavraMaisRepetida}" com ${contagemPalavras[palavraMaisRepetida]} ocorrências.` +); + +//Calcular o total anual de uma pessoa extraindo os números do seguinte texto. "Ele recebe 5000 euros de salário por mês, 10000 euros de bônus anual, 15000 euros de cursos onlines por mês.'. +let textoSalario = + "Ele recebe 5000 euros de salário por mês, 10000 euros de bônus anual, 15000 euros de cursos onlines por mês."; +let numeros = textoSalario.match(/\d+/g).map(Number); +let salarioMensal = numeros[0]; +let bonusAnual = numeros[1]; +let cursosMensal = numeros[2]; +let totalAnual = salarioMensal * 12 + bonusAnual + cursosMensal * 12; +console.log(`O total anual é ${totalAnual} euros.`); diff --git a/Portuguese/Dia_03_Booleanos_Operadores_Data/03_day_starter/scripts/exercices-3.js b/Portuguese/Dia_03_Booleanos_Operadores_Data/03_day_starter/scripts/exercices-3.js new file mode 100644 index 000000000..dd899f471 --- /dev/null +++ b/Portuguese/Dia_03_Booleanos_Operadores_Data/03_day_starter/scripts/exercices-3.js @@ -0,0 +1,46 @@ +//1 - Escreva um comentário de linha única que diga, comentários faz seu código ser fácil de ler +//comentários faz seu código ser fácil de ler + +//2 - Escreva outro comentário de linha única que diga, Welcome to 30DaysOfJavaScript +//Welcome to 30DaysOfJavaScript + +//3 - Escreva um comentário de várias linhas que diga, comentários faz seu código ser fácil de ler, fácil de reusar e informátivo +/* +comentários faz seu código ser fácil de ler, fácil de reusar e informátivo +*/ + +//4 - Crie um arquivo variavel.js e declare variáveis e atribua uma string, boolean, undefined e null + +//5 - Crie um arquivo tiposdedados.js e use o JavaScript typeof operador para verificar diferentes tipos de dados. Verifique o tipo de dado de cada variável + +//6 - Declare quatro variáveis sem atribuir valores +let empresa; +let corBlusa; +let preco; +let diaDaSemana; + +//7 - Declare quatro variáveis e atribuir valores +let celular = "Samsung"; +let minhaIdade = 27; +let corOlhos = "castanho"; +let estadoCivil = "solteiro"; + +//8 - Declare variáveis para armazenar seu primeiro nome, ultimo nome, estado civil, país e idade em multiplas linhas +let firstname = "Beatriz"; +let lastname = "Almeida"; +let maritalStatus = "solteira"; +let country = "Brasil"; +let age = 27; + +//9 - Declare variáveis para armazenar seu primeiro nome, ultimo nome, estado civil, país e idade em uma única linha +let firstName = "Beatriz", + lastName = "Almeida", + maritalStatus2 = "solteira", + country2 = "Brasil", + age2 = 27; + +//10 - Declare duas variáveis minhaIdade e suaIdade e atribua valores iniciais e mostre no console do navegador. +let minhaIdade2 = 27; +console.log("Minha idade é: " + minhaIdade2); +let suaIdade = 30; +console.log("Sua idade é: " + suaIdade); diff --git a/Portuguese/Dia_03_Booleanos_Operadores_Data/03_day_starter/scripts/tiposdedados-3.js b/Portuguese/Dia_03_Booleanos_Operadores_Data/03_day_starter/scripts/tiposdedados-3.js new file mode 100644 index 000000000..53fe3401a --- /dev/null +++ b/Portuguese/Dia_03_Booleanos_Operadores_Data/03_day_starter/scripts/tiposdedados-3.js @@ -0,0 +1,12 @@ +//5 - Crie um arquivo tiposdedados.js e use o JavaScript typeof operador para verificar diferentes tipos de dados. Verifique o tipo de dado de cada variável +typeof "Brasil"; +console.log(typeof "Brasil"); // string + +typeof false; +console.log(typeof false); // boolean + +typeof undefined; +console.log(typeof undefined); // undefined + +typeof null; +console.log(typeof null); // object diff --git a/Portuguese/Dia_03_Booleanos_Operadores_Data/03_day_starter/scripts/variavel-3.js b/Portuguese/Dia_03_Booleanos_Operadores_Data/03_day_starter/scripts/variavel-3.js new file mode 100644 index 000000000..128de7fba --- /dev/null +++ b/Portuguese/Dia_03_Booleanos_Operadores_Data/03_day_starter/scripts/variavel-3.js @@ -0,0 +1,5 @@ +//4 - Crie um arquivo variavel.js e declare variáveis e atribua uma string, boolean, undefined e null +let país = "Brasil"; +let casado = false; +let variavel = undefined; +let nulo = null; diff --git a/Portuguese/Dia_04_Condicionais/04_day_starter/exercices- 4.js b/Portuguese/Dia_04_Condicionais/04_day_starter/exercices- 4.js new file mode 100644 index 000000000..daf5e3f1b --- /dev/null +++ b/Portuguese/Dia_04_Condicionais/04_day_starter/exercices- 4.js @@ -0,0 +1,140 @@ +//1- Obtenha a entrada do usuário usando prompt(“Digite sua idade:”). Se o usuário tiver 18 anos ou mais, dê o feedback: 'Você tem idade suficiente para dirigir', mas se não tiver +// 18 anos, dê outro feedback indicando quantos anos ele precisa esperar para completar 18 anos +let idade = prompt("Digite sua idade:"); +if (idade >= 18) { + console.log("Você tem idade suficiente para dirigir"); +} else { + let anosRestantes = 18 - idade; + console.log( + `Você precisa esperar mais ${anosRestantes} anos para completar 18 anos` + ); +} + +//2 - Compare os valores de myAge e yourAge usando if … else. Com base na comparação, registre o resultado no console indicando quem é mais velho (eu ou você). +// Use prompt(“Digite sua idade:”) para obter a idade como entrada. +let myAge = 27; +let yourAge = prompt("Digite sua idade:"); +if (myAge > yourAge) { + console.log("Eu sou mais velho que você"); +} else if (myAge < yourAge) { + console.log("Você é mais velho que eu"); +} else { + console.log("Nós temos a mesma idade"); +} +//3 - Se a for maior que b, retorne 'a é maior que b' senão 'a é menor que b'. Tente implementar de duas maneiras +//usando if else +//operador ternário. +let a = 4; +let b = 3; +if (a > b) { + console.log("a é maior que b"); +} else { + console.log("a é menor que b"); +} +// Usando operador ternário +let resultado = a > b ? "a é maior que b" : "a é menor que b"; +console.log(resultado); + +//4 - Números pares são divisíveis por 2 e o resto é zero. Como você verifica se um número é par ou não usando JavaScript? +//Digite um número: 2 +//2 é um número par +let numero = prompt("Digite um número:"); +if (numero % 2 === 0) { + console.log(`${numero} é um número par`); +} else { + console.log(`${numero} é um número ímpar`); +} + +//Digite um número: 9 +//9 é um número ímpar. +let numero2 = prompt("Digite um número:"); +if (numero2 % 2 === 0) { + console.log(`${numero2} é um número par`); +} else { + console.log(`${numero2} é um número ímpar`); +} + +//5 - Escreva um código que possa dar notas aos alunos de acordo com suas pontuações: +//80-100, A +//70-89, B +//60-69, C +//50-59, D +//0-49, F +let nota = prompt("Digite a pontuação do aluno:"); +if (nota >= 80 && nota <= 100) { + console.log("A"); +} else if (nota >= 70 && nota < 80) { + console.log("B"); +} else if (nota >= 60 && nota < 70) { + console.log("C"); +} else if (nota >= 50 && nota < 60) { + console.log("D"); +} else if (nota >= 0 && nota < 50) { + console.log("F"); +} else { + console.log("Nota inválida"); +} +//6 - Verifique se um dia é dia de semana ou um dia útil. Seu script receberá o dia como entrada. +/* Qual é o dia hoje? Sábado + Sábado é um fim de semana. + + Qual é o dia hoje? sábaDo + Sábado é um fim de semana. + + Qual é o dia hoje? Sexta-feira + Sexta-feira é um dia útil. + + Qual é o dia hoje? sexTA-feiRa + Sexta-feira é um dia útil.*/ + +let dia = prompt("Qual é o dia hoje?").toLowerCase(); +if ( + dia === "segunda-feira" || + dia === "terça-feira" || + dia === "quarta-feira" || + dia === "quinta-feira" || + dia === "sexta-feira" +) { + console.log(`${dia.charAt(0).toUpperCase() + dia.slice(1)} é um dia útil.`); +} else if (dia === "sábado" || dia === "domingo") { + console.log( + `${dia.charAt(0).toUpperCase() + dia.slice(1)} é um fim de semana.` + ); +} else { + console.log("Dia inválido. Por favor, digite um dia da semana válido."); +} +//7 - screva um programa que informe o número de dias em um mês. +/* Digite um mês: Janeiro + Janeiro tem 31 dias. + + Digite um mês: JANEIRO + Janeiro tem 31 dias + + Digite um mês: Fevereiro + Fevereiro tem 28 dias. + + Digite um mês: FEvereiro + Fevereiro tem 28 dias.*/ +let mes = prompt("Digite um mês:").toLowerCase(); +switch (mes) { + case "janeiro": + case "março": + case "maio": + case "julho": + case "agosto": + case "outubro": + case "dezembro": + console.log(`${mes.charAt(0).toUpperCase() + mes.slice(1)} tem 31 dias.`); + break; + case "abril": + case "junho": + case "setembro": + case "novembro": + console.log(`${mes.charAt(0).toUpperCase() + mes.slice(1)} tem 30 dias.`); + break; + case "fevereiro": + console.log(`${mes.charAt(0).toUpperCase() + mes.slice(1)} tem 28 dias.`); + break; + default: + console.log("Mês inválido. Por favor, digite um mês válido."); +} diff --git a/Portuguese/Dia_05_Arrays/exercices-5.js b/Portuguese/Dia_05_Arrays/exercices-5.js new file mode 100644 index 000000000..cd0a7b5b4 --- /dev/null +++ b/Portuguese/Dia_05_Arrays/exercices-5.js @@ -0,0 +1,149 @@ +/*const countries = [ + 'Albania', + 'Bolivia', + 'Canada', + 'Denmark', + 'Ethiopia', + 'Finland', + 'Germany', + 'Hungary', + 'Ireland', + 'Japan', + 'Kenya', +]; + +const webTechs = [ + 'HTML', + 'CSS', + 'JavaScript', + 'React', + 'Redux', + 'Node', + 'MongoDB', +];*/ + +//Declare um array vazio; +let arrayVazio = []; + +//Declare um array com mais de 5 elementos; +let arrayCincoElementos = ["banana", "maçã", "laranja", "uva", "pera", "kiwi"]; + +//Encontre o comprimento do seu array; +let comprimentoArray = arrayCincoElementos.length; +console.log("Comprimento do array:", comprimentoArray); + +//Obtenha o primeiro item, o item do meio e o último item do array; +let primeiroItem = arrayCincoElementos[0]; +let itemMeio = arrayCincoElementos[Math.floor(arrayCincoElementos.length / 2)]; +let ultimoItem = arrayCincoElementos[arrayCincoElementos.length - 1]; +console.log("Primeiro item:", primeiroItem); +console.log("Item do meio:", itemMeio); +console.log("Último item:", ultimoItem); + +//Declare um array chamado mixedDataTypes, coloque diferentes tipos de dados no array e encontre o comprimento do array. O tamanho do array deve ser maior que 5; +let mixedDataTypes = [ + 42, + "texto", + true, + null, + undefined, + { chave: "valor" }, + [1, 2, 3], +]; +let comprimentoMixedDataTypes = mixedDataTypes.length; +console.log("Comprimento do array mixedDataTypes:", comprimentoMixedDataTypes); + +//Declare uma variável de array nomeada itCompanies e atribua valores iniciais como Facebook, Google, Microsoft, Apple, IBM, Oracle e Amazon; +let itCompanies = [ + "Facebook", + "Google", + "Microsoft", + "Apple", + "IBM", + "Oracle", + "Amazon", +]; + +//Imprima o array usando console.log(); +console.log("Empresas de TI:", itCompanies); + +//Imprima o número de empresas no array; +let numeroEmpresas = itCompanies.length; +console.log("Número de empresas de TI:", numeroEmpresas); + +//Imprima a primeira empresa, a empresa do meio e a última empresa; +let primeiraEmpresa = itCompanies[0]; +let empresaMeio = itCompanies[Math.floor(itCompanies.length / 2)]; +let ultimaEmpresa = itCompanies[itCompanies.length - 1]; +console.log("Primeira empresa:", primeiraEmpresa); +console.log("Empresa do meio:", empresaMeio); +console.log("Última empresa:", ultimaEmpresa); + +//Imprima cada empresa; +itCompanies.forEach((empresa) => { + console.log("Empresa:", empresa); +}); +//Mude cada nome da empresa para maiúsculas uma a uma e imprima-as; +itCompanies = itCompanies.map((empresa) => empresa.toUpperCase()); +console.log("Empresas em maiúsculas:", itCompanies); + +//Imprima o array como uma frase: Facebook, Google, Microsoft, Apple, IBM, Oracle e Amazon são grandes empresas de TI. +console.log( + `${itCompanies.slice(0, -1).join(", ")} e ${itCompanies.slice( + -1 + )} são grandes empresas de TI.` +); + +//Verifique se uma determinada empresa existe no array itCompanies. Se existir, retorne a empresa, caso contrário, retorne uma mensagem de empresa não encontrada; +let empresaParaVerificar = "Google"; +if (itCompanies.includes(empresaParaVerificar)) { + console.log(`${empresaParaVerificar} existe no array.`); +} else { + console.log(`${empresaParaVerificar} não foi encontrada no array.`); +} + +//Filtre empresas que têm mais de um 'o' sem usar o método filter; +let empresasComMaisDeUmO = []; +for (let empresa of itCompanies) { + if ((empresa.match(/o/g) || []).length > 1) { + empresasComMaisDeUmO.push(empresa); + } +} +console.log("Empresas com mais de um 'o':", empresasComMaisDeUmO); + +//Ordene o array usando o método sort(); +itCompanies.sort(); +console.log("Empresas ordenadas:", itCompanies); + +//Reverta o array usando o método reverse(); +itCompanies.reverse(); +console.log("Empresas revertidas:", itCompanies); + +//Fatie os primeiros 3 empresas do array; +let primeirasTresEmpresas = itCompanies.slice(0, 3); +console.log("Primeiras 3 empresas:", primeirasTresEmpresas); + +//Fatie as últimas 3 empresas do array; +let ultimasTresEmpresas = itCompanies.slice(-3); +console.log("Últimas 3 empresas:", ultimasTresEmpresas); + +//Fatie a empresa ou empresas do meio do array; +let meioIndex = Math.floor(itCompanies.length / 2); +let empresasMeio = itCompanies.slice(meioIndex, meioIndex + 1); +console.log("Empresa ou empresas do meio:", empresasMeio); + +//Remova a primeira empresa do array; +itCompanies.shift(); +console.log("Após remover a primeira empresa:", itCompanies); + +//Remova a empresa ou empresas do meio do array; +itCompanies.splice(meioIndex, 1); +console.log("Após remover a empresa do meio:", itCompanies); + +//Remova a última empresa do array; +itCompanies.pop(); +console.log("Após remover a última empresa:", itCompanies); + +//Remova todas as empresas de TI; +itCompanies = []; +console.log("Após remover todas as empresas de TI:", itCompanies);