Data types
From SpinetiX Support Wiki
Contents
Introduction
JavaScript provides several built-in data types, grouped under Primitives and Objects. In addition to these standard types, this page also documents virtual types like jSignage Object, Plain Object, Element, Selector etc.
Primitives
Undefined
undefined
is a property of the global object. The initial value of undefined
is the primitive value undefined
.
A variable that has not been assigned a value is of type undefined
. If such a variable is evaluated by a statement / method, the result is undefined
. Similarly, evaluating a function that doesn't return any value, results in undefined
as well.
Null
The value null
is the only value of the Null Type. null
is a literal (not a property of the global object like undefined
).
Boolean
The primitive boolean values are true
and false
. The Boolean object is an object wrapper for a boolean value.
Number
According to the ECMAScript standard, there is only one number type: the "double-precision 64-bit binary format IEEE 754 value". There is no specific type for integers. In addition to being able to represent floating-point numbers, it has some symbolic values: +Infinity
, -Infinity
and NaN
(not-a-number).
The Number
JavaScript object is a wrapper object allowing you to work with numerical values. JavaScript provides utilities to work with numbers in the Math
object.
parseInt
and parseFloat
functions help parsing strings into numbers. Parsing something that isn't a number results in NaN
. isNaN
function helps to detect those cases. Division by zero results in Infinity
.
See also: jQuery type Number.
String
A string in JavaScript is an immutable object that contains none, one or many characters. All strings have a length property and an empty string defaults to false.
Note that JavaScript distinguishes between String objects (i.e. using the new
keyword) and primitive string values / literals (i.e. denoted by quotes).
A string literal can be defined using single or double quotes. You can nest single quotes inside of double quotes, and the other way around. To mix the same type of quotes, the nested ones have to be escaped with a backslash.
There are two ways to access an individual character in a string: the charAt
method and the array-like bracket notation.
See also: jQuery type String.
Objects
Object
A JavaScript object is a mapping between keys and values.
An object can be created using either the object literal syntax or the new Object()
syntax. The object properties can be added and removed after creation and the property values can be of any type, including other objects (which enables building complex data structures).
{ [ nameValuePair1 [, nameValuePair2 [, ...nameValuePairN] ] ] }
new Object( [ value ] )
You can write and read properties of an object using the dot notation or the array notation. An object, no matter if it has properties or not, never defaults to false.
See also: jQuery type Object.
Function
Functions are regular objects with the additional capability of being callable.
new Function ([arg1[, arg2[, ...argN]],] functionBody)
A function can be either named or anonymous. It can be assigned to a variable or passed to a method. Inside a function a special pseudo-array variable "arguments" is always available. It has a length property and a callee property (which refers to the function you're inside of) and its elements are the arguments of the function call. All arguments passed to the function are treated as the names of the identifiers of the parameters in the function to be created, in the order in which they are passed.
See also: jQuery type Function.
Array
Arrays are regular objects for which there is a particular relationship between integer-key-ed properties and the length
property.
An array can be created using either the array literal syntax or the new Array()
syntax.
[element0, element1, ..., elementN]
new Array(element0, element1, ..., elementN)
new Array(arrayLength)
JavaScript arrays are zero-indexed: the first element of an array is at index 0 and the last element is at the index equal to the value of the array's length
property minus 1. Neither the length of a JavaScript array, nor the types of its elements are fixed. An array's size length can grow or shrink at any time.
A JavaScript array's length
property and numerical properties are connected. Several of the built-in array methods (e.g., join
, slice
, indexOf
etc.) take into account the value of an array's length property when they're called. Other methods (e.g., push
, splice
etc.) also result in updates to an array's length
property.
The result of a match between a regular expression and a string can also create a JavaScript array. This array has properties and elements which provide information about the match. Such an array is returned by RegExp.exec
, String.match
and String.replace
.
An array, no matter if it has elements or not, never defaults to false.
Array.<Type> notation
- This indicates not only that an array is expect, but also specifies the expected type for the array values.
See also: jQuery type Array.
Date
Date objects are the best choice to represent single moments in time. Date objects are based on a time value that is the number of milliseconds since 1 January, 1970 UTC.
new Date();
new Date(value);
new Date(dateString);
new Date(year, month [, day, hour, minute, second, millisecond]);
Note that JavaScript Date objects can only be instantiated by calling JavaScript Date as a constructor: calling it as a regular function (i.e. without the new
operator) will return a string rather than a Date
object; unlike other JavaScript object types, JavaScript Date objects have no literal syntax.
Virtuals
Plain Object
The Plain Object type is a regular JavaScript literal object containing zero or more key-value pairs. It is designated "plain" in jSignage documentation to distinguish it from other kinds of JavaScript objects like null
, user-defined arrays, host objects (such as document
) etc., all of which have a typeof
value of "object."
{ [ nameValuePair1 [, nameValuePair2 [, ...nameValuePairN] ] ] }
Example:
$(function(){
$.media(
{ id: 'movie1', width: 1280, height: 720, href: 'clip.avi' } // this is a Plain Object
).addTo( 'svg' );
});
Callback
A callback is a plain JavaScript function passed as an argument to some method, which is expected to call back (execute) the argument function at some convenient time. The invocation may be immediate as in a synchronous callback (blocking callbacks) or it might happen at a later time, as in an asynchronous callback (deferred callbacks).
Callbacks are most commonly used to perform some actions when certain events (e.g., document load, mouse / keyboard events, timers etc.) are triggered.
jSignage Object
A jSignage object contains a collection of SVG Elements that have been created or selected from an SVG document using the jSignage()
function or its commonly used alias function, $()
. The jSignage 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 jSignage object is not actually a JavaScript Array object, so it does not have all the methods of a true Array object such as join()
.
Many jSignage methods return the jSignage object itself, so that method calls can be chained together; for instance:
$.textArea( { some_attributes } ).text( 'some text' ).click( function() { ... }).removeAfter().addTo('svg');
jSignage Transition Object
The jSignage Transition Object is a plain object with particular keys used to define jSignage transitions.
SVG Node
An SVG Node object represents a single node in the SVG document tree and is the primary data-type for the entire SVG Micro DOM (Document Object Model).
A node can have attributes, text content and children, consequently, the associated SVG node object provides:
- properties for getting the node's attributes (
localName, textContent, childCount, namespaceURI
) or for traversing purposes (parentNode, ownerDocument, nextSibling, previousSibling, firstChild, lastChild
); - methods for dealing with children (
appendChild(), insertBefore(), removeChild()
) and for cloning (cloneNode()
).
SVG Element
An SVG Element object represents a single element (within the SVG namespace defined by the SVG language specification) in the SVG / XML document.
The SVG Element object inherits all the properties and methods of the associated SVG Node, and adds the following:
- properties for traversing purposes (
nextElementSibling, previousElementSibling, firstElementChild, lastElementChild
) and for getting the number of children (childElementCount
); - methods for getting the element's attributes (
getAttribute(), getAttributeNS(), setAttribute(), setAttributeNS()
).
Selector
A selector is used in jSignage to select SVG DOM elements from an SVG DOM document. If Selector
is specified as the type of argument, it accepts everything that the jSignage constructor accepts (String
, XML string
, SVG Element
).
Paint
The paint
type describes the color (possibly with some level of transparency) or the gradient (linear or radial) used for the fill or stroke operation. The keyword none
indicates that no paint shall be applied, while currentColor
indicates that the painting shall be done using the color specified by the current animated value of the 'color' property.
See Specifying paint section in the SVG specification for more details.
Color
This is a String representing a color within the sRGB color space. A valid color is usually specified as a three or six digit hex code (e.g., '#rgb', '#rrggbb') or as a color keyword (e.g., 'black', 'white', 'blue', 'red' etc.) - see syntax for color values page for more details. The keyword currentColor
can be used in the same manner as specified above.
The SharedVariable object is a JavaScript object containing information and methods specific to Shared Variables.