Can someone explain how Object.defineProperty work in constructor function in javascript

Question

I create a very simple object Person and calling constructor with a name parameter, as i haven't created any local variables inside Person constructor, then how name property gets set.

function Person(name) {
    Object.defineProperty(this, "name", {
        get: function() {
            return name;
        },
        set: function(newName) {
            debugger;
            name = newName;
        },
        enumerable: true,
        configurable: true
    });
    this.sayName = function() {
        console.log(this.name);
    };
}

var p1 = new Person("mike");

how name property get set ?

it just uses the `name` argument. – Daniel A. White Mar 11 '15 at 13:13 — Daniel A. White, Mar 11 '15 at 13:13
you can use p1.name="test" – Vladu Ionut Mar 11 '15 at 13:19 — Vladu Ionut, Mar 11 '15 at 13:19

score 1 · Accepted Answer · answered Mar 11 '15 at 13:16

1

I haven't created any local variables inside Person constructor

name is a local variable, declared by the name parameter of your function. This variable is used in the setter and getter of the .name property.

answered Mar 11 '15 at 13:16

Bergi

630,263
148
957
1,375

name is a local variable, so what ?? can you explain ? – Cody Mar 11 '15 at 13:18
@Cody: What didn't you understand? How getters and setters work? – Bergi Mar 11 '15 at 13:19
when i call constructor set method is used to set name ?? – Cody Mar 11 '15 at 13:22
No, when the constructor is called then the property is declared. The setter is called when you assign to the property, the getter is called when you access the property. – Bergi Mar 11 '15 at 13:23
So when i call constructor with name parameter and i used Object.defineproperty to define name property that's why it set to name? – Cody Mar 11 '15 at 13:27
It is because you call it with the property name `"name"`, and use the local `name` variable in your setter/getter - to store the value for the property. – Bergi Mar 11 '15 at 13:29

score 0 · Answer 2 · answered Mar 11 '15 at 13:25

There are two main ways that variable references are kept long-term in JavaScript; as object properties (myObj = {x: 3}, x is a simple property of myObj), and through a JavaScript internal system called "closures" that takes local variables and maintains their reference as long as a function can still access them (like your property accessors).

Examples of local variables would be as follows:

function myFunction(localVariable1) {
  var localVariable2 = ...
  ...
}

If myFunction runs once and ends, the garbage collector gets rid of localVariable1 and localVariable2 when the function finishes; it doesn't need them. A useful trick in JavaScript though, is the fact that the compiler can keep variable references even inside a function, if an inner function will need them.

function myFunction(localVariable1) {
  document.onload = function() {
    document.write(localVariable1;
  };
}

In that case, it will keep a reference to localVariable1 until document onload (and perhaps after since the function still exists). In your case though, it will keep it for the entire length of the object so that those set and get functions can operate on it.

score 0 · Answer 3 · answered Mar 11 '15 at 13:30

to call the setter use p1.name="test" ;

and for getter p1.name;

see this example Example: Custom Setters and Getters

function Archiver() {
  var temperature = null;
  var archive = [];

  Object.defineProperty(this, 'temperature', {
    get: function() {
      console.log('get!');
      return temperature;
    },
    set: function(value) {
      console.log("set:"+value);
      temperature = value;

      archive.push({ val: temperature });
    }
  });

  this.getArchive = function() { return archive; };
}

var arc = new Archiver();
arc.temperature; // 'get!'
arc.temperature = 11;
arc.temperature = 13;
arc.getArchive(); // [{ val: 11 }, { val: 13 }]

console results

 get!
 set:11
 set:13

Can someone explain how Object.defineProperty work in constructor function in javascript

3 Answers3

Linked