From 720147a2eec470aedaa5c14f56a913fe59e836db Mon Sep 17 00:00:00 2001 From: pachi Date: Fri, 30 Apr 2021 11:38:59 -0400 Subject: [PATCH] pt transl 2.1 --- .../1-data-types/translations/README.pt.md | 195 ++++++++++++++++++ 1 file changed, 195 insertions(+) create mode 100644 2-js-basics/1-data-types/translations/README.pt.md diff --git a/2-js-basics/1-data-types/translations/README.pt.md b/2-js-basics/1-data-types/translations/README.pt.md new file mode 100644 index 00000000..2e6ca522 --- /dev/null +++ b/2-js-basics/1-data-types/translations/README.pt.md @@ -0,0 +1,195 @@ +# Noções básicas de JavaScript: Tipos de dados + +![Noções básicas de JavaScript: Tipos de dados](/sketchnotes/webdev101-js-datatypes.png) +> Sketchnote por [Tomomi Imura](https://twitter.com/girlie_mac) + +## Quiz Pré-Aula +[Quiz Pré-Aula](https://nice-beach-0fe9e9d0f.azurestaticapps.net/quiz/7) + +Esta lição cobre o básico do JavaScript, a linguagem que fornece interatividade na web. + +[![Tipos de dados em JavaScriptt](https://img.youtube.com/vi/JNIXfGiDWM8/0.jpg)](https://youtube.com/watch?v=JNIXfGiDWM8 "Tipos de dados em JavaScript") + + +Vamos começar com variáveis e os tipos de dados que as preenchem! + +## Variáveis + +Variáveis armazenam valores que podem ser usados e alterados em todo o código. + +A criação e **declaração** de uma variável tem a seguinte sintaxe **[palavra-chave] [nome]**. É composto de duas partes: + +- **Palavra-chave**. Palavras-chave podem ser `let` ou` var`. + +> Nota, a palavra-chave `let` foi introduzida no ES6 e dá a sua variável o chamado _block scope_ ou escopos do bloco. É recomendado que você use `let` sobre `var`. Abordaremos os escopos do bloco mais detalhadamente em partes futuras. +- **O nome da variável**, este é um nome que você escolhe. + +### Tarefa - trabalhando com variáveis + +1. **Declare uma variável**. Vamos declarar uma variável usando a palavra-chave `let`: + + ```javascript + let minhaVariável; + ``` + + `minhaVariável` agora foi declarada usando a palavra-chave`let`. Atualmente não tem um valor. + +1. **Atribua um valor**. Armazene um valor em uma variável com o operador `=`, seguido pelo valor esperado. + ```javascript + minhaVariável = 123; + ``` + + > Nota: o uso de `=` nesta lição significa que fazemos uso de um "operador de atribuição", usado para definir um valor para uma variável. Não denota igualdade. + + `minhaVariável` agora foi *inicializada* com o valor 123. + +1. **Refatorar**. Substitua seu código pela seguinte instrução. + + ```javascript + let minhaVariável = 123; + ``` + + O acima é chamado de _inicialização explícita_ quando uma variável é declarada e recebe um valor ao mesmo tempo. + +1. **Altere o valor da variável**. Altere o valor da variável da seguinte maneira: + + ```javascript + minhaVariável = 321; + ``` + + Uma vez que uma variável é declarada, você pode alterar seu valor em qualquer ponto do seu código com o operador `=` e o novo valor. + + ✅ Tente isso! Você pode escrever JavaScript diretamente no seu navegador. Abra uma janela do navegador e navegue até Ferramentas do desenvolvedor. No console, você encontrará um prompt; digite `let myVariable = 123`, pressione return e, em seguida, digite` myVariable`. O que acontece? Observe que você aprenderá mais sobre esses conceitos nas lições subsequentes. + +## Constantes + +A declaração e a inicialização de uma constante seguem os mesmos conceitos de uma variável, com exceção da palavra-chave `const`. Normalmente, as constantes são declaradas com todas as letras maiúsculas. + +```javascript +const MY_VARIABLE = 123; +``` + +As constantes são semelhantes às variáveis, com duas exceções: + +- **Deve ter um valor**. As constantes devem ser inicializadas ou ocorrerá um erro ao executar o código. +- **A referência não pode ser alterada**. A referência de uma constante não pode ser alterada depois de inicializada, ou ocorrerá um erro ao executar o código. Vejamos dois exemplos: + - **Valor simples**. O seguinte NÃO é permitido: + + ```javascript + const PI = 3; + PI = 4; // NÃO é permitido + ``` + + - **A referência do objeto está protegida**. O seguinte NÃO é permitido. + + ```javascript + const obj = { a: 3 }; + obj = { b: 5 } // NÃO é permitido + ``` + + - **O valor do objeto não está protegido**. O seguinte é permitido: + + ```javascript + const obj = { a: 3 }; + obj.a = 5; // permitido + ``` + + Acima você está alterando o valor do objeto, mas não a referência em si, o que o torna permitido. + + > Nota, um `const` significa que a referência está protegida contra reatribuição. O valor não é _imutável_ e pode mudar, especialmente se for uma construção complexa como um objeto. + +## Tipos de Dados + +As variáveis podem armazenar muitos tipos diferentes de valores, como números e texto. Esses vários tipos de valores são conhecidos como **tipo de dados**. Os tipos de dados são uma parte importante do desenvolvimento de software porque ajudam as pessoas desenvolvedoras a tomar decisões sobre como o código deve ser escrito e como o software deve ser executado. Além disso, alguns tipos de dados têm recursos exclusivos que ajudam a transformar ou extrair informações adicionais em um valor. + +✅ Os tipos de dados também são chamados de primitivos de dados JavaScript, pois são os tipos de dados de nível mais baixo fornecidos pela linguagem. Existem 6 tipos de dados primitivos: string, number, bigint, boolean, undefined, e symbol. Reserve um minuto para visualizar o que cada uma dessas primitivas pode representar. O que é uma `zebra`? Que tal `0`? `true`? + +### Números (Numbers) + +Na seção anterior, o valor de `myVariable` era um tipo de dado numérico. + +`let myVariable = 123;` + +As variáveis podem armazenar todos os tipos de números, incluindo decimais ou números negativos. Os números também podem ser usados com operadores aritméticos, abordados na [próxima seção](#operadores). + +### Operadores aritméticos + +Existem vários tipos de operadores para usar ao executar funções aritméticas, e alguns estão listados aqui: + +| Símbolo | Descrição | Examplo | +| ------ | ------------------------------------------------------------------------ | -------------------------------- | +| `+` | **Adição**: Calcula a soma de dois números | `1 + 2 //a resposta esperada é 3` | +| `-` | **Subitração**: Calcula a diferença de dois números | `1 - 2 //a resposta esperada é -1` | +| `*` | **Multiplicação**: Calcula o produto de dois números | `1 * 2 //a resposta esperada é 2` | +| `/` | **Divisão**: Calcula o quociente de dois números | `1 / 2 //a resposta esperada é 0.5` | +| `%` | **Restante**: Calcula o resto da divisão de dois números | `1 % 2 //a resposta esperada é 1` | + +✅ Tente isso! Tente uma operação aritmética no console do seu navegador. Os resultados surpreendem você? + +### Strings + +Strings são conjuntos de caracteres que residem entre aspas simples ou duplas. + +- `'Isso é uma string'` +- `"Isso também é uma string"` +- `let myString = 'Este é um valor de string armazenado em uma variável';` + +Lembre-se de usar aspas ao escrever uma string, caso contrário, o JavaScript assumirá que é um nome de variável. + +### Formatando Strings + +Strings são textuais e requerem formatação de vez em quando. + +Para **concatenar** duas ou mais strings, ou juntá-las, use o operador `+`. + +```javascript +let myString1 = "Olá"; +let myString2 = "Mundo"; + +myString1 + myString2 + "!"; //OláMundo! +myString1 + " " + myString2 + "!"; //Olá Mundo! +myString1 + ", " + myString2 + "!"; //Olá, Mundo! + +``` + +✅ Por que `1 + 1 = 2` em JavaScript, mas` '1' + '1' = 11? `Pense nisso. Que tal `'1' + 1`? + +**Template literals (Literais de modelo)** são outra maneira de formatar strings, exceto em vez de aspas, o crase é usado. Qualquer coisa que não seja texto simples deve ser colocado dentro dos espaços reservados `$ {}`. Isso inclui todas as variáveis que podem ser strings. + +```javascript +let myString1 = "Olá"; +let myString2 = "Mundo"; + +`${myString1} ${myString2}!` //Olá Mundo! +`${myString1}, ${myString2}!` //Olá, Mundo! +``` + +Você pode atingir seus objetivos de formatação com qualquer um dos métodos, mas os Template literals respeitarão todos os espaços e quebras de linha. + +✅ Quando você usaria um literal de modelo em vez de uma string simples? + +### Booleanos + +Os booleanos podem ter apenas dois valores: `true` ou` false`. Os booleanos podem ajudar a tomar decisões sobre quais linhas de código devem ser executadas quando certas condições são atendidas. Em muitos casos, [operadores](#operadores) auxiliam na configuração do valor de um booleano e você freqüentemente notará e escreverá variáveis sendo inicializadas ou seus valores sendo atualizados com um operador. + +- `let myTrueBool = true` +- `let myFalseBool = false` + +✅ Uma variável pode ser considerada 'true' se for avaliada como um booleano `true`. Curiosamente, em JavaScript, [todos os valores são verdadeiros, a menos que definidos como falsos](https://developer.mozilla.org/docs/Glossary/Truthy). + +--- + +## 🚀 Desafio + +JavaScript é notório por suas maneiras surpreendentes de lidar com tipos de dados ocasionalmente. Pesquise sobre essas 'pegadinhas'. Por exemplo: a diferenciação de maiúsculas e minúsculas pode afetar! Tente isto em seu console: `let age = 1; deixe Idade = 2; age == Age` (resolve `false` - por quê?). Que outras dicas você pode encontrar? + +## Quiz Pós-Aula +[Quiz Pós-Aula](https://nice-beach-0fe9e9d0f.azurestaticapps.net/quiz/8) + +## Revisão e autoestudo + +Dê uma olhada [nessa lista de exercícios de JavaScript](https://css-tricks.com/snippets/javascript/) e tente um. O que você aprendeu? + +## Tarefa + +[Prática de Tipos de Dados](assignment.pt.md)