0

const user1 = {
    name: 'Sherlock Holmes',
    address:{
        street:'Baker street',
        number:"221B",
    },
    sayMyAddress:function (){
        console.log(`My address is ${this.address}`)
        console.log(this.address)
    }

}

user1.sayMyAddress()

The result:

My address is [object Object]

{ street: 'Baker street', number: '221B' }

Why the this keyword shows the address value in the second case and doesn't in the first? the scope in this case isn't in the object user?

4
  • That has nothing to do with this. The same result can be observed with console.log({}) and console.log(`${{}}`) Commented Mar 31, 2022 at 7:20
  • Because in the first case you are transforming an object in to a string literal, so you get [object Object], you can get the same result if do console.log(this.address.toString()). In the second case you set the first parameter to the console of the type object, so depending of the WB you would get the representation of the object Commented Mar 31, 2022 at 7:23
  • Does this answer your question? Javascript - Template Strings Don't Pretty Print Objects Commented Mar 31, 2022 at 7:23
  • If you implement the toString() function in address object, then the 1st console.log() would be able to print out the correct answer w.r.t the toString() defined. Commented Mar 31, 2022 at 7:24

3 Answers 3

2

The result of the conversion of the address to a string is '[object Object]' as we'd expect. For example, if you do

console.log({}.toString()) 

you'll get an output of:

[object Object]

A small change in the code will give the desired result:

const user1 = {
  name: 'Sherlock Holmes',
  address: {
    street: 'Baker street',
    number: "221B",
  },
  sayMyAddress: function() {
    console.log(`My address is ${this.address.number} ${this.address.street}`)
  }

}

user1.sayMyAddress()
.as-console-wrapper { max-height: 100% !important; }

You could also add a toString() function on the address object:

const user1 = {
  name: 'Sherlock Holmes',
  address: {
    street: 'Baker street',
    number: "221B",
    toString() { return `${this.number} ${this.street}` }
  },
  sayMyAddress: function() {
    console.log(`My address is ${this.address}`)
  }

}

user1.sayMyAddress()
.as-console-wrapper { max-height: 100% !important; }

Sign up to request clarification or add additional context in comments.

Comments

0

this.address is an object, so even if the console.log is sympatic enough to output the full object with values if you pass it the object directly, if you use it in a string you'll get [object Object].

Just try it like this

console.log(`My address is ${this.address.street} ${this.address.number}`)

Comments

0

You are trying to log the object itself. So the output result is pretty much expected.

Change the log line from:

console.log(`My address is ${this.address}`)

to:

console.log(`My address is ${this.address.street} ${this.address.number}`)

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.