 |
|
Você está aqui: JavaScript ::: ECMAScript 8 - JavaScript 8 - ES8 - ECMAScript 2017 ::: Programação Orientada a Objetos |
Obtendo um vetor chave/valor das propriedades de um objeto usando o método Object.entries()Quantidade de visualizações: 1040 vezes |
|
O método entries(), adicionado ao objeto Object no ES2017 (ECMAScript 8), é usado quando precisamos obter todas as propriedades próprias de um objeto, ou seja, propriedades não herdadas via prototype. A coleção é retornada como uma matriz (array) chave/valor. Chave contém o nome da propriedade e valor contém o valor guardado na propriedade. Veja um exemplo no qual criamos uma classe Aluno contendo as propriedades nome, matricula e curso. Veja que aqui eu usei construtor de função para a criação de um novo objeto chamado a. Em seguida chamamos Object.entries() neste objeto para obter os nomes e valores de suas propriedades. Segue o código: ----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------
<script type="text/javascript">
// definição da classe Aluno
function Aluno(nome, matricula, curso){
this.nome = nome;
this.matricula = matricula;
this.curso = curso;
// método que permite retornar o nome do aluno
this.getNome = function(){
return this.nome;
};
}
// cria um novo objeto da classe Aluno
var a = new Aluno("Osmar J. Silva", 1234, "Ciência da Computação");
// vamos obter as propriedades do objeto a como uma matriz chave/valor
var entradas = Object.entries(a);
// vamos agora percorrer as propriedades e seus valores
for(var i = 0; i < entradas.length; i++){
window.alert("Propriedade: " + entradas[i][0] + " - " +
"Valor: " + entradas[i][1]);
}
</script>
É importante observar que o nome da função getNome() também é adicionada ao vetor retornado pelo método Object.entries(). |
 Link para compartilhar na Internet ou com seus amigos: |
JavaScript ::: Dicas & Truques ::: Geometria, Trigonometria e Figuras Geométricas |
Como testar se um ponto está dentro de um círculo em JavaScript - Desenvolvimento de Games com JavaScriptQuantidade de visualizações: 1501 vezes |
|
Quando estamos trabalhando com computação gráfica, geometria e trigonometria ou desenvolvimento de jogos em JavaScript, é comum precisarmos verificar se um determinado ponto (uma coordenada x, y) está contido dentro de um círculo. Para melhor entendimento, veja a imagem a seguir:  Veja que temos um círculo com raio igual a 115 e com centro nas coordenadas (x = 205; y = 166). Temos também dois pontos. O ponto vermelho está nas coordenadas (x = 140; y = 90) e o ponto azul está nas coordenadas (x = 330; y = 500. Como podemos ver na imagem, o ponto vermelho está dentro do círculo, enquanto o ponto azul está fora. E nosso intenção nesta dica é escrever o código JavaScript que permite fazer essa verificação. Tenha em mente que está técnica é muito útil para o teste de colisões no desenvolvimento de games. Veja o código completo para o exemplo: ----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------
<!doctype html>
<html>
<head>
<title>Desenvolvimento de Games usando HTML5 e JavaScript</title>
</head>
<body>
<script type="text/javascript">
// vamos declarar a classe Circulo
class Circulo{
constructor(xc, yc, raio){
this.xc = xc; // x do centro
this.yc = yc; // y do centro
this.raio = raio; // raio do círculo
}
}
// agora vamos declarar a classe Ponto
class Ponto{
constructor(x, y){
this.x = x; // coordenada x
this.y = y; // coordenada y
}
}
// vamos criar um objeto Circulo
var c = new Circulo(90, 50, 115);
// vamos criar um objeto Ponto
var p = new Ponto(140, 90);
// vamos verificar se o ponto está dentro do
// círculo
var dx = p.x - c.xc;
var dy = p.y - c.yc;
if((Math.pow(dx, 2) + Math.pow(dy, 2)) < Math.pow(c.raio, 2)){
document.writeln("O ponto está dentro do círculo");
}
else{
document.writeln("O ponto NÃO está dentro do círculo");
}
</script>
</body>
</html>
Ao executar este código nós teremos o seguinte resultado: O ponto está dentro do círculo. Experimente com círculos de raios e coordenadas centrais diferentes e também com pontos em várias coordenadas e veja como os resultados são interessantes. |
JavaScript ::: Dicas & Truques ::: Strings e Caracteres |
Como testar se uma string começa com uma determinada substring em JavaScript usando a função startsWith()Quantidade de visualizações: 2058 vezes |
|
O método startsWith() da linguagem JavaScript foi adicionado ao objeto String na revisão ECMAScript 2015, ou ES6, também chamado de ECMAScript 6. Este método é chamado diretamente em uma variável do tipo string e retorna true se a palavra, frase ou texto começar com uma substring específica e false em caso contrário. Veja um exemplo no qual verificamos se uma frase começa com a palavra "JavaScript": ----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------
<script type="text/javascript">
var frase = "JavaScript é uma das melhores linguagens";
if(frase.startsWith("JavaScript")){
document.writeln("A frase começa com a palavra JavaScript");
}
else{
document.writeln("A frase não começa com a palavra JavaScript");
}
</script>
Ao executarmos este código JavaScript nós teremos o seguinte resultado: A frase começa com a palavra JavaScript É importante ter em mente que a função startsWith() diferente letras maiúsculas de letras minúsculas. |
JavaScript ::: Dicas & Truques ::: Arrays e Matrix (Vetores e Matrizes) |
Como somar os elementos de um array em JavaScript usando a função reduce()Quantidade de visualizações: 455 vezes |
|
Nesta dica mostrarei como podemos usar a função reduce() do JavaScript para somar todos os elementos de um vetor de inteiros. Lembre-se de que a função reduce() foi introduzida no ECMAScript5 (ES5), também chamado de JavaScript 2009. Veja a página HTML completa para o exemplo: ----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------
<!doctype html>
<html>
<head>
<title>Estudos JavaScript</title>
</head>
<body>
<script type="text/javascript">
// vamos criar um vetor de inteiros
var valores = new Array(7, 2, 1, 3, 5);
document.write("Valores do array: " + valores
+ "<br>");
// agora vamos usar a função para somar
// os elementos do vetor
var res = valores.reduce((soma, valor) => soma
+ valor, 0);
document.write("A soma dos elementos é: " + res);
</script>
</body>
</html>
Ao executar este código JavaScript nós teremos o seguinte resultado: Valores do array: 7,2,1,3,5 A soma dos elementos é: 18 Neste exemplo eu coloquei a função que será executada para cada elemento do array diretamente dentro do corpo da função reduce(). Podemos também colocar esta função do lado de fora. Veja: ----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------
<script type="text/javascript">
// função que será chamada pela função reduce()
function somar_elementos(soma, valor) {
return soma + valor;
}
// vamos criar um vetor de inteiros
var valores = new Array(7, 2, 1, 3, 5);
document.write("Valores do array: " + valores
+ "<br>");
// agora vamos usar a função para somar
// os elementos do vetor
var res = valores.reduce(somar_elementos, 0);
document.write("A soma dos elementos é: " + res);
</script>
|
Desafios, Exercícios e Algoritmos Resolvidos de JavaScript |
Veja mais Dicas e truques de JavaScript |
Dicas e truques de outras linguagens |
Códigos Fonte |
 Software de Gestão Financeira com código fonte em PHP, MySQL, Bootstrap, jQuery - Inclui cadastro de clientes, fornecedores e ticket de atendimentoDiga adeus às planilhas do Excel e tenha 100% de controle sobre suas contas a pagar e a receber, gestão de receitas e despesas, cadastro de clientes e fornecedores com fotos e histórico de atendimentos. Código fonte completo e funcional, com instruções para instalação e configuração do banco de dados MySQL. Fácil de modificar e adicionar novas funcionalidades. Clique aqui e saiba mais |
 Controle de Estoque completo com código fonte em PHP, MySQL, Bootstrap, jQuery - 100% funcional e fácil de modificar e implementar novas funcionalidadesTenha o seu próprio sistema de controle de estoque web. com cadastro de produtos, categorias, fornecedores, entradas e saídas de produtos, com relatórios por data, margem de lucro e muito mais. Código simples e fácil de modificar. Acompanha instruções para instalação e criação do banco de dados MySQL. Clique aqui e saiba mais |
Linguagens Mais Populares |
|
1º lugar: Java |
