11

Supondo que eu tenha definido um array como const:

const array = [1,2,3]

Por que é possível que um desses elementos sejam removidos? Isso não seria uma forma de reatribuir o array?

É possível que eu faça um:

array.pop()

E então meu array não seria mais o mesmo que o definido inicialmente. Se o objetivo da constante é deixar claro que seu valor não pode mudar, porque é permitido a exclusão de itens no array?

2
  • 1
    Porque quando você cria uma constante, está informando que você não quer que haja uma reatribuição*, ou seja, não é possível fazer algo como array = [1, 2]. Se você pretende evitar que a estrutura seja modificada, então você está procurando por estruturas de dados imutáveis.
    – Jéf Bueno
    Commented 23/01/2020 às 17:38
  • 1
    Para resumir, o objeto não muda quando usa array.pop, só muda o conteudo dentro dele, você poderia criar uma classe e "instancia-la" direto na const e em seguida pegar um das propriedade e setar um novo valor const = new foo; foo.x = 1. A instância continua sendo a mesma. Vale lembra que os valores de propriedades de um objeto funcionam como referencia, mas o valor em si aplicado a uma variável ou constante não.
    – Syzoth
    Commented 23/01/2020 às 17:51

3 Respostas 3

15

Conforme consta na seção de resumo da documentação de const:

A declaração const cria uma variável cujo o valor é fixo, ou seja, uma constante somente leitura. Isso não significa que o valor é imutável, apenas que a variável constante não pode ser alterada ou re-atribuída.

Isso significa que você não poderá criar outra variável com o mesmo nome, já que fora criada uma referência de somente leitura. No entanto, você ainda poderá alterar o valor da constante.

Isso fica claramente visível em objetos:

// Note `const`:
const person = { name: 'Fulano' };

console.log(person.name);

// O valor que a variável armazena pode ser alterado.
// Só não pode ser reatribuído.
//
// Então isso está OK:
person.name = 'Luiz Felipe';

console.log(person.name);

Ou em arrays, conforme o seu exemplo.


Se você quiser criar um objeto realmente imutável, pode usar o Object.freeze, que "congela" a referência passada. Por exemplo:

const arr = [1, 2, 3];
Object.freeze(arr); // A partir de agora, `arr` está "congelada".

const obj = { name: 'Luiz Felipe' };
Object.freeze(obj); // A partir de agora, `obj` está "congelado".

Mas por que isso realmente acontece?

Todo objeto do JavaScript possui suas propriedades (isso não é novidade para nós), o negócio é que cada uma dessas propriedades possuem alguns "metadados" denominados property descriptors, que configuram o comportamento daquela propriedade específica. Esses property descriptors possuem alguns atributos, são eles:

  • configurable, que será verdadeiro (true) se a propriedade possa ser alterada e deletada do seu objeto.
  • writable, que será verdadeiro se a propriedade puder ser alterada usando algum operador de atribuição.
  • enumerable, que será verdadeiro se a propriedade é mostrada durante a enumeração do seu objeto. Por exemplo, em Object.keys ou em laços for..in.
  • value, que representa o valor associado à propriedade em questão.

A documentação dá uma boa ideia sobre isso. Também tem a pergunta "O que são e como funcionam os descritores e atributos de propriedade do JavaScript?", que resume o funcionamento deles.

Desse modo, sempre que você cria um objeto literal, todas as suas propriedades têm seus descritores definidos com enumerable, configurable e writable definidos como true. Isso significa que todo objeto criado da forma literal poderá ter as suas propriedades alteradas, deletadas e afins.

Assim, quando você usa o Object.freeze, as propriedades do objeto terão seus descritores alterados, de modo a definir enumerable e writable como false. O objeto também sofrerá prevenção de extensões, o que não permitirá que novas propriedades sejam nele adicionadas. Essencialmente, o Object.freeze torna qualquer objeto verdadeiramente imutável.

Podemos observar esse comportamento utilizando o Object.getOwnPropertyDescriptors. Veja:

const obj = { name: 'Luiz Felipe', username: 'lffg' };

// Note na saída que cada propriedade (`name` e `username` do objeto `obj`)
// possui os descritores `writable` e `configurable` definidos como `true`.
console.log(Object.getOwnPropertyDescriptors(obj));

console.log('====== Congelou ======');
Object.freeze(obj);

// Note agora que os descritores `writable` e `configurable` estão como `false`.
console.log(Object.getOwnPropertyDescriptors(obj));

E o mesmo se aplica aos arrays, uma vez que no JavaScript, todo array é um objeto, e a grosso modo, os índices são as "propriedades". Portanto, o comportamento é exatamente o mesmo:

const arr = [1, 2, 3];

// Note na saída que cada índice (`0`, `1` e `2` do array `arr`)
// possui os descritores `writable` e `configurable` definidos como `true`.
console.log(Object.getOwnPropertyDescriptors(arr));

console.log('====== Congelou ======');
Object.freeze(arr);

// Note agora que os descritores `writable` e `configurable` estão como `false`.
console.log(Object.getOwnPropertyDescriptors(arr));


Por fim, quero deixar claro que não é a declaração const que define writable e configurable como true por padrão. É o fato de você criar o objeto usando a forma literal. Você pode criar objetos "totalmente configurados" utilizando o método Object.create. O Object.defineProperty te permite criar uma propriedade configurada por vez. E por fim, o Object.defineProperties te permite criar várias propriedades configuradas de uma vez.

Mas não se preocupe com isso tudo. Isso está mais relacionado à metaprogramação. São raramente utilizados diretamente.

8

Podemos declarar uma variável como constante através da palavra-chave const. Mas o que é uma constante ? Uma vez que tenha sido atribuído um valor à uma variável que tenha sido declarada usando a palavra-chave const, seu valor não pode ser alterado. Por esta razão, todas as constantes devem obrigatoriamente ser inicializadas na declaração. Por exemplo:

// constante válida
const idade = 18;

// constante inválida: onde está a inicialização ?
const pi;

No código acima temos o exemplo de uma constante idade sendo declarada e inicializada na mesma linha (constante válida) e um outro exemplo onde o valor não é atribuído na declaração (constante inválida). Além disso, constantes também tem escopo de bloco, assim como as variáveis declaradas com a palavra-chave let. O que acontece se tentarmos mudar o valor de uma variável constante? Vamos testar:

const idade = 18;
idade = 21;

Se tentarmos rodar o código acima, um erro será lançado: constantes não podem ter seu valor alterado.

  • Acima, nós explicamos como é feita a utilização de Constantes. Agora, abaixo, vamos ver os seguintes motivos que podem ocasionar a alteração de uma constante (que era pra ser imutável). Veja:

Um dos motivos pode ser a versão do seu browser.

Em versões anteriores do Firefox & Chrome e a partir de Safari 5.1.7 e Opera 12.00, se você define uma variável com const, você ainda consegue alterar o valor depois. Este recurso não é suportado no Internet Explorer 6-10, mas está incluído no Internet Explorer 11.

inserir a descrição da imagem aqui

Temos também uma outra abordagem:

Constantes não reais:

A palavra-chave const é um pouco enganadora. NÃO define um valor constante. Ela define uma referência constante a um valor.

Por esse motivo, não podemos alterar valores primitivos constantes, mas podemos alterar as propriedades de objetos constantes.

VALORES PRIMITIVOS:

Se atribuirmos um valor primitivo a uma constante, não podemos alterar o valor primitivo:

Exemplo:

const PI = 3.141592653589793;
PI = 3.14; // Isso dará um erro
PI = PI + 10; // Isso também dará um erro

OBJETOS CONSTANTES PODEM MUDAR

Você pode alterar as propriedades de um objeto constante:

EXEMPLO:

// Você pode criar um objeto const:
const carro = {type:"Fiat", model:"500", color:"white"};

// Você pode alterar uma propriedade:
carro.color = "red";

// Você pode adicionar uma propriedade:
carro.owner = "Jason";

MAS VOCÊ NÃO PODE REATRIBUIR UM OBJETO CONSTANTE:

EXEMPLO:

const car = {type:"Fiat", model:"500", color:"white"};
car = {type:"Volvo", model:"EX60", color:"red"};    // ERRO

MATRIZES CONSTANTES PODEM MUDAR

Você pode alterar os elementos de uma matriz constante:

EXEMPLO:

// Você pode criar uma matriz constante:
const carros = ["Saab", "Volvo", "BMW"];

// Você pode alterar um elemento:
carros[0] = "Toyota";

// Você pode adicionar um elemento:
carros.push("Audi");

Mas você NÃO pode reatribuir uma matriz constante:

EXEMPLO:

const carros = ["Saab", "Volvo", "BMW"];
carros = ["Toyota", "Volvo", "Audi"];    // ERRO

Referências:

http://www.matera.com/

https://developer.mozilla.org/pt-BR/

w3schools.com

8

O seu array e os objetos contidos nele não possuem ligação alguma. O array é apenas um objeto, ou melhor dizendo, um endereço de memória que guarda dentro dele outros objetos.

A definição const serve para que o valor atribuído à constante não mude, ou seja, ele não nos deixa trocar a constante de um array para uma string e nem mesmo criar um novo objeto array. No código abaixo por exemplo, será gerado um erro porque na segunda linha eu tento alterar o objeto atribuído à constante para um novo objeto.

const array = [1, 2, 3];
array = [1, 2, 3];

Por esse mesmo motivo também, é obrigatório você inicializar a constante na sua declaração, pois depois de ter seu valor atribuído, ele não poderá ser alterado.

Porém ainda assim, é possível adicionar, remover ou alterar as propriedades dos objetos em JavaScript, incluindo os arrays:

const array = [1, 2, 3];
array.length = 5;                 // Alterando a propriedade do objeto.
array.name = "Array de números"   // Adicionando uma nova propriedade.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .