How to access JavaScript function which is in func

2019-09-19 19:10发布

问题:

Is there any way to access a function which is inside a function, which is inside an other function in JavaScript?

function x(name, age) {
  this.name = name;
  this.age = age;


  this.a = function() {
    this.b = function() {
      return "b";
    };

    return "a";
  };
}

var xobj = new x('vin', 25);
console.log(xobj.a.b()); //error

回答1:

you can do

function x(name, age){
 this.name  =name;
 this.age = age;
 

 this.a = function(){
			
		this.b = function(){
			return "b";
        };

	return "a";
  };
  
}


var xobj =new x('vin',25);
var xx = new xobj.a();
console.log(xx.b());

you would have to declare an instance of x.a() and then call b

When a function is used as a constructor (with the new keyword), its this is bound to the new object being constructed. so If you want to call this inside the function a(), you would have to create a constructor using new keyword



回答2:

My suggestion would be to avoid this situation as well as avoid using @marvel308's answer. I don't dislike the user of course :) I just dislike the readability and understandability that the linked answer provides despite good effort. While it may be a solution, it is one you'll probably have to google every time you see it used since it isn't easy to understand -- lets avoid that.

Depending on what you want, there are multiple alternatives, you could rethink the structure of your program to be more "flat" for instance. Nesting usually makes things more complex so avoiding it will do you good most of the time.

Now if nesting isn't something that is absolutely required, you could opt for this, much simpler solution instead, using multiple functions defined at the top level:

function Person(name, age) {
    this.name = name;
    this.age  = age;
}

function sayHelloToPerson(person) {
    console.log("Hello! " + person.name + ", it seems you are: " + person.age + " years old");
}

In action:

var me = new Person("SidOfc", 22);
sayHelloToPerson(me);
// => "Hello! SidOfc, it seems you are: 22 years old"

I cannot be sure about the usability of this code since the use case is too unclear but in this way, you keep the intention clear and you can always use function arguments to pass in any data your function needs (like person argument in this case.).

If you, like every other JS developer out there hates polluting the global namespace, wrap all functions related to x (Person in my example) directly inside it instead of nesting deeper than 1 level. e.g.

function Person(name, age) {
    this.name = name;
    this.age  = age;

    this.sayHello = function() {
        console.log("Hello! " + this.name + ", it seems you are: " + this.age + " years old");
        this.sayGoodbye();
    };

    this.sayGoodbye = function() {
        console.log("Goodbye! " + this.name);
    }
}

In action:

var me2 = new Person("SidOfc", 22);
me2.sayHello();
// => "Hello! SidOfc, it seems you are: 22 years old"
// since sayHello calls this.sayGoodbye() we also get:
// => "Goodbye! SidOfc"

The idea behind this is that you create all functions that are related to your x (Person in my example) at the same level of nesting.

They can then call other functions and properties within the instance easily without these crazy nesting structures. No parameters have to be added either since you're calling the function from that instance (of course, that will change depending on your needs).

As an added bonus, you don't need what you're asking for anymore since you can now just access the function using me2.somefunction() instead of having to dig deep.

Hope I could be of assistance ;)