Tutorial de JS

JS HOME Introdução JS JS Para onde Saída JS Declarações JS Sintaxe JS Comentários JS Variáveis ​​JS JS Let JS Const Operadores JS JS Aritmética Atribuição de JS Tipos de dados JS Funções JS Objetos JS Eventos JS Strings JS Métodos de string JS Pesquisa de String JS Modelos de String JS Números JS Métodos de número JS Matrizes JS Métodos de matriz JS Classificação de matriz JS Iteração de matriz JS Const da matriz JS Datas JS Formatos de data JS Métodos de obtenção de data JS Métodos de conjunto de datas JS JS Math JS Aleatório JS Booleanos Comparações JS Condições JS Interruptor JS Circuito JS para JS Loop Para Entrada JS Loop Para De JS Loop Enquanto Quebra de JS Iteráveis ​​JS Conjuntos JS Mapas JS Tipo JS de Conversão de tipo JS JS bit a bit JS RegExp Erros JS Escopo JS Içamento JS Modo estrito JS JS esta palavra-chave Função de seta JS Classes JS JS JSON Depuração JS Guia de estilo JS Práticas recomendadas de JS Erros de JS Desempenho JS Palavras reservadas JS

Versões JS

Versões JS JS 2009 (ES5) JS 2015 (ES6) JS 2016 JS 2017 JS 2018 JS IE / Edge Histórico de JS

Objetos JS

Definições de objeto Propriedades do objeto Métodos de objeto Exibição de objetos Acessadores de objetos Construtores de objetos Protótipos de Objetos Iteráveis ​​de objeto Conjuntos de objetos Mapas de objetos Referência do objeto

Funções JS

Definições de função Parâmetros de função Invocação de função Chamada de Função Função Aplicar Fechamentos de Função

Classes JS

Introdução à aula Herança de classe Classe Estática

JS Assíncrono

Retornos de chamada JS JS Assíncrono Promessas JS JS Async/Aguardar

JS HTML DOM

Introdução ao DOM Métodos DOM Documento DOM Elementos DOM HTML DOM Formulários DOM CSS DOM Animações DOM Eventos DOM Ouvinte de eventos DOM Navegação DOM Nós DOM Coleções DOM Listas de nós DOM

BOM do navegador JS

Janela JS Tela JS Localização JS Histórico de JS Navegador JS Alerta pop-up JS Temporização JS Cookies JS

APIs da Web JS

Introdução à API da Web API de formulários da Web API de histórico da web API de armazenamento da Web API do trabalhador da Web API de busca da Web API de geolocalização da Web

JS AJAX

Introdução AJAX AJAX XML Http Solicitação AJAX Resposta AJAX Arquivo XML AJAX PHP AJAX ASP AJAX Banco de dados AJAX Aplicativos AJAX Exemplos AJAX

JS JSON

Introdução JSON Sintaxe JSON JSON x XML Tipos de dados JSON Análise JSON JSON Stringify Objetos JSON Matrizes JSON Servidor JSON JSON PHP HTML JSON JSON JSONP

JS x jQuery

Seletores jQuery HTML jQuery jQuery CSS jQuery DOM

Gráficos JS

Gráficos JS Tela JS JS Plotly JS Chart.js JS Google Chart JS D3.js

Exemplos JS

Exemplos JS JS HTML DOM Entrada HTML JS Objetos HTML JS Eventos HTML JS Navegador JS Editor JS Exercícios JS Teste JS Certificado JS

Referências JS

Objetos JavaScript Objetos HTML DOM


Propriedades do objeto JavaScript


As propriedades são a parte mais importante de qualquer objeto JavaScript.


Propriedades do JavaScript

Propriedades são os valores associados a um objeto JavaScript.

Um objeto JavaScript é uma coleção de propriedades não ordenadas.

As propriedades geralmente podem ser alteradas, adicionadas e excluídas, mas algumas são somente leitura.


Acessando as propriedades do JavaScript

A sintaxe para acessar a propriedade de um objeto é:

objectName.property      // person.age

ou

objectName["property"]   // person["age"]

ou

objectName[expression]   // x = "age"; person[x]

A expressão deve ser avaliada como um nome de propriedade.

Exemplo 1

person.firstname + " is " + person.age + " years old.";

Exemplo 2

person["firstname"] + " is " + person["age"] + " years old.";


JavaScript para... em loop

A instrução JavaScript for...inpercorre as propriedades de um objeto.

Sintaxe

for (let variable in object) {
  // code to be executed
}

O bloco de código dentro do for...inloop será executado uma vez para cada propriedade.

Percorrendo as propriedades de um objeto:

Exemplo

const person = {
  fname:" John",
  lname:" Doe",
  age: 25
};

for (let x in person) {
  txt += person[x];
}

Adicionando novas propriedades

Você pode adicionar novas propriedades a um objeto existente simplesmente dando-lhe um valor.

Suponha que o objeto pessoa já exista - você pode então dar a ele novas propriedades:

Exemplo

person.nationality = "English";

Excluindo Propriedades

A deletepalavra-chave exclui uma propriedade de um objeto:

Exemplo

const person = {
  firstName: "John",
  lastName: "Doe",
  age: 50,
  eyeColor: "blue"
};

delete person.age;

ou excluir pessoa["idade"];

Exemplo

const person = {
  firstName: "John",
  lastName: "Doe",
  age: 50,
  eyeColor: "blue"
};

delete person["age"];

A palavra- deletechave exclui o valor da propriedade e a própria propriedade.

Após a exclusão, a propriedade não pode ser usada antes de ser adicionada novamente.

O deleteoperador foi projetado para ser usado em propriedades de objetos. Não tem efeito sobre variáveis ​​ou funções.

O deleteoperador não deve ser usado em propriedades de objeto JavaScript predefinidas. Ele pode travar seu aplicativo.


Objetos aninhados

Os valores em um objeto podem ser outro objeto:

Exemplo

myObj = {
  name:"John",
  age:30,
  cars: {
    car1:"Ford",
    car2:"BMW",
    car3:"Fiat"
  }
}

Você pode acessar objetos aninhados usando a notação de ponto ou a notação de colchetes:

Exemplo

myObj.cars.car2;

ou:

Exemplo

myObj.cars["car2"];

ou:

Exemplo

myObj["cars"]["car2"];

ou:

Exemplo

let p1 = "cars";
let p2 = "car2";
myObj[p1][p2];

Matrizes e objetos aninhados

Valores em objetos podem ser arrays e valores em arrays podem ser objetos:

Exemplo

const myObj = {
  name: "John",
  age: 30,
  cars: [
    {name:"Ford", models:["Fiesta", "Focus", "Mustang"]},
    {name:"BMW", models:["320", "X3", "X5"]},
    {name:"Fiat", models:["500", "Panda"]}
  ]
}

Para acessar arrays dentro de arrays, use um loop for-in para cada array:

Exemplo

for (let i in myObj.cars) {
  x += "<h1>" + myObj.cars[i].name + "</h1>";
  for (let j in myObj.cars[i].models) {
    x += myObj.cars[i].models[j];
  }
}

Atributos de propriedade

Todas as propriedades têm um nome. Além disso, eles também têm um valor.

O valor é um dos atributos da propriedade.

Outros atributos são: enumerável, configurável e gravável.

Esses atributos definem como a propriedade pode ser acessada (é legível?, é gravável?)

Em JavaScript, todos os atributos podem ser lidos, mas apenas o atributo value pode ser alterado (e somente se a propriedade for gravável).

( ECMAScript 5 tem métodos para obter e definir todos os atributos de propriedade)


Propriedades do protótipo

Objetos JavaScript herdam as propriedades de seu protótipo.

A palavra- deletechave não exclui propriedades herdadas, mas se você excluir uma propriedade prototype, ela afetará todos os objetos herdados do protótipo.