{}.toString()

Метод преобразует объект в строковое представление

Время чтения: меньше 5 мин

Кратко

Секция статьи "Кратко"

Метод toString преобразует объект в строковое представление. Метод автоматически вызывается JavaScript, когда объект нужно представить в текстовом виде.

Если метод не переопределён, то он возвращает строку формата [object тип], где тип — это строка, которая уточняет тип объекта. В подавляющем большинстве вы будете видеть вывод [object Object].

Пример

Секция статьи "Пример"
        
          
          const book = {  title: 'JavaScript: the good parts',  author: 'Douglas Crockford'}console.log(`Сейчас читаю ${book}`)// Сейчас читаю [object Object]
          const book = {
  title: 'JavaScript: the good parts',
  author: 'Douglas Crockford'
}

console.log(`Сейчас читаю ${book}`)
// Сейчас читаю [object Object]

        
        
          
        
      

Как пишется

Секция статьи "Как пишется"

Метод вызывается без аргументов. Возвращает строковое представление объекта.

Как понять

Секция статьи "Как понять"

Существует соглашение, что метод toString вызывается JavaScript автоматически, если объект находится в контексте, где он должен быть представлен в виде строки. Чаще всего это случаи, связанные с печатью данных на экран или в консоль браузера.

Объекты, в отличие от примитивных типов, сложно преобразовывать в строку. Объект может содержать произвольное количество полей и без программиста непонятно, какие из них важные. Поэтому стандартная реализация метода toString представляет собой заглушку, печатающую '[object Object]'.

Многие структуры данных, базирующиеся на объекте Object, содержат собственные реализации этого метода. Например, Number преобразует число в строку в указанной системе счисления, а массив выводит список элементов через запятую.

Переопределение стандартной реализации

Секция статьи "Переопределение стандартной реализации"

Стандартная реализация метода toString не даёт достаточно информации об объекте даже для использования в отладке программы. Программисты могут переопределить метод toString, чтобы выводить необходимые данные.

Если мы работаем в ООП стиле, то классу нужно просто добавить метод toString:

        
          
          class Book {  title = ''  author = ''  constructor(title, author) {    this.title = title    this.author = author  }  toString() {    return `«${this.title}», автор ${this.author}`  }}const book = new Book('Палата №6', 'А. П. Чехов')console.log(`Читаю ${book}`)// Читаю «Палата №6», автор А. П. Чехов
          class Book {
  title = ''
  author = ''

  constructor(title, author) {
    this.title = title
    this.author = author
  }

  toString() {
    return `«${this.title}», автор ${this.author}`
  }
}

const book = new Book('Палата №6', 'А. П. Чехов')
console.log(`Читаю ${book}`)
// Читаю «Палата №6», автор А. П. Чехов

        
        
          
        
      

Если вы предпочитаете работать в функциональном стиле, то придётся создать новый тип объекта и переопределить метод toString в прототипе:

        
          
          function Book(title, author) {  this.title = title  this.author = author}Book.prototype.toString = function() {  return `«${this.title}», автор ${this.author}`}const book = new Book('Палата №6', 'А. П. Чехов')console.log(`Читаю ${book}`)// Читаю «Палата №6», автор А. П. Чехов
          function Book(title, author) {
  this.title = title
  this.author = author
}

Book.prototype.toString = function() {
  return `«${this.title}», автор ${this.author}`
}

const book = new Book('Палата №6', 'А. П. Чехов')
console.log(`Читаю ${book}`)
// Читаю «Палата №6», автор А. П. Чехов

        
        
          
        
      

Под капотом JavaScript обе реализации идентичны и отличаются только использованным синтаксисом.

На практике

Секция статьи "На практике"

Николай Лопин

Секция статьи "Николай Лопин"

🛠 На практике метод toString переопределяют нечасто.

Метод не подходит для вывода данных в интерфейсе из-за негибкости, для интерфейса используют специальные библиотеки, такие как React и его альтернативы. Метод отлично подходит для отладочной информации, но современные инструменты разработчика в браузере умеют выводить объект в консоль интерактивно, с возможностью просмотра содержимого.