Кратко
СкопированоМетод to
возвращает строковое представление объекта. Метод автоматически вызывается, когда объект нужно представить в текстовом виде. При необходимости поведение метода можно изменить.
Пример
Скопировано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]
Как пишется
СкопированоObject
не имеет аргументов.
Object
возвращает строковое представление объекта.
Как понять
СкопированоОбычно метод to
не используется для объектов явно, а вызывается JavaScript автоматически, если объект находится в контексте, где он должен быть представлен в виде строки.
Объекты, в отличие от примитивных типов, сложно преобразовывать в строку. Объект может содержать произвольное количество полей и без программиста непонятно, какие из них важные. Поэтому стандартная реализация метода to
представляет собой заглушку и возвращает малоинформативную строку, например '
.
Метод to
является одним из нескольких базовых методов, наследуемых всеми объектами созданными из Object. Встроенные объекты (например: Number, Array, Error, Function и другие) переопределяют реализацию метода to
для отображения объекта в более подходящем виде.
Например, Number
преобразует число в строку в указанной системе счисления, Array
выводит список элементов через запятую, а Error
отображает имя и сообщение об ошибке.
Следует отметить, что при использовании Console API метод to
для объектов не используется:
const person = {name: 'Brendan Eich', year: 1961}// объект как аргумент console.logconsole.log('person: ', person)// person: { name: 'Brendan Eich', year: 1961 }// строка как аргумент console.logconsole.log('person: ' + person)// person: [object Object]
const person = {name: 'Brendan Eich', year: 1961} // объект как аргумент console.log console.log('person: ', person) // person: { name: 'Brendan Eich', year: 1961 } // строка как аргумент console.log console.log('person: ' + person) // person: [object Object]
Описание стандартной реализации
СкопированоДля обычных объектов (имеющих набор полей {ключ: значение}) метод to
возвращает строку '
.
Однако, результат может быть иной. Это зависит от нескольких факторов:
- Значение
Symbol
. Если объект имеет это специальное поле, описывающее преобразование объекта к примитивным типам, то результат этого преобразования к строке используется вместо. to Primitive to
:String ( )
const book = { title: 'Замок', author: 'Ф. Кафка'}book[Symbol.toPrimitive] = function(hint) { if (hint === 'string') { return `(название: ${this.title}, автор: ${this.author})`; } return true;}console.log(`Книга ${book}`)// Книга (название: Замок, автор: Ф. Кафка)
const book = { title: 'Замок', author: 'Ф. Кафка' } book[Symbol.toPrimitive] = function(hint) { if (hint === 'string') { return `(название: ${this.title}, автор: ${this.author})`; } return true; } console.log(`Книга ${book}`) // Книга (название: Замок, автор: Ф. Кафка)
- Значение
Symbol
. Если объект имеет это специальное строковое поле, то его значение отображается как тип объекта:. toString Tag
const book = { title: 'Дар', author: 'В. В. Набоков'}book[Symbol.toStringTag] = 'Book'console.log(`Сейчас читаю ${book}`)// Сейчас читаю [object Book]
const book = { title: 'Дар', author: 'В. В. Набоков' } book[Symbol.toStringTag] = 'Book' console.log(`Сейчас читаю ${book}`) // Сейчас читаю [object Book]
- тип this. Метод
Object
может быть вызван для значений других типов:. to String ( )
const toString = Object.prototype.toStringconsole.log(toString.call([1, 2, 3]))// [object Array]console.log(toString.call(25))// [object Number]console.log(toString.call(true))// [object Boolean]
const toString = Object.prototype.toString console.log(toString.call([1, 2, 3])) // [object Array] console.log(toString.call(25)) // [object Number] console.log(toString.call(true)) // [object Boolean]
Переопределение стандартной реализации
СкопированоСуществует несколько способов изменить поведение метода to
.
Переопределение метода toString()
на уровне объекта.
СкопированоМожно использовать перечисленные выше способы с использованием специальных полей: Symbol
, Symbol
Переопределение метода toString()
для всех экземпляров класса.
СкопированоДопустим классу требуется переопределить поведение метода to
. Для этого нужно добавить собственную реализацию метода. Тогда все объекты этого класса будут использовать переопределённую реализацию:
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()
на уровне прототипа функции.
СкопированоДля создания объектов с необходимым набором свойств может использоваться функция.
В этом случае переопределить метод to
можно для прототипа:
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», автор А. П. Чехов
На практике
Скопированосоветует Скопировано
🛠 На практике метод to
переопределяют нечасто.
Метод не подходит для вывода данных в интерфейсе из-за негибкости, для интерфейса используют специальные библиотеки, такие как React и его альтернативы. Метод отлично подходит для отладочной информации, но современные инструменты разработчика в браузере умеют выводить объект в консоль интерактивно, с возможностью просмотра содержимого.