问题
I'm trying to understand how js prototypes and classes work, and I'm using Chrome's console.log to print and have a look at the state of my objects while I add new properties etc.
This is the code I'm using: (fiddle)
function Person(){}
Person.prototype.sayHello = function(){ alert("Hello"); };
Person.prototype.name = "Name";
console.log(Person.prototype) //1st console.log
Person.prototype.surname = "Surname";
console.log(Person.prototype); //2nd console.log
I expect to have two different results printed in the console, because the surname property was added after the first console log. Instead, this is the console output:
As you can see, both the outputs have the surname property defined even if it was added only after the 1st console.log..
Can you explain me why? What am I missing? Doesn't console.log show the current state of the object when called?
Thank you in advance, best regards
回答1:
your next line of code where you set the persons surname, doesnt wait for the console log because console.log is asynchrounous, when you try out this code with a timeout it will be correct,
function Person() {}
Person.prototype.sayHello = function () {
alert("Hello");
};
Person.prototype.name = "Name";
console.log(Person.prototype) //1st console.log
setTimeout(function(){
Person.prototype.surname = "Surname";
console.log(Person.prototype); //2nd console.log
},1000);
you could save a copy of that object before you log it, then it would work
Synchronous console logging in Chrome
UPDATE:
i have an even better solution :
just log a stringifyed version of the object and you´ll be okay
console.log(JSON.stringify(Person.prototype))
来源：https://stackoverflow.com/questions/22146684/console-log-a-javascript-object-class-same-result-before-and-after-the-change