JavaScript父级和子级类/对象的此问题

Question

I'm not quite sure how to explain it in words so here is some example code to show what I'm trying to achieve:

function carFactory(){
    this.wheelsPerCar = 4;

    this.car = function() {
        this.wheels = [];
        this.addWheels = function(){
            for(var i = 0; i < this.wheelsPerCar; i++){
                var wheel = new this.wheel();
                this.wheels.push(wheel);
            }
        };

        this.wheel = function(){
        };
    };
};

var cf = new carFactory();
var myCar = new cf.car();
myCar.addWheels();

When I print myCar.wheels I get an empty array back. I think this is because this.wheelsPerCar is out of scope. I think I'm likely designing this completely wrong as I haven't work much with JavaScript classes and objects.

Answer 1

You're kind of right. wheelsPerCar is not on the car, it's on the factory.

You could just change this.wheelsPerCar = 4; to be var wheelsPerCar = 4; then just use wheelsPerCar without this and it will be in scope.

Answer 2

The carFactory instance and the car instance don't have a parent-child relationship. They're defined together, but there's no class inheritance there.

You could expose the wheelsPerCar property to the inner car instance in 2 ways:

1. Pass an instance of carFactory to the car constructor function.
2. Set a var wheelsPerCar = this.wheelsPerCar variable in the car scope so it can access it without the this .

Answer 3

this.addWheels = function(){
     debugger;
     for(var i = 0; i < this.wheelsPerCar; i++){
         var wheel = new this.wheel();
         this.wheels.push(wheel);
     }
};

this.wheelsPerCar is undefined, 0 < undefined, evaluate as false. You want to read this Scope and this in JavaScript first. Also, you should be able to debug this with any browser.