Symbol.toStringTag

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since abril de 2017.

O símbolo Symbol.toStringTag é uma propriedade com valor string que é usada para a criação de uma descrição de string de um objeto padrão. É acessado internalmente pelo método Object.prototype.toString().

Experimente

class ValidatorClass {
  get [Symbol.toStringTag]() {
    return "Validator";
  }
}

console.log(Object.prototype.toString.call(new ValidatorClass()));
// Expected output: "[object Validator]"

Property attributes of Symbol.toStringTag

Writable	no
Enumerable	no
Configurable	no

Exemplos

Tags padrões

js
Object.prototype.toString.call("foo"); // "[object String]"
Object.prototype.toString.call([1, 2]); // "[object Array]"
Object.prototype.toString.call(3); // "[object Number]"
Object.prototype.toString.call(true); // "[object Boolean]"
Object.prototype.toString.call(undefined); // "[object Undefined]"
Object.prototype.toString.call(null); // "[object Null]"
// ... e mais

Símbolos built-in toStringTag

js
Object.prototype.toString.call(new Map()); // "[object Map]"
Object.prototype.toString.call(function* () {}); // "[object GeneratorFunction]"
Object.prototype.toString.call(Promise.resolve()); // "[object Promise]"
// ... e mais

Classes personalizadas para objeto tag

Quando cria sua própria classe, o JavaScript padroniza para "Object" tag:

js
class ValidatorClass {}

Object.prototype.toString.call(new ValidatorClass()); // "[object Object]"

Tag costumizada com toStringTag

Agora, com a ajuda do toStringTag, você é capaz de costumizar sua própria tag:

js
class ValidatorClass {
  get [Symbol.toStringTag]() {
    return "Validator";
  }
}

Object.prototype.toString.call(new ValidatorClass()); // "[object Validator]"

toStringTag disponível em todos os objetos protótipos da DOM

Devido a uma mudança nas especificações WebIDL spec change em meados de 2020, navegadores estão adicionando uma propriedade Symbol.toStringTag para todos os objetos protótipos da DOM . Por exemplo, para acessar a propriedade Symbol.toStringTag no HTMLButtonElement:

js
let test = document.createElement("button");
test.toString(); // Retorna [object HTMLButtonElement]
test[Symbol.toStringTag]; // Retona HTMLButtonElement