Можно ли переопределить функцию JavaScript toString (), чтобы обеспечить значимый вывод для отладки? - PullRequest
102 голосов
/ 10 июня 2011

Когда я console.log() объект в моей программе JavaScript, я просто вижу вывод [object Object], который не очень помогает выяснить, какой объект (или даже тип объекта) это.

В C # я привык переопределять ToString(), чтобы иметь возможность настраивать представление отладчика объекта. Есть ли что-нибудь подобное, что я могу сделать в JavaScript?

Ответы [ 14 ]

92 голосов
/ 10 июня 2011

Вы также можете переопределить toString в Javascript. Смотрите пример:

function Foo() 
{
}

// toString override added to prototype of Foo class
Foo.prototype.toString = function()
{
    return "[object Foo]";
}

var f = new Foo();
alert(f);  // popup displays [object Foo]

См. это обсуждение того, как определить имя типа объекта в JavaScript.

24 голосов
/ 11 июля 2015

Первое переопределение toString для вашего объекта или прототипа:

var Foo = function(){};
Foo.prototype.toString = function(){return 'Pity the Foo';};

var foo = new Foo();

Затем преобразуйте в строку, чтобы увидеть строковое представление объекта:

//using JS implicit type conversion
console.log('' + foo);

Если вы неВ отличие от дополнительной типизации, вы можете создать функцию, которая записывает строковые представления своих аргументов на консоль:

var puts = function(){
    var strings = Array.prototype.map.call(arguments, function(obj){
        return '' + obj;
    });
    console.log.apply(console, strings);
};

Использование:

puts(foo)  //logs 'Pity the Foo'

puts(foo, [1,2,3], {a: 2}) //logs 'Pity the Foo 1,2,3 [object Object]'

Обновление

E2015обеспечивает гораздо более приятный синтаксис для этого материала, но вам придется использовать транспортер, такой как Babel :

// override `toString`
class Foo {
  toString(){
    return 'Pity the Foo';
  }
}

const foo = new Foo();

// utility function for printing objects using their `toString` methods
const puts = (...any) => console.log(...any.map(String));

puts(foo); // logs 'Pity the Foo'
12 голосов
/ 10 июня 2011

Простой способ получить отладочный вывод в браузере JS - просто сериализовать объект в JSON.Таким образом, вы можете сделать звонок, как

console.log ("Blah: " + JSON.stringify(object));

Так, например, alert("Blah! " + JSON.stringify({key: "value"})); создает предупреждение с текстом Blah! {"key":"value"}

7 голосов
/ 03 января 2017

Если вы используете Node, возможно, стоит подумать util.inspect.

var util = require('util')

const Point = {
  x: 1,
  y: 2,
  [util.inspect.custom]: function(depth) { return `{ #Point ${this.x},${this.y} }` }

}

console.log( Point );

Это даст:

{ #Point 1,2 }

В то время как версия без проверки печатает:

{ x: 1, y: 2 }
5 голосов
/ 13 марта 2015

Если объект определен вами, вы всегда можете добавить переопределение toString.

//Defined car Object
var car = {
  type: "Fiat",
  model: 500,
  color: "white",
  //.toString() Override
  toString: function() {
    return this.type;
  }
};

//Various ways to test .toString() Override
console.log(car.toString());
console.log(car);
alert(car.toString());
alert(car);

//Defined carPlus Object
var carPlus = {
  type: "Fiat",
  model: 500,
  color: "white",
  //.toString() Override
  toString: function() {
    return 'type: ' + this.type + ', model: ' + this.model + ', color:  ' + this.color;
  }
};

//Various ways to test .toString() Override
console.log(carPlus.toString());
console.log(carPlus);
alert(carPlus.toString());
alert(carPlus);
5 голосов
/ 10 июня 2011

Просто переопределите метод toString().

Простой пример:

var x = {foo: 1, bar: true, baz: 'quux'};
x.toString(); // returns "[object Object]"
x.toString = function () {
    var s = [];
    for (var k in this) {
        if (this.hasOwnProperty(k)) s.push(k + ':' + this[k]);
    }
    return '{' + s.join() + '}';
};
x.toString(); // returns something more useful

Это даже лучше, когда вы определяете новый тип:

function X()
{
    this.foo = 1;
    this.bar = true;
    this.baz = 'quux';
}

X.prototype.toString = /* same function as before */

new X().toString(); // returns "{foo:1,bar:true,baz:quux}"
4 голосов
/ 06 сентября 2017

С литералами шаблона :

class Foo {
  toString() {
     return 'I am foo';
  }
}

const foo = new Foo();
console.log(`${foo}`); // 'I am foo'
0 голосов
/ 03 января 2019

Вот пример того, как структурировать объект Map:

  Map.prototype.toString = function() {

    let result = {};

    this.forEach((key, value) => { result[key] = value;});

    return JSON.stringify(result);
  };
0 голосов
/ 01 декабря 2018

-Эта операция занимает много времени для завершено, и его использование не рекомендуется в соответствии с документами Mozilla: https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/proto

- Судя по всему, современные браузеры устарели .prototype и ECMA6 указывает вместо этого используйте Proper__proto__.

Так, например, если вы определяете свой собственный объект геопозиция , вы должны вызвать __ proto __ свойство вместо .prototype :

var  geoposition = {

        lat: window.pos.lat,
        lng: window.pos.lng
    };

geoposition.__proto__.toString = function(){ return "lat: "+this.lat+", lng: "+this.lng }
console.log("Searching nearby donations to: "+geoposition.toString());
0 голосов
/ 17 мая 2018

Вы можете расширить или переопределить в JS

String.prototype.toString = function() {
    return this + "..."
}
document.write("Sergio".toString());
...