1

I've looked at various answers on SO that answer similar questions, but none have really answered what I'm looking for. Examples here:

jQuery prototype and constructor function chaining

How does basic object/function chaining work in javascript?

I'd like to be able to chain methods from a function, but also use that function as a namespace. You can use the jquery object as a function like so:

$('selector');

but you can also reach methods straight from the $ variable, like so:

$.ajax(

How is this achieved? I've tried looking into the jquery source but it's near impossible to follow.

Community
  • 1
  • 1

2 Answers2

0

In Javascript functions are first-class objects. In particular, they are objects.

var greet = function(name) {console.log("Hello, " + name + "!"); };
greet.lang = "English";

Is legal. Then the following are both valid:

greet("Alice"); // prints Hello, Alice!
console.log(greet.lang); // prints English

I don't think it's accurate to call $(...) a constructor. In Javascript the line between constructor and function is blurred, but usually I would say a constructor is used with new, and, by convention, starts with a Capital letter. $ is simply an object, and in particular one that is a function, so may be called, and has other properties that may be accessed.

I also wouldn't call $, or in my example greet, a namespace. You may be thinking of the package syntax in Java where com.mycompany.util.StringFunctions would have the package/namespace com.mycompany.util, or in C++ where this might be written as MyCompany::Util::StringFunctions. Javascript doesn't quite have this concept, but in more or less any OO language it can be simulated with objects, as above. I would say $ just feels like it's a namespace because it's a rather huge library, but it's a huge library that is implemented as one object that is also a function, with many properties.

djechlin
  • 59,258
  • 35
  • 162
  • 290
  • That's... awesome. I had no idea. Thanks. –  Aug 27 '14 at 18:29
  • 1
    @ergusto languages become much nicer when functions are first class objects. You might like Haskell, or Lisp, or Scala. But Javascript is quite deep once you get past all its screwed up features (like `NaN !== NaN`). Enjoy. – djechlin Aug 27 '14 at 18:35
  • Yeah. I'm definitely starting to see the benefits to this. Thanks so much for the explanation. There's something else that I noticed while playing around with jQuery though - when writing something like $('div') in the console - jQuery returns a list of elements, yet it's still possible to run methods from that variable - i.e., if it's returning that list, how can it also return 'this' so that more methods can be run? –  Aug 27 '14 at 22:35
  • @ergusto I'm not actually sure, but one way or another it comes down to decorating or wrapping the type. e.g. `var a = [1,2,3]; a.newProp = 'hello';` works just as above. – djechlin Aug 27 '14 at 22:37
  • @ergusto there's subtleties with messing with arrays like that (e.g. what should the length be? what should be iterated over?) but there's other forms of array-like objects that work too. – djechlin Aug 27 '14 at 22:38
0

Just try this:

var foo = function (){ 
    alert ("I'm a function beep beep"); 
    };

foo.bar = "This is a string";

foo.otherFoo = function (param) {
    alert ("I'm also a function blup blup"+param);
    };

Then you can call the first function foo(), the variable foo.baror the second function with a value foo.otherFoo(" and more blup.")

Mark E
  • 3,403
  • 2
  • 22
  • 36