5

I've just discovered the way to create fake 'classes' in javascript, but I wonder how you can store them and still get easy access to their functions in an IDE.

Like this:

function Map(){
   this.width = 0;
   this.height = 0;
   this.layers = new Layers();
}

Now I've got a function that loops through an XML and creates multiple Map() objects. If I store them under a single variable, I can access them just fine, like:

map1 = new Map();
map1.height = 1;

But I don't know under what name they'll be stored! So I thought I could save them like this:

mapArray = {};
mapArray['map1'] = new Map();

But you can't access the functions like this: (At least the IDE code completion won't pick it up)

mapArray['map1'].height = 1;

I then thought this would be the best solution:

function fetch(name){
    var fetch = new Map();
    fetch = test[name];
}

That way I could write:

fetch('test').height = 1;

But this seems like it'll generate lots of overhead continuously copying variables like that.

Am I overlooking something simple?

Jelle De Loecker
  • 20,999
  • 27
  • 100
  • 142
  • Do you really want to rely on IDE code completion? – Josh Stodola Jul 16 '10 at 17:14
  • -1 I am sorry, but you need to test your JS in a browser, not in the IDE! – Josh Stodola Jul 16 '10 at 17:15
  • It's not about the code being correct, I know it's correct, but it does not auto complete like that and I just wanted to know if there's a better way at doing this. – Jelle De Loecker Jul 16 '10 at 17:17
  • If you want to access members dynamically, you can forget about auto-completion in the IDE. I think that goes for any language. – Josh Stodola Jul 16 '10 at 17:18
  • Agreed. Dynamic languages and auto-complete IDEs are forever at odds with one another. I think that's one of the key things keeping IronRuby and IronPython out of Visual Studio so far. – David Jul 16 '10 at 17:21
  • 1
    +1: c'mon guys its not a stupid question, he's just learning. it's important to get over this hump in the program-creation / program-testing learning phase. and he's not alone in his desire for strongly-typed containers, is he? do people find that a useless request? – eruciform Jul 16 '10 at 17:38
  • @skerit: i recommend you rewrite your title as "better option for strongly-typed containers in javascript" or something to that effect – eruciform Jul 16 '10 at 17:45
  • 1
    @skerit: also remove the "javascript:" in front of the title. some people here get persnickety when a tag is put up-front in a title. just a weird pet-peeve i see a lot. – eruciform Jul 16 '10 at 18:32
  • @Josh votes are NOT for the intelligence of the user!! They are for the value of the content. Plus people (like me) will upvote when they think a downvote was undeserved, even if an upvote wasn't deserved. The net effect of the downvote will be +8 rep for the user. – Gordon Gustafson Jul 16 '10 at 20:06
  • @Crazy I don't care about rep (or "people like you", for that matter). I hit -1 when I think the question is silly and not useful. It's my right. Let me live! – Josh Stodola Jul 16 '10 at 20:40

2 Answers2

4

The reason it doesn't work is that, in order for a map/array to allow anything inside it, it must assume only that the things inside are at most a very low-level thing on the inheritance tree. Unfortunately, unlike Vector<> and proxy objects in Actionscript, and similar things in other languages, this isn't easy to do in Javascript.

How would you overload the [] operator in javascript

The solution you have, if that's what functionality you would like, is about the simplest you can do. You can also make a .get(whatever) function that returns what [whatever] is, but specifically as the type you want. And you can make a .set(whatever,value) as well. However, it won't stop the code from shoving things in using [].

On one hand, it's not a good idea to depend too heavily on the IDE to do this for you, but attempting to strongly-type things better is not a bad idea in and of itself.

Update:

To answer your other question... First, to easily test simple JS things, it's nice to use the command-line version:

http://blog.thefrontside.net/javascript/learning-javascript-from-the-command-line

https://developer.mozilla.org/en/SpiderMonkey_Build_Documentation

Now, I'm also not recommending you do this just to hack the IDE, but just to show "a way" to do it:

# js
js> function FooDataClass(){ this.data = "argh!"; }
js> function FooClass(){ this.get = GetStuff; this.put = PutStuff; this.stuff = new FooDataClass(); }
js> function PutStuff(name,stuff){ this[name]= this.stuff = stuff; }    
js> function GetStuff(name){ return this.stuff = this[name]; }     
js> f = new FooClass()       
[object Object]
js> f.put('bar', new FooDataClass())       
js> f.get('bar')    
[object Object]
js> f.get('bar').data
argh!
js>

This might fake out your IDE for you.

Community
  • 1
  • 1
eruciform
  • 7,680
  • 1
  • 35
  • 47
  • Oh, so something like "function fetch(name){this.get = function(){alert('Name: ' + maps[name]);};}"? Hmm, that doesn't seem to work when you call fetch("something").get; (or .get()). Or do I have to create a variable out of this first? – Jelle De Loecker Jul 16 '10 at 18:39
1

One other way is to use a strongly-typed language that compiles to JavaScript. ST-JS is a Maven plugin that integrates also with Eclipse that allows you to write your code in Java. The corresponding JavaScript code is generated each time you save your file. By using Java as your original language, code auto-completion, refactoring, browse execution paths is very well supported by your IDE.

You don't need to learn much, as the APIs you need to know are exactly the ones you'd use in JavaScript: DOM or jQuery. Only that they are presented in a strongly-typed way.

LordOfThePigs
  • 11,050
  • 7
  • 45
  • 69
alex.c
  • 21
  • 1