如何在JavaScript中的函数内部访问变量？

Question

I am extremely new to javascript so apologize for questions that may be trivial ?

var foo = function () {
    a = "10";
    this.b = "20"; 
};

foo.c = "30";

console.log(foo.a); // undefined
console.log(foo.c); // prints 30.

var foo1 = new foo();
console.log(foo1.b) // prints 20

How to access var "a" ? Is it even possible ?

Answer 1

Actually, as long as you don't prefix the variable declaration with var it will be global:

var foo = function () {
    a = "10";
    this.b = "20"; 
};

foo();

console.log(a); // is 10

Compared to:

var foo = function () {
    var a = "10"; // private scope
    this.b = "20"; 
};

foo();  

console.log(a); // is undefined

Answer 2

Using global variables:

var a = 10;
var foo = function() {
    a = 15;
    this.b = 20;
};
console.log(a); // equals 10
foo();
console.log(a); // equals 15

If you wanted to actually access the variable a within the function, much like your example:

var foo = function() {
    a = 10; // private member
};

There is no way to access that private member.

Turns out when you declare a variable in this way, you have created a global variable. You can access it with console.log(a); and it will return 10 . However if you use var a = 10; inside the function, you will not be able to access this member.

Answer 3

What you can do is return an object in your constructor that defines public members:

function Foo() {
    var a = '10';

    function getA() {
        return a;
    }

    return {
        'a': a,
        'b': 20,
        'getA': getA
    };
}

var foo = new Foo();
console.log(foo.a) // 10
console.log(foo.b); // 20
console.log(foo.getA()); // 10

Answer 4

The code

console.log(foo.a);
console.log(foo.c);

implies that you believe that a would be set as the equivalent of foo.a = "10" , that is setting a static field of the "class" foo . This is not the case in JavaScript.

 a = "10";

This sets the global variable a to the value "10" , creating a global variable slot if necessary. This type of global assignment should be avoided and is caught by tools like JSLint.

 this.b = "20"; 

This sets the field of the object passed as the this parameter of the function to "20" , creating the field slot if necessary. Note that if you call foo directly, eg foo() , without new , the global scope is passed as this and this.b will also create a global variable. This type of error can be caught by strict mode. If you execute in strict mode, undefined is passed in as the this parameter and this will throw an exception.

var foo1 = new foo();

This creates a new, empty, object with the __proto__ property set to the value of the prototype property of foo and then calls foo passing the new object as the this parameter. All fields of __proto__ appear as the default values of fields of the object. This leads to the convention of adding methods to the prototype object of the constructor function and initializing fields in the constructor function. Inheritance can be simulated by constructing an object with the ancestor prototype object as its __proto__ value and assigning it to the functions prototype property of the constructor function. The constructor function would also call the ancestor constructor function (without new ), passing its this as the constructor function's this parameter (using apply or call ). This is all a bit awkward so ECMAScript 6 standardized this into a class construct which roughly translates to what I described.