Getter and Setters lookup

[armanlalani]

On the Inheritance and the prototype chain page, there's a line -
The only exception to the getting and setting behaviour rules is when it's intercepted by a getter or setter.

I am looking for a page which discusses this exception. I believe this exception refers to the getter and setter inheritance(I could be wrong though) which I am trying to understand. I noticed this behaviour in the below example -

let user = {
    firstName: "John",
    lastName: "Doe",
    get fullName() {
        return `${this.firstName} ${this.lastName}`;
    },
    set fullName(name) {
        [this.firstName, this.lastName] = name.split(" ");
    },
};

let tempUser = Object.create(user);
tempUser.fullName = "Jack Roe";
console.log(tempUser); // {firstName: 'Jack', lastName: 'Roe'}

Even though fullName which is an accessor property is in the [[Prototype]] of tempUser which is nothing but user, it's set method is called during assignment tempUser.fullName = "Jack Roe". In contrast, in the case of data property, fullName property would be created directly on tempUser. For example -

let user = {
    firstName: "John",
    lastName: "Doe",
    fullName: "John Doe",
};

let tempUser = Object.create(user);
tempUser.fullName = "Jack Roe";
console.log(tempUser); // {fullName: 'Jack Roe'}

Note that the user.fullName is still John Doe and did not change to Jack Roe

Further, if I remove the setter from the user object, the assignment tempUser.fullName = "Jack Roe" fails silently in non-strict mode and throws TypeError in strict mode -

let user = {
    firstName: "John",
    lastName: "Doe",
    get fullName() {
        return `${this.firstName} ${this.lastName}`;
    }
};

let tempUser = Object.create(user);
tempUser.fullName = "Jack Roe"; // In strict mode it will throw an error - Cannot set property fullName of #<Object> which has only a getter
console.log(tempUser); // {}

Can anyone please explain the above behaviour and refer me to a page on MDN Docs which explains it? Thanks!

[TAPgiles]

Looking at the sentence before, all it means is "Setting a property to an object creates an own property" will happen if no setter is defined on that object. Otherwise, the setter will do whatever it is written to do.

And "Is there a 'c' own property on o? No, check its prototype" will happen if no getter is defined on that object. Otherwise, the getter will do what it is written to do.

It seems to work as you described. It is mentioned in passing here.

The way I would explain it is... (defined means set to any value or by defineProperty() or get prop()):

When getting a property that is not defined on the object itself, the next prototype up is checked for the same, looping until an object is found in the prototype chain with a defined property of that name. Then its value is retrieved (either by a static value or a getter function being run) and returned. If no such property is found in the prototype chain, undefined is returned.

When setting a property that is not defined on the object itself, the next prototype up is checked for the same, looping until an object is found in the prototype chain with a defined property of that name. If that definition has a setter, the setter is run in the context of the original object. (Meaning this.firstName = will set a property called firstName on the original object.) If that definition does not have a setter, or no definition is found for the property name, a writable property is defined on the original object and set with the value.

I'm not sure if there's a clearly stated explanation like that on MDN or not. I hope this helps anyway 👍