JS: build object based on given object parent’s property?

I am trying to create a JS object that hold all the urls.

I am trying to achieve this so I have a data() part:

export default defineComponent({
  name: 'MyPage',
  data() {
    backendUrls: {...}
  }
})

In a more simple way it would look like this:

backendUrls: {
  baseUrl: "http://localhost:8080",
  baseUrlWithPrefix: function() { return this.baseUrl + "/ver1"; }
  userAdd: function() { return this.baseUrlWithPrefix() + "/user/add"; }
}

I could use the this keyword since it pointed to the same object where the given property also exists.

But I would like to split a bit more and create objects in the object:

backendUrls: {
  baseUrl: "http://localhost:8080",
  generalUrls: {
    baseUrlWithPrefix: ...
  },
  socketUrls: {
    messageUrls: {
      userAdd: ...
    }
  }
}

Here if I try generalUrls: { baseUrlWithPrefix: function() { return this.baseUrl + "/ver1"; }}, it won’t work because it does not find the baseUrl since the this keyword points on the generalUrls object and not the backendUrls object where the baseUrl exists.

I’d need something like this:

backendUrls: {
  baseUrl: "http://localhost:8080",
  generalUrls: {
    baseUrlWithPrefix: function() { return {goBackToParentObject}.this.baseUrl + "/ver1"; }
  },
  socketUrls: {
    messageUrls: {
      userAdd: function() { return {goBackToParentObject}.this.generalUrls.baseUrlWithPrefix() + "/user/add"; }
    }
  }
}