How are methods, nested in other objects stored?-CodePudding

I have a question concerning object methods and storing them inside other objects.How come obj[1]() still executes the old method, although it is overwritten by fn.getN1 = "test"? I would think I can't execute it anymore. And it doesnt exist when I console .log fn, but is it still stored somewhere in memory?

Also, would be great if you can tell me if this is a bad practice or not. I'm not quite knowledgable this.

function Factory() {
    let n = 0;

    function getN1() {
        console.log(n);
    }
    
    function getN2() {
        console.log(n);
    }

    function incrN() {
        n  
    }

    return {getN1, getN2, incrN}
    
}

let fn = Factory();

let obj = {1: fn.getN1, 2: fn.incrN}

fn.getN1 = "test";
console.log(fn);

obj["2"]();

obj[1]();
fn.getN2();
console.log(fn.getN1);

CodePudding user response：

When you set an object's property (in this case obj.1) it stores into memory as it's own. And it won't let you change it from the outside.

You would have to update the reference as such: obj['1'] = 'text;

However, there is a trick to store the property as a function which will execute the fn's functions as they are currently defined.

let fn = Factory();
let obj = {1: function(){ fn.getN1()}, 2: function(){ fn.incrN()}}

if(typeof fn.getN1 == 'function')
  obj['1']()
else
  console.log(fn.getN1)

fn.getN1 = "text";

if(typeof fn.getN1 == 'function')
  obj['1']()
else
  console.log(fn.getN1)

Note* you need to use typeof because it looks like you can switch getN1 from a function to something that's not a function (in this case "text" = string) If you want to get rid of having to check with "typeof" all the time, then update getN1 to this fn.getN1 = function(){}; <- this is basically a function that does nothing.

CodePudding user response：

An Object in JavaScript is a collection of properties. Each property consists of a String (or Symbol) name, a value, and a set of attributes.

In JavaScript, functions are objects. When you create a function-object (eg. function foo() {}), a corresponding object is created on the heap, and a reference to that object is made available to you, the programmer, so you can use it (here: that reference is assigned to the identifier foo).

So, in JavaScript, you might say that objects (and functions are objects) are passed around "by reference"; the actual objects are never copied around for performance reasons, instead references (like a pointer, but more convenient to use) to them are passed around.

In the following, a reference to the function-object referred to by the value of the property with name 'getN1' on fn1, is copied into the value position for the property with name '1' on a new object (created using the object initializer (or 'object literal') syntax). A reference to this newly-created object is then assigned to the variable named obj:

let obj = { 1: fn.getN1 }

And in the following, the value associated with the property with name 'getN1' on object fn is changed to be the string 'test', overwriting the previous value of that property. Object obj remains unchanged by this:

fn.getN1 = "test";