1

Can an object's property be assigned with a statement? Consider the following bit of code:

var obj = {
    canvas: document.getElementById('mainCanvas').getContext('2d');
}

The way I understand that this doesn't work is because you're not actually 'assigning' the statement to the canvas property of obj. Instead I've done something like this:

var obj = {
    initCanvas: function() {
        this.canvas = document.getElementById('mainCanvas').getContext('2d');
    }
}

This works, but it seems sloppy to me. Is there a better way to define this or is using this method the preferred way to implement what I'm talking about?

  • 1
    The first example is perfectly fine. What exactly "does not work"? – Felix Kling Jan 27 '15 at 21:00
  • 3
    @FelixKling: Except for the trailing semicolon :-) – Bergi Jan 27 '15 at 21:00
  • 1
    @Bergi: I just noticed that :-/ | To answer your question, no, you have to use an **expression** inside an object literal. However, `document.getElementById('mainCanvas').getContext('2d')` is a valid expression, just remove the `;`. – Felix Kling Jan 27 '15 at 21:00
  • @MrZalib: Do you actually want to *execute* that statement, and assign the result value to the property; or do you want to assign the statement itself? – Bergi Jan 27 '15 at 21:01
  • @Bergi: I'm looking to execute the statement. @Felix Kling: In the first example Chrome reports and error "Cannot read property `getContext` of null" –  Jan 27 '15 at 21:07
  • @MrZalib: Then you're looking for an expression, as Felix noted :-) And yeah, you [actually don't want to execute it](http://stackoverflow.com/q/14028959/1048572), at least not right now – Bergi Jan 27 '15 at 21:14
  • @Berg: If i'm understanding that link correctly then the fact that my call to `init()` in my html document which looks like: It can't get the context because canvas is technically after `onLoad` gets called? –  Jan 27 '15 at 21:23
  • @MrZalib: No, that `init()` call should work (it's calling `obj.initCanvas()`?); but when you execute the definition of `obj = {…}` outside of `init` while calling `document.getElementById` in that, it won't work. – Bergi Jan 27 '15 at 21:26
  • @Bergi: The example I used isn't exactly the code I'm using. My `init()` method creates an object using `Object.create()`, it's within that object that I'm trying to set the property to that DOM element. Essentially so that property can be used to draw to the canvas. Edit: My apologies if this doesn't make a whole lot of sense. I can edit the question to include the original code I'm working with. –  Jan 27 '15 at 21:32
  • Simply put you can't access a DOM element before it exist. See http://stackoverflow.com/q/14028959/218196. If you have problems with the first example, it's not because of shortcomings of the literal syntax, but because you are evaluating the object literal before the DOM element you are trying to access exists. – Felix Kling Jan 28 '15 at 00:57
  • This would be getting called after an onLoad is called. Wouldn't the element exist in this case because the html page is completely loaded before the script is called? Or is that not how onLoad works? –  Jan 28 '15 at 01:32

0 Answers0