The Anything virtual type is used in jQuery documentation to indicate that any type can be used or should be expected.
-A string in JavaScript is an immutable primitive value that contains none, one or many characters.
"I'm a String in JavaScript!"
@@ -115,14 +115,14 @@ String
typeof "some string"; // "string"
- Quoting
+Quoting
A string can be defined using single or double quotes. You can nest single quotes inside of double quotes, and the other way around. To mix double quotes with double quotes (or single with single), the nested ones have to be escaped with a backslash.
"You make 'me' sad."
'That\'s "cranking" good fun!'
"<a href=\"home\">Home</a>"
- Built-in Methods
+Built-in Methods
A string in JavaScript has some built-in methods to manipulate the string, though the result is always a new string - or something else, eg. split returns an array.
"hello".charAt( 0 ) // "h"
@@ -131,13 +131,13 @@ Built-in Methods
"hello".replace( /e|o/g, "x" ) // "hxllx"
"1,2,3".split( "," ) // [ "1", "2", "3" ]
- Length Property
+Length Property
All strings have a length property.
"Hello".length // 5
"".length // 0
- Boolean Default
+Boolean Default
An empty string defaults to false:
!"" // true
@@ -147,7 +147,7 @@ Boolean Default
!new Boolean( false ) // false
- htmlString
+htmlString
A string is designated htmlString in jQuery documentation when it is used to represent one or more DOM elements, typically to be created and inserted in the document. When passed as an argument of the jQuery() function, the string is identified as HTML if it starts with <tag ... >) and is parsed as such until the final > character. Prior to jQuery 1.9, a string was considered to be HTML if it contained <tag ... > anywhere within the string.
When a string is passed as an argument to a manipulation method such as .append(), it is always considered to be HTML since jQuery's other common interpretation of a string (CSS selectors) does not apply in those contexts.
For explicit parsing of a string to HTML, the $.parseHTML() method is available as of jQuery 1.8.
@@ -166,7 +166,7 @@ htmlString
// Appends hellowaitbye:
$( "hellowaitbye" ).appendTo( "body" );
Numbers in JavaScript are double-precision 64-bit format IEEE 754 values. They are immutable primitive values, just like strings. All operators common in c-based languages are available to work with numbers (+, -, *, /, %, =, +=, -=, *=, /=, ++, --).
12
@@ -177,7 +177,7 @@ Number
typeof 12 // "number"
typeof 3.543 // "number"
- Boolean Default
+Boolean Default
If a number is zero, it defaults to false:
!0 // true
@@ -189,13 +189,13 @@ Boolean Default
0.1 + 0.2 // 0.30000000000000004
- Math
+Math
JavaScript provides utilities to work with numbers in the Math object:
Math.PI // 3.141592653589793
Math.cos( Math.PI ) // -1
- Parsing Numbers
+Parsing Numbers
parseInt and parseFloat help parsing strings into numbers. Both do some implicit conversion if the base isn't specified:
parseInt( "123" ) = 123 // (implicit decimal)
@@ -205,7 +205,7 @@ Parsing Numbers
parseInt( "11", 2 ) = 3 // (explicit binary)
parseFloat( "10.10" ) = 10.1
- Numbers to Strings
+Numbers to Strings
When appending numbers to string, the result is always a string. The operator is the same, so be careful: If you want to add numbers and then append them to a string, put parentheses around the numbers:
"" + 1 + 2; // "12"
@@ -218,7 +218,7 @@ Numbers to Strings
String( 1 ) + String( 2 ); // "12"
String( 1 + 2 ); // "3"
- NaN and Infinity
+NaN and Infinity
Parsing something that isn't a number results in NaN. isNaN helps to detect those cases:
parseInt( "hello", 10 ) // NaN
@@ -241,19 +241,19 @@ NaN and Infinity
Infinity === Infinity // true
- Integer
+Integer
An integer is a plain Number type, but whenever explicitly mentioned, indicates that a non-floating-point number is expected.
- Float
+Float
A float is a plain Number type, just as Integer, but whenever explicitly mentioned, indicates that a floating-point number is expected.
- Boolean
+Boolean
A boolean in JavaScript can be either true or false:
if ( true ) console.log( "always!" );
if ( false ) console.log( "never!" );
- Object
+Object
Everything in JavaScript is an object, though some are more objective (haha). The easiest way to create an object is the object literal:
var x = {};
@@ -266,7 +266,7 @@ Object
typeof {} // "object"
- Dot Notation
+Dot Notation
You can write and read properties of an object using the dot notation:
y.name // "Pete"
@@ -274,7 +274,7 @@ Dot Notation
x.name = y.name + " Pan" // "Pete Pan"
x.age = y.age + 1 // 16
- Array Notation
+Array Notation
Or you write and read properties using the array notation, which allows you to dynamically choose the property:
var operations = {
@@ -285,7 +285,7 @@ Array Notation
operations[ operation ] // "++"
operations[ "multiply" ] = "*"; // "*"
- Iteration
+Iteration
Iterating over objects is easy with the for-in-loop:
var obj = {
@@ -307,13 +307,13 @@ Iteration
The drawback is that the callback is called in the context of each value and you therefore lose the context of your own object if applicable. More on this below at Functions.
- Boolean default
+Boolean default
An object, no matter if it has properties or not, never defaults to false:
!{} // false
!!{} // true
- Prototype
+Prototype
All objects have a prototype property. Whenever the interpreter looks for a property, it also checks in the object's prototype if the property is not found on the object itself. jQuery uses the prototype extensively to add methods to jQuery instances. Internally, jQuery makes jQuery.fn an alias of jQuery.prototype so you can use either one (though plugin developers have standardized on fn).
var form = $("#myform");
@@ -332,7 +332,7 @@ Prototype
form.clearForm();
- Array
+Array
Arrays in JavaScript are mutable lists with a few built-in methods. You can define arrays using the array literal:
var x = [];
@@ -348,7 +348,7 @@ Array
x[ 0 ] = 1;
y[ 2 ] // 3
- Iteration
+Iteration
An array has a length property that is useful for iteration:
for ( var i = 0; i < a.length; i++ ) {
@@ -398,13 +398,13 @@ Iteration
Note: .unshift() method does not return a length property in Internet Explorer.
- Boolean Default
+Boolean Default
An array, no matter if it has elements or not, never defaults to false:
![] // false
!![] // true
- Array<Type> Notation
+Array<Type> Notation
In the jQuery API you'll often find the notation of Array<Type>:
dragPrevention Array<String>
@@ -414,7 +414,7 @@ Array<Type> Notation
Array-Like Object
Either a true JavaScript Array or a JavaScript Object that contains a nonnegative integer length property and index properties from 0 up to length - 1. This latter case includes array-like objects commonly encountered in web-based code such as the arguments object and the NodeList object returned by many DOM methods.
When a jQuery API accepts either plain Objects or Array-Like objects, a plain Object with a numeric length property will trigger the Array-Like behavior.
- PlainObject
+PlainObject
The PlainObject type is a JavaScript object containing zero or more key-value pairs. The plain object is, in other words, an Object object. It is designated "plain" in jQuery documentation to distinguish it from other kinds of JavaScript objects: for example, null, user-defined arrays, and host objects such as document, all of which have a typeof value of "object." The jQuery.isPlainObject() method identifies whether the passed argument is a plain object or not, as demonstrated below:
@@ -434,7 +434,7 @@ PlainObject
Null
The null keyword is a JavaScript literal that is commonly used to express the absence of an intentional value.
- Date
+Date
The Date type is a JavaScript object that represents a single moment in time. Date objects are instantiated using their constructor function, which by default creates an object that represents the current date and time.
@@ -446,7 +446,7 @@ Date
new Date( 2014, 0, 1, 8, 15 );
- Function
+Function
A function in JavaScript can be either named or anonymous. Any function can be assigned to a variable or passed to a method, but passing member functions this way can cause them to be called in the context of another object (i.e. with a different "this" object).
function named() {}
@@ -463,7 +463,7 @@ Function
The type of a function is "function".
- Arguments
+Arguments
Inside a function a special variable "arguments" is always available. It's similar to an array in that it has a length property, but it lacks the built-in methods of an array. The elements of the pseudo-array are the argument of the function call.
function log( x ) {
@@ -478,7 +478,7 @@ Arguments
var awesome = function() { return arguments.callee; }
awesome() === awesome // true
- Context, Call and Apply
+Context, Call and Apply
In JavaScript, the variable "this" always refers to the current context. By default, "this" refers to the window object. Within a function this context can change, depending on how the function is called.
All event handlers in jQuery are called with the handling element as the context.
@@ -499,7 +499,7 @@
Context, Call and Apply
scope.call( "foobar", [ 1, 2 ] ); // "foobar", 1
scope.apply( "foobar", [ 1, 2 ] ); // "foobar", 2
- Scope
+Scope
In JavaScript, all variables defined inside a function are only visible inside that function scope. Consider the following example:
// global
@@ -513,7 +513,7 @@ Scope
It defines a variable x in the global scope, then defines an anonymous function and executes it immediately (the additional parentheses are required for immediate execution). Inside the function another variable x is defined with a different value. It is only visible within that function and doesn't overwrite the global variable.
- Closures
+Closures
Closures are created whenever a variable that is defined outside the current scope is accessed from within some inner scope. In the following example, the variable counter is visible within the create, increment, and print functions, but not outside of them.
function create() {
@@ -533,7 +533,7 @@ Closures
The pattern allows you to create objects with methods that operate on data that isn't visible to the outside—the very basis of object-oriented programming.
- Proxy Pattern
+Proxy Pattern
Combining the above knowledge gives you as a JavaScript developer quite a lot of power. One way to combine that is to implement a proxy pattern in JavaScript, enabling the basics of aspect-oriented programming (AOP):
(function() {
@@ -547,7 +547,7 @@ Proxy Pattern
The above wraps its code in a function to hide the "proxied"-variable. It saves jQuery's setArray-method in a closure and overwrites it. The proxy then logs all calls to the method and delegates the call to the original. Using apply(this, arguments) guarantees that the caller won't be able to notice the difference between the original and the proxied method.
- Callback
+Callback
A callback is a plain JavaScript function passed to some method as an argument or option. Some callbacks are just events, called to give the user a chance to react when a certain state is triggered. jQuery's event system uses such callbacks everywhere:
$( "body" ).on( "click", function( event ) {
@@ -564,7 +564,7 @@ Callback
Instead of always returning false, the callback could check fields of the form for validity, and return false only when the form is invalid.
- Error
+Error
An instance of an Error object is thrown as an exception when a runtime error occurs. Error can also be used as base to define user custom exception classes. In JavaScript an error can be thrown as shown below:
throw new Error( "The argument provided is incorrect" );
@@ -574,7 +574,7 @@ Error
var obj = null;
console.log( obj.foo() );
- Selector
+Selector
A selector is used in jQuery to select DOM elements from a DOM document. That document is, in most cases, the DOM document present in all browsers, but can also be an XML document received via Ajax.
The selectors are a composition of CSS and custom additions. All selectors available in jQuery are documented on the Selectors API page.
@@ -596,7 +596,7 @@
Event
The standard events in the Document Object Model are: blur, focus, load, resize, scroll, unload, beforeunload, click, dblclick, mousedown, mouseup, mousemove, mouseover, mouseout, mouseenter, mouseleave, change, select, submit, keydown, keypress, and keyup. Since the DOM event names have predefined meanings for some elements, using them for other purposes is not recommended. jQuery's event model can trigger an event by any name on an element, and it is propagated up the DOM tree to which that element belongs, if any.
- Element
+Element
An element in the Document Object Model (DOM) can have attributes, text, and children. It provides methods to traverse the parent and children and to get access to its attributes. Due to inconsistencies in DOM API specifications and implementations, however, those methods can be a challenge to use. jQuery provides a "wrapper" around those elements to help interacting with the DOM. But sometimes you will be working directly with DOM elements, or see methods that (also) accept DOM elements as arguments.
Whenever you call jQuery's .each() method or one of its event methods on a jQuery collection, the context of the callback function — this — is set to a DOM element.
@@ -611,7 +611,7 @@
Element
You could replace this.value with $(this).val() to access the value of the text input via jQuery, but in that case you wouldn't gain anything.
- Text
+Text
Text is a node of the Document Object Model (DOM) that represents the textual content of an element or an attribute. Consider the following code:
<p id="target"><b>Hello</b> world</p>
@@ -621,7 +621,7 @@ Text
you obtain two children. The first one is the element representing the b tag. The second child is a text node containing the string " world".
- jQuery
+jQuery
A jQuery object contains a collection of Document Object Model (DOM) elements that have been created from an HTML string or selected from a document. Since jQuery methods often use CSS selectors to match elements from a document, the set of elements in a jQuery object is often called a set of "matched elements" or "selected elements".
The jQuery object itself behaves much like an array; it has a length property and the elements in the object can be accessed by their numeric indices [0] to [length-1]. Note that a jQuery object is not actually a Javascript Array object, so it does not have all the methods of a true Array object such as join().
@@ -638,7 +638,7 @@
jQuery
$( ".badEntry" ).css({ color: "red" });
- XMLHttpRequest
+XMLHttpRequest
Some of jQuery's Ajax functions return the native XMLHttpRequest (XHR) object, or pass it as an argument to success/error/complete handlers, so that you can do additional processing or monitoring on the request. Note that Ajax functions only return or pass an XHR object when an XHR object is actually used in the request. For example, JSONP requests and cross-domain GET requests use a script element rather than an XHR object.
Although the XHR object is a standard, there are variations in its behavior on different browsers. Refer to the WHATWG site and Mozilla Developer Network for more information:
@@ -646,7 +646,7 @@
XMLHttpRequest
- jqXHR
+jqXHR
As of jQuery 1.5, the $.ajax() method returns the jqXHR object, which is a superset of the XMLHTTPRequest object. For more information, see the jqXHR section of the $.ajax entry
Thenable