简体   繁体   中英

instantiating more than one object

in Javascript, I am creating an object like this:

var testObject = {
    value: "this is my initial value",
    setup: function() {
        value: "foo"
    }
};

Now, I would like to be able to instantiate this object, so I am trying this:

var myFirstObject  = new testObject();
var mySecondObject = new testObject();

so that when I call .setup() it will change the value only for that referenced newly created object. How can I achieve this? This code does not seem to work.

You don't instantiate objects, you instantiate functions.

var testObject = function() {
  this.value = "this is my initial value";
  this.setup = function() {
    this.value = "foo";
  }
}

var myFirstObject = new testObject();
var mySecondObject = new testObject();

EDIT: As per your comment, here's how you would bind to the DOM using functions on this object:

document.getElementById('idOfElem').addEventListener(
    'click', myFirstObject.clickHandler);

Bear in mind that you won't have any guarantee that the click handler will be executed in the context of your object (ie in your click handler, this might not be your testObject instance). If your clickHandler intends to modify the object's instance variable in any way, it's better to ensure the context like so:

document.getElementById('el').addEventListener('click', 
    function() { 
        myObj.handleClick.apply(myObj, arguments);
    });

You have numerous problems with your code. Firstly, you are trying to instantiate something, by calling a constructor function. Your testObject is not a function, so you'll cause a type error. You need to change testObject to be something along these lines:

var TestObject = function () {
    this.value = "this is my initial value";
};
TestObject.prototype.setup = function () {
    this.value = "foo";
};

Notice that I've used an uppercase T in that identifier... that's just best practice for a constructor function. Also notice how I've defined the setup method on the prototype . This is much more efficient than defining it as a property of the instance (with this.setup ) since only one copy of the function needs to exist in memory.

Now that TestObject is a function it can be instantiated by calling it with the new operator:

var myFirstObject = new TestObject();
var mySecondObject = new TestObject();

When you call the setup method on an instance of TestObject , it will apply to that instance. In other words, the value of this inside the setup method will refer to the instance on which the method has been called:

myFirstObject.setup();
console.log(myFirstObject.value); // 'foo'
console.log(mySecondObject.value); // 'this is my initial value'

You have incorrectly defined your constructor. Try this:

function testObject() {
    this.value = "this is my initial value";
    this.setup = function() {
        this.value = "foo"
    }
};

You can then call new testObject() .

The object notation your using is something you can compare with a static class. Here is the code for what you're trying to achieve:

var testObject = function(val) {
    this.value = "This is my initial value",

    if (arguments[0]) {
        this.value = val;
    }
};

var first = new testObject(); //uses initial value
var second = new testObject("hi"); //value = hi

If you'd like to write classes using this notation take a look at this: http://ejohn.org/blog/simple-javascript-inheritance/

function yourObject(value, setup) {
        return {
            value: value,
            setup: setup
        };
}

var myFirstObject = new yourObject('a', function(){});
var mySecond = new yourObject('b', function(){});

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM