Which Javascript library other than jQuery uses $? - javascript

$ is not a function is a common error message newbies encounter when trying to use JQuery in Drupal 7.
The explanation is that the usage of $ is disabled in Drupal to avoid conflicts with other libraries. But which other library is using $?

At least two major ones:
PrototypeJS,
Mootools,
It is probably because using one char for most commonly used function saves a lot of time. And due to some restrictions for characters in variable name in JavaScript there are actually two candidates for such one-char names: $ and _ (_ is used often for eg. gettext functions or throw-away variables). Thus I would rather expect that if some framework has some shortcut function with one char name, it is probably $.

One of the common problems is several different versions of JQuery itself, though I'm not sure that is the reason in Drupal.
Another possibility is Mootools

zepto also uses $, and is a lightweight alternative to jQuery:
http://zeptojs.com/
In addition, it matches most of the jQuery API.

Related

Mixing javascript and jquery within namespace

Was having trouble a few weeks ago getting jquery to run in firebug (esp on drupal sites). Apparently the issue was that Drupal was grabbing the $ variable, so I got a little namespace snippet (function($)...(Jquery)); that reclaimed the $. I have been using the namespace in firebug but geting inconsistent results, especially when mixing pure javascript and Jquery within the namespace. I understand that all Jquery is javascript and they work together, but looking at samples I see some weird variations in the way people deploy this namespace. As a general question but also specifically within Firebug context, is there any need to place javascript in any particular relation to namespaced Jquery (inside the namespace, function calls inside, function out, or any other convention)?
Thanks
If you meant preventing the $ from being reclaimed, there is no convention but there is a way. other frameworks also use the $ name. anything declared later to use $ will take over $. however, you can prevent it or get around it.
jQuery offers a lot of ways to prevent it via its noConflict() method. but my preferred method is just wrap them in a function. jQuery also uses the jQuery namespace. $ is a shorthand alias, a very common one too. so functions like $.each() is also jQuery.each(). what crazy framework uses jQuery as its namespace anyway?
an example of wrapping in a function is like this:
(function($){
//inside here, "$" is jQuery
}(jQuery)); //pass "jQuery"

Javascript function declarations with a dollar sign

This function declaration doesn't make sense to me. What does the $ sign do?
function $(id) { return document.getElementById(id); }
Also, this code is interfering with other Javascript code. If I comment it out, then the other Javascript code I'm trying to use works, but then I lose some other functionality.
Why might it be interfering with my other code.
What does the $ sign do?
Nothing special. It is just a character that can be used in variable/function names.
There has been a trend to use $ as the name to the gateway function for a number of libraries (including Mootools, Prototype and jQuery). This has two major problems:
It makes them conflict with each other
It violates the principles of self-documenting code
Also, this code is interfering with other Javascript code.
Presumably something else is using a variable called $ then.
You are declaring a function called $ that wraps document.getElementById, apparently for convenience. Nothing special.
Reference What characters are valid for JavaScript variable names?
As for the interference, there is likely another global variable called $, which is being clobbered. See jQuery.
JavaScript variables can start (and only consist of) a $ (amongst others).
Previously, the $ was added solely for machine generated variables.
This was in the spec I believe, but has since been removed (don't quote me).
Dollar sign was added to the language specifically for use by code
generators and macro processes, so if you have machines writing code
then the machines need to be confident that the variables that they
create will not conflict with variables that the humans are going to
create. To distinguish them, we’ll allow the machines to use dollar
sign. Some of the ninjas found out about that and thought oh, dollar
sign, I can use dollar sign as a function name, so they’re out there
doing that. And it looks stupid. I mean, look at a program with dollar
sign.
Source: Douglas Crockford.
If it is interfering with other code, you may be using a library which uses this identifier. If that's the case, look at the no conflict mode for that library (if it has one).
Let me guess: are you using jQuery or prototype?
$ and _ are valid characters in variable/function names. The code is the same as declaring function a(id) {return document.getElementById(id);}.
It's typically used as a shortcut for selecting an element because typing document.getElementById is much too long for how often it's used.

Reading a javascript script, why so many $ (dollar signs)?

I am trying to decipher a .js script and I am finding it filled with $ throughout? Is there any reason to use this? I'm pretty new to JavaScript.
I think you are reading a JavaScript library famously known as jQuery (or possibly another library). The $ is just a short form for a namespace or use as an identifier.
You can think of it like this jQuery('p') to select all the paragraphs on a page,
or for short form you can just write $('p').
Here is a link for jQuery tutorials/docs jQuery
Here is a list of standards section 7.6 describes it in detail ECMA Standard
A number of libraries have used $ as their primary symbol. It's nothing to do with JavaScript per se, but it's a short distinctive symbol and so libraries have tended to glom onto it. (You can start an identifier with $ in JavaScript, and identifiers can be one character long, so $ is a valid identifier, just like a or x.)
I know of at least three libraries that use $ for something:
jQuery - It's the all purpose function for jQuery, an alias of the jQuery function; more here.
Prototype - It's Prototype's replacement for document.getElementById, more here. Prototype also has $$, which is for looking things up via CSS selectors.
MooTools - Same use as Prototype (because MooTools is either "inspired by" or "forked from" Prototype, some years back, depending on who you ask), more here. And like Prototype, it has $$.
$ is a variable. A number of frameworks use it as a short hand for using it. Prototype and Jquery are the two big ones. This does not mean that the $ automatically is either one of those. It could be anything as anything in JavaScript can assign something to the $. This is something to be aware of, because when you start combining scripts from different sources, it's really easy for one to accidentally reassign a variable to something else.
Most likely it is a framework reference, but you'll have to read the code to be sure. At one point in time the $ was meant to be used to indicate that the code referenced by it was auto generated, but this is just a guideline.
if you're new to javascript, $() can look strange.
Try to think of it like
var $ = function(){
//do something
}
So the dollar sign is just the name of a variable like any other.
var myFunction = function(){
//do something
}
// this is exactly the same just a different name.
So the dollar sign has no special meaning in javascript.
Frameworks like to use it because you are using their functions so often, having to write e.g. jQuery() every time would be tedious. Having one character is nice and short.
I think they also have a preference for the $ symbol, purely because it is unusual so it is quickly distinguishable from other code.
A quick way to find out if it is jQuery is to do console.log(jQuery) if the console returns a string of code $() is jQuery. If you get undefined, it is something else.
Maybe you're reading jQuery code.
Because JavaScript lets you define variables which start with $ sign, or literally which are only $. For example, you can do:
var $ = "something";
alert($);
jQuery is a library built on JavaScript (the most popular at the time) and it has a global object to keep everything encapsulated. You access that global object using $.
The script is probably using a third party library such as Prototypejs or jQuery or he defined his own function $() which explain why the dollar sign appears so often in that script.
It's a jQuery function. That's what it is most probably. Might also be the Prototype library, or just a function that does something that's needed many times in the code, like getElementById etc
Without seeing the code, it sounds like the script you are looking at makes use of jQuery, as the $ is the default jQuery object.
Typically the $ will represent jQuery or another specific library (Moo Tools, etc.) . $ is the shortened form of referencing the jQuery object (or whatever library it was assigned). It makes the code much more readable and easy to use.
If you are just learning javascript, you will soon become very familiar with jQuery. :)
Either its jQuery or an old PHP habit by some javascript programmer :)
$ is only a function. It means you work with some javascript superstructure (framework).

What is the $ symbol used for in JavaScript

I am a JavaScript learner and have been researching this matter, but with no success. What is the $ symbol used for in JavaScript besides regular expressions? Any resources or readings regarding this would be appreciated. Thanks.
It doesn't mean anything special.
But because $ is allowed in identifier names, many Javascript libraries have taken to using $ as the "central" interface to them, or at least as a shortcut for accessing their functionality.
For example, if you're using jQuery and you say $("div"), this is a call to the $ function with argument "div". When you say $.post(), it's calling the post method on the $ object (Javascript is nice in that functions are first-class objects).
I became acquainted with it in JavaScript when I started using the Prototype framework. In Prototype, $ is simply the name of an often used function (very, very much simplified - a short for document.getElementById). Personally, I like the terseness of it.
Afaik, it's not used for anything by the language itself.
For what it's worth, Douglas Crockford advises against using $ in the variable/function names you write:
Do not use $ (dollar sign) or \
(backslash) in names.
Adding another, rather opinionated, quote from Mr. Crockford's talk "And Then There Was JavaScript":
Dollar sign was added to the language
specifically for use by code
generators and macro processes, so if
you have machines writing code then
the machines need to be confident that
the variables that they create will
not conflict with variables that the
humans are going to create. To
distinguish them, we’ll allow the
machines to use dollar sign. Some of
the ninjas found out about that and
thought oh, dollar sign, I can use
dollar sign as a function name, so
they’re out there doing that. And it
looks stupid. I mean, look at a
program with dollar sign.
If you are asking why some variables and function names start with $, then that is simply a convention when using jQuery and/or AngularJS.
In code that uses jQuery, $ is often used as a prefix for variables that contain jQuery selections.
e.g. var $container = $('.container');.
In AngularJS, they use the $ prefix to mean "core Angular functionality". That way, you know which methods and services are added by the framework, and which are custom to your application.

How to detect what Library is behind the $ function?

I am developing some JavaScript that should work with either Prototype.js or JQuery, thus I need some way to identify what is the primary library in use. How can I do that?
You can check for jQuery like this:
if (window.$ === window.jQuery)
Well, you could check for the presence of jQuery:
if(window.jQuery !== "undefined")
{
// jQuery Yay!
}
and then if it is assigned to $
if(window.jQuery === window.$)
{
// jQuery Yay!
}
Could jQuery noconflict help? Then you could use jQuery for jQuery and $ for prototype.
#SLaks and #Chacha102 are right for detecting jQuery, but if you want to make sure that if the $ function is not from jQuery, comes from PrototypeJS, you can:
​if (typeof $ == 'function'​​) {
if ($.fn && $.fn.jquery) { // $.fn.jquery contains the version number
// jquery
} else if (window.Prototype && Prototype.Version) {
// prototype
}
}​
I am developing some JavaScript that should work with either Prototype.js or JQuery, thus I need some way to identify what is the primary library in use. How can I do that?
Your question is ambiguous, there are two obvious meanings to me so I'll answer both.
If you mean you want write code that will work regardless of whether jQuery or Prototype.js has been used, the answer is that it is quite easy to write code that works regardless of the libraries that have been, or will be, loaded. So there is no need to discover which one has been used.
If you mean that you are going to write two separate scripts, one for jQuery and one for Prototype.js, then, depending on which one you "detect", you'll load one script or the other, then you basing your code on a very bad architecture. Neither of those libraries support a particularly wide selection of browsers and both need updating whenever a new version comes out, even of the "popular" ones they support.
Attempting to support both using separate scripts will create an on-going maintenance headache - times two. Or perhaps that is your intention.
--
Rob
Write it without dependency on any library and it should work fine with both jQuery and Prototype ;)
Seriously, isn't one of the main points of these library to avoid having to write three different variations of each line of code for each browser? Writing code to try to suit more than one library seems quite silly.
Anyway, looking at the documentation for either library for about 5 seconds should give you a hint as to what properties jq $ will have that pt $ will not. This suggests that you haven't really bothered to look at the differences between the frameworks (which is obviously going to be the best way to tell them apart, right?). Are you sure you know what you're getting yourself into?
As several have mentioned:
var whosThatDollarSign = typeof window.$=='undefined' ? 'none' : (window.$==window.jQuery ? 'jQuery' : 'not jQuery')

Categories

Resources