Front end 2 Flashcards
(47 cards)
CSS
Grid no bootstrap: há a divisão da tela em _______ colunas
12
HTML
Emmet: div3>div3
Qual será o output?
3 divs com 3 divs cada
Javascript
Declarar uma variável no JavaScript sem const ou let tornará ela ____ no escopo
Global
Entre const e let qual delas pode ser sobrescrita?
Let
Javascript
Javascript
let idade (aqui eu ????)
idade = 2 (aqui eu ????)
declarei
atribui
Javascript
Array
const fruits = [“Banana”, “Orange”, “Apple”, “Mango”, “Kiwi”];
fruits.splice(2, 2);
Qual será o output?
Banana, Orange, Kiwi
Javascript
Para que serve o package.json?
Arquivo que contém a descrição e metadados funcionais sobre o projeto (nome, versão etc)
Javascript
O que é NPM? Para que serve?
Node Package Manager, o NPM é um poderoso gerenciador de pacotes utilizado para administrar as bibliotecas e frameworks utilizados em uma aplicação
Javascript
Quando criamos um object no Javascript, o mesmo reserva uma memória (____) e não reserva os dados do objeto mas sim o ________ da memória referente ao objeto.
Diferente quando criamos uma variável que comporta um tipo primitivo. Neste caso o JavaScript cria uma _____
heap
endereço
cópia
Javascript
Qual a diferença de null e undefined
null = ausência intencional
undefined = não declarado/não existe
Javascript
Assessores javascript
O ___ permite buscar informação de um objeto, mas não possibilita editar/atribuir valores
get
Javascript
No seguinte código, quais membros do objeto pessoa são propriedades e quais são métodos?
~~~
var pessoa = {
nome: [‘Bob’, ‘Smith’],
idade: 32,
sexo: ‘masculino’,
interesses: [‘música’, ‘esquiar’],
bio: function() {
(…)
}
nome, idade, sexo e interesses são propriedades (dados)
bio e saudacao são métodos (funções)
Javascript
Temos os dois objetos a seguir:
var produto1 = {
nome: "Blusa",
preco: 120, calculaDesconto: function(){
//10% de desconto
return this.preco * 0.1;
}
};
var produto2 = {
nome: "Calça",
preco: 300,
calculaDesconto: function(){
//10% de desconto
return this.preco * 0.1;
}
};
produto1.calculaDesconto(); Qual será o output?
produto2.calculaDesconto(); Qual será o output?
12 e 30
1) Como poderíamos resumir o código dos objetos a seguir usando construtores?
2) Como criaríamos efetivamente estes produtos?
3) Como seria a chamada do método calculaDesconto()?
Temos os dois objetos a seguir:
var produto1 = {
nome: "Blusa";
preco: 120;
};
var produto2 = {
nome: "Calça";
preco: 300;
Nova maneira (utilizando class):
1)
class Produto {
constructor(nomeEscolhido, precoEscolhido) {
this.nome = nomeEscolhido;
this.preco = precoEscolhido;
}
2)
var produto1 = new Produto(‘Blusa’, 120);
var produto2 = new Produto(‘Calça’, 300);
Qual a função do super no código abaixo?
class class Pessoa {
constructor(nome, idade, sexo) {
this.nome = nome;
this.idade = idade;
this.sexo = sexo;
}
}
class Matheus extends Pessoa {
constructor(nomeDiferente, algumaIdade, meuSobrenome) {
super(nomeDiferente, algumaIdade);
this.sobrenome = meuSobrenome;
}
}
Ele serve para a classe Matheus (filha) aproveitar propriedades da classe mãe (Pessoa) e evitar repetição de código.
Para que serve a palavra extends no código abaixo?
class Square extends Polygon {
constructor(length) {
}
}
Ela possibilita extender as propriedades da classe mãe (Square) em um objeto filho.
Qual o problema com o código a seguir?
class Cliente {
nome;
cpf;
}
new Cliente("Ricardo", 11122233309);
Sem declarar uma variável para a nova classe “Cliente” eu não consigo acessar posteriormente
O correto seria (const ou let):
const cliente1 = new Cliente("Ricardo", 11122233309);
Quando criamos um objeto estamos (?)ando uma classe.
A classe funciona como um (?), no qual o objeto é criado (bolo criado a partir de uma forma).
instanciando
molde
Qual será o output da expressão a seguir?
{let a = 2;
console.log(a -= 3);
}
{let a = 2;
console.log(a += 3);
}
Console 1: -1
Console 2: 5
-= é sinal de atribuição, serve para diminuir e += soma
Atenção: sem as chaves o VS Code dá erro, pois precisamos encapular a variável em bloco
Atributo privado:
class ContaCorrente {
agencia;
saldo;
}
contaCorrenteRicardo.#saldo = 0;
Qual o output?
SyntaxError: Private field ‘#saldo’ must be declared in an enclosing class
Quando colocamos cerquilha, o JS entende que é privado
Atributos privados (usando cerquilha)
Qual será o output do console.log?
class ContaCorrente {
agencia;
#saldo = 0;
}
const contaCorrenteRicardo = new ContaCorrente();
contaCorrenteRicardo.agencia = 1001;
console.log(contaCorrenteRicardo);
Output:
ContaCorrente { agencia: 1001 }
O atributo saldo fica privado quando colocamos cerquilha, somente aparece agencia. Essa síntaxe não é adotada ainda na linguagem, então é bom evitar.
Atributos privados usando underline _
class ContaCorrente {
agencia;
_saldo = 0; // Precisamos estipular um valor
sacar (valor) {
if (this._saldo >= valor) {
this._saldo -= valor;
}
}
depositar(valor) {
if (valor > 0) {
this._saldo += valor;
}
}
}
A convenção é que atributos com underline não devem ser acessados fora da (?), apesar de conseguirmos modificá-los (nesse caso só modificamos usando os métodos sacar e depositar, que estão presentes na (?)
Classe (2)
Qual o problema com o undefined do output?
Há uma maneira de corrigir?
class Cliente{
nome;
cpf;
}
class ContaCorrente {
agencia;
_saldo = 0;
sacar (valor) {
if (this._saldo >= valor) {
this._saldo -= valor;
}
}
depositar(valor) {
if (valor > 0) {
this._saldo += valor;
}
} }
const contaCorrenteRicardo = new ContaCorrente;
const valorSacado = contaCorrenteRicardo.sacar(50);
console.log(valorSacado);
Output: undefined
O problema é que ao usarmos o símbolo de atribuição = no “const valorSacado = contaCorrenteRicardo.sacar(50);”
Estamos informando que o valorSacado será igual ao valor do método/função “sacar” que, no presente caso, não “devolve” qualquer valor ao ser chamado.
Utilizamos o return:
sacar (valor) {
if (this._saldo >= valor) {
this._saldo -= valor;
return valor;
}
}
Técnica de (?): o “this._saldo += valor” será executado?
class Cliente{
nome;
cpf;
}
class ContaCorrente {
agencia;
_saldo = 0;
sacar (valor) {
if (this._saldo >= valor) {
this._saldo -= valor;
return valor;
}
}
depositar(valor) {
if (valor <= 0) {
return;
}
this._saldo += valor;
}
}
const contaCorrenteRicardo = new ContaCorrente;
const deposito = contaCorrenteRicardo.depositar(-50);
console.log(contaCorrenteRicardo._saldo);
Early return
Facilita a legibilidade do código, já trazendo o que eu não quero (depósito zero ou negativo)
E não, o return interrompe a execução do this._saldo += saldo
