Mention in the Docs that $splat is not exactly the same as Array.from for Array-like...
[mootools/dkf.git] / Docs / Types / Array.md
blob8c49a78174bfa07deed476473ff08c79478c96bc
1 Type: Array {#Array}
2 ====================
4 A collection of Array methods and functions.
6 ### See Also:
8 - [MDC Array][]
11 Function: Array.each {#Array:Array-each}
12 ----------------------------------
14 Used to iterate through arrays, or iterables that are not regular arrays, such as built in getElementsByTagName calls or arguments of a function.
16 ### Syntax:
18         Array.each(iterable, fn[, bind]);
20 ### Arguments:
22 1. iterable - (*array*) The array to iterate through.
23 2. fn       - (*function*) The function to test for each element.
24 3. bind     - (*object*, optional) The object to use as 'this' within the function. For more information see [Function:bind][].
26 #### Argument: fn
28 ##### Syntax:
30         fn(item, index, object)
32 ##### Arguments:
34 1. item   - (*mixed*) The current item in the array.
35 2. index  - (*number*) The current item's index in the array. In the case of an object, it is passed the key of that item rather than the index.
36 3. object - (*mixed*) The actual array/object.
38 ### Example:
40         Array.each(['Sun', 'Mon', 'Tue'], function(day, index){
41                 alert('name:' + day + ', index: ' + index);
42         }); // alerts 'name: Sun, index: 0', 'name: Mon, index: 1', etc.
44 ### See Also:
46 - [Array:each](#Array:each)
48 ### Notes:
50 This is an array-specific equivalent of *$each* from MooTools 1.2.
54 Function: Array.clone {#Array:Array-clone}
55 ------------------------------------
57 Returns a copy of the passed array.
59 ### Syntax:
61         var clone = Array.clone(myArray);
63 ### Arguments:
65 1. myArray      - (*array*) The array you wish to copy.
67 ### Returns:
69 * (*array*) a copy of the passed array.
71 ### Example:
73         var myArray = ['red', 'blue', 'green'];
74         var otherArray = Array.clone(myArray);
76         var myArray[0] = 'yellow';
78         alert(myArray[0]);              // alerts 'yellow'
79         alert(otherArray[0])    // alerts 'red'
81 ### Notes:
83 This is an array-specific equivalent of *$unlink* from MooTools 1.2.
87 Function: Array.from {#Array:Array-from}
88 ----------------------------------
90 Converts the argument passed in to an array if it is defined and not already an array.
92 ### Syntax:
94         var splatted = Array.from(obj);
96 ### Arguments:
98 1. obj - (*mixed*) Any type of variable.
100 ### Returns:
102 * (*array*) If the variable passed in is an array, returns the array. Otherwise, returns an array with the only element being the variable passed in.
104 ### Example:
106         Array.from('hello'); // returns ['hello'].
107         Array.from(['a', 'b', 'c']); // returns ['a', 'b', 'c'].
109 ### Notes:
111 This is equivalent to *$splat* from MooTools 1.2, with the exception of Array-like Objects such as NodeList or FileList which `Array.from` does transform in
112 Arrays and `$splat` not.
116 Array method: each {#Array:each}
117 ---------------------------------
119 Calls a function for each element in the array.
121 ### Syntax:
123         myArray.each(fn[, bind]);
125 ### Arguments:
127 1. fn   - (*function*) The function which should be executed on each item in the array. This function is passed the item and its index in the array.
128 2. bind - (*object*, optional) The object to be used as 'this' in the function. For more information see [Function:bind][].
130 #### Argument: fn
132 ##### Syntax
134         fn(item, index, array)
136 ##### Arguments:
138 1. item   - (*mixed*) The current item in the array.
139 2. index  - (*number*) The current item's index in the array.
140 3. array  - (*array*) The actual array.
142 ### Examples:
144         //Alerts "0 = apple", "1 = banana", and so on:
145         ['apple', 'banana', 'lemon'].each(function(item, index){
146                 alert(index + " = " + item);
147         }); //The optional second argument for binding isn't used here.
150 ### See Also:
152 - [Array.each](#Array:Array-each)
153 - [MDC Array:forEach][]
155 ### Notes:
157 - This method is only available for browsers without native [MDC Array:forEach][] support.
164 Array method: invoke {#Array:invoke}
165 --------------------------
167 Returns an array with the named method applied to the array's contents.
169 ### Syntax:
171         var arr = myArray.invoke(method[, arg, arg, arg ...])
173 ### Arguments:
175 1. method - (*string*) The method to apply to each item in the array.
176 2. arg - (*mixed*) Any number of arguments to pass to the named method.
178 ### Returns:
180 * (*array*) A new array containing the results of the applied method.
182 ### Example:
184         var foo = [4, 8, 15, 16, 23, 42];
185         var bar = foo.invoke('limit', 10, 30);  //bar is now [10, 10, 15, 16, 23, 30]
187 ### Notes:
189 The method that is invoked is a method of each of the items.
190 If the method does not exist, then an error will be thrown. For example:
192         [0, false, 'string'].invoke('limit', 0, 10); // throws an error!
194 Array method: every {#Array:every}
195 ----------------------------
197 Returns true if every element in the array satisfies the provided testing function.
198 This method is provided only for browsers without native [Array:every][] support.
200 ### Syntax:
202         var allPassed = myArray.every(fn[, bind]);
204 ### Arguments:
206 1. fn   - (*function*) The function to test for each element.
207 2. bind - (*object*, optional) The object to use as 'this' in the function. For more information see [Function:bind][].
209 #### Argument: fn
211 ##### Syntax:
213         fn(item, index, array)
215 ##### Arguments:
217 1. item   - (*mixed*) The current item in the array.
218 2. index  - (*number*) The current item's index in the array.
219 3. array  - (*array*) The actual array.
221 ### Returns:
223 * (*boolean*) If every element in the array satisfies the provided testing function, returns true. Otherwise, returns false.
225 ### Examples:
227         var areAllBigEnough = [10, 4, 25, 100].every(function(item, index){
228                 return item > 20;
229         }); // areAllBigEnough = false
232 ### See Also:
234 - [MDC Array:every][]
238 Array method: filter {#Array:filter}
239 ------------------------------
241 Creates a new array with all of the elements of the array for which the provided filtering function returns true.
242 This method is provided only for browsers without native [Array:filter][] support.
244 ### Syntax:
246         var filteredArray = myArray.filter(fn[, bind]);
248 ### Arguments:
250 1. fn   - (*function*) The function to test each element of the array. This function is passed the item and its index in the array.
251 2. bind - (*object*, optional) The object to use as 'this' in the function. For more information see [Function:bind][].
253 #### Argument: fn
255 ##### Syntax:
257         fn(item, index, array)
259 ##### Arguments:
261 1. item   - (*mixed*) The current item in the array.
262 2. index  - (*number*) The current item's index in the array.
263 3. array  - (*array*) The actual array.
265 ### Returns:
267 * (*array*) The new filtered array.
269 ### Examples:
271         var biggerThanTwenty = [10, 3, 25, 100].filter(function(item, index){
272                 return item > 20;
273         }); // biggerThanTwenty = [25, 100]
275 ### See Also:
277 - [MDC Array:filter][]
281 Array method: clean {#Array:clean}
282 ----------------------------
284 Creates a new array with all of the elements of the array which are defined (i.e. not null or undefined).
286 ### Syntax:
288         var cleanedArray = myArray.clean();
290 ### Returns:
292 * (*array*) The new filtered array.
294 ### Examples:
296         var myArray = [null, 1, 0, true, false, 'foo', undefined, ''];
297         myArray.clean() // returns [1, 0, true, false, 'foo', '']
301 Array method: indexOf {#Array:indexOf}
302 --------------------------------
304 Returns the index of the first element within the array equal to the specified value, or -1 if the value is not found.
305 This method is provided only for browsers without native [Array:indexOf][] support.
307 ### Syntax:
309         var index = myArray.indexOf(item[, from]);
311 ### Returns:
313 * (*number*) The index of the first element within the array equal to the specified value. If not found, returns -1.
315 ### Arguments:
317 1. item - (*object*) The item to search for in the array.
318 2. from - (*number*, optional: defaults to 0) The index of the array at which to begin the search.
320 ### Examples:
322         ['apple', 'lemon', 'banana'].indexOf('lemon'); // returns 1
323         ['apple', 'lemon'].indexOf('banana'); // returns -1
325 ### See Also:
327 - [MDC Array:indexOf][]
331 Array method: map {#Array:map}
332 ------------------------
334 Creates a new array with the results of calling a provided function on every element in the array.
335 This method is provided only for browsers without native [Array:map][] support.
337 ### Syntax:
339         var mappedArray = myArray.map(fn[, bind]);
341 ### Arguments:
343 1. fn   - (*function*) The function to produce an element of the new Array from an element of the current one.
344 2. bind - (*object*, optional) The object to use as 'this' in the function. For more information see [Function:bind][].
346 #### Argument: fn
348 ##### Syntax:
350         fn(item, index, array)
352 ##### Arguments:
354 1. item   - (*mixed*) The current item in the array.
355 2. index  - (*number*) The current item's index in the array.
356 3. array  - (*array*) The actual array.
358 ### Returns:
360 * (*array*) The new mapped array.
362 ### Examples:
364         var timesTwo = [1, 2, 3].map(function(item, index){
365                 return item * 2;
366         }); //timesTwo = [2, 4, 6];
368 ### See Also:
370 - [MDC Array:map][]
374 Array method: some {#Array:some}
375 --------------------------
377 Returns true if at least one element in the array satisfies the provided testing function.
378 This method is provided only for browsers without native [Array:some][] support.
380 ### Syntax:
382         var somePassed = myArray.some(fn[, bind]);
384 ### Returns:
386 * (*boolean*) If at least one element in the array satisfies the provided testing function returns true. Otherwise, returns false.
388 ### Arguments:
390 1. fn   - (*function*) The function to test for each element. This function is passed the item and its index in the array.
391 2. bind - (*object*, optional) The object to use as 'this' in the function. For more information see [Function:bind][].
393 #### Argument: fn
395 ##### Syntax:
397         fn(item, index, array)
399 ##### Arguments:
401 1. item   - (*mixed*) The current item in the array.
402 2. index  - (*number*) The current item's index in the array.
403 3. array  - (*array*) The actual array.
405 ### Examples:
407         var isAnyBigEnough = [10, 4, 25, 100].some(function(item, index){
408                 return item > 20;
409         }); // isAnyBigEnough = true
411 ### See Also:
413 - [MDC Array:some][]
417 Array method: associate {#Array:associate}
418 ------------------------------------
420 Creates an object with key-value pairs based on the array of keywords passed in and the current content of the array.
422 ### Syntax:
424         var associated = myArray.associate(obj);
426 ### Arguments:
428 1. obj - (*array*) Its items will be used as the keys of the object that will be created.
430 ### Returns:
432 * (*object*) The new associated object.
434 ### Examples:
436         var animals = ['Cow', 'Pig', 'Dog', 'Cat'];
437         var sounds = ['Moo', 'Oink', 'Woof', 'Miao'];
438         sounds.associate(animals);
439         // returns {'Cow': 'Moo', 'Pig': 'Oink', 'Dog': 'Woof', 'Cat': 'Miao'}
443 Array method: link {#Array:link}
444 --------------------------
446 Accepts an object of key / function pairs to assign values.
448 ### Syntax:
450         var result = myArray.link(object);
452 ### Arguments:
454 1. object - (*object*)  An object containing key / function pairs must be passed to be used as a template for associating values with the different keys.
456 ### Returns:
458 * (*object*) The new associated object.
460 ### Examples:
462         var el = document.createElement('div');
463         var arr2 = [100, 'Hello', {foo: 'bar'}, el, false];
464         arr2.link({
465                 myNumber: Type.isNumber,
466                 myElement: Type.isElement,
467                 myObject: Type.isObject,
468                 myString: Type.isString,
469                 myBoolean: function(obj){ return obj != null; }
470         });
471         // returns {myNumber: 100, myElement: el, myObject: {foo: 'bar'}, myString: 'Hello', myBoolean: false}
474 Array method: contains {#Array:contains}
475 ----------------------------------
477 Tests an array for the presence of an item.
479 ### Syntax:
481         var inArray = myArray.contains(item[, from]);
483 ### Arguments:
485 1. item - (*object*) The item to search for in the array.
486 2. from - (*number*, optional: defaults to 0) The index of the array at which to begin the search.
488 ### Returns:
490 * (*boolean*) If the array contains the item specified, returns true. Otherwise, returns false.
492 ### Examples:
494         ['a', 'b', 'c'].contains('a'); // returns true
495         ['a', 'b', 'c'].contains('d'); // returns false
497 ### See Also:
499 - [MDC Array:indexOf][]
503 Array method: append {#Array:append}
504 ------------------------------
506 Appends the passed array to the end of the current array.
508 ### Syntax:
510         var myArray = myArray.append(otherArray);
512 ### Arguments:
514 1. otherArray - (*array*) The array containing values you wish to append.
516 ### Returns:
518 * (*array*) The original array including the new values.
520 ### Examples:
522         var myOtherArray = ['green', 'yellow'];
523         ['red', 'blue'].append(myOtherArray); // returns ['red', 'blue', 'green', 'yellow'];
524         myOtheArray; // is now ['red', 'blue', 'green', 'yellow'];
526         [0, 1, 2].append([3, [4]]); // [0, 1, 2, 3, [4]]
528 ### Notes:
530 This is an array-specific equivalent of *$extend* from MooTools 1.2.
534 Array method: getLast {#Array:getLast}
535 --------------------------------
537 Returns the last item from the array.
539 ### Syntax:
541         myArray.getLast();
543 ### Returns:
545 * (*mixed*) The last item in this array.
546 * (*null*) If this array is empty, returns null.
548 ### Examples:
550         ['Cow', 'Pig', 'Dog', 'Cat'].getLast(); // returns 'Cat'
554 Array method: getRandom {#Array:getRandom}
555 ------------------------------------
557 Returns a random item from the array.
559 ### Syntax:
561         myArray.getRandom();
563 ### Returns:
565 * (*mixed*) A random item from this array. If this array is empty, returns null.
567 ### Examples:
569         ['Cow', 'Pig', 'Dog', 'Cat'].getRandom(); // returns one of the items
573 Array method: include {#Array:include}
574 --------------------------------
576 Pushes the passed element into the array if it's not already present (case and type sensitive).
578 ### Syntax:
580         myArray.include(item);
582 ### Arguments:
584 1. item - (*object*) The item that should be added to this array.
586 ### Returns:
588 * (*array*) This array with the new item included.
590 ### Examples:
592         ['Cow', 'Pig', 'Dog'].include('Cat'); // returns ['Cow', 'Pig', 'Dog', 'Cat']
593         ['Cow', 'Pig', 'Dog'].include('Dog'); // returns ['Cow', 'Pig', 'Dog']
595 ### Notes:
597 If you want to push the passed element even if it's already present, use
598 the vanilla javascript:
600         myArray.push(item);
602 Array method: combine {#Array:combine}
603 --------------------------------
605 Combines an array with all the items of another. Does not allow duplicates and is case and type sensitive.
607 ### Syntax:
609         myArray.combine(array);
611 ### Arguments:
613 1. array - (*array*) The array whose items should be combined into this array.
615 ### Returns:
617 * (*array*) This array combined with the new items.
619 ### Examples:
621         var animals = ['Cow', 'Pig', 'Dog'];
622         animals.combine(['Cat', 'Dog']); //animals = ['Cow', 'Pig', 'Dog', 'Cat'];
626 Array method: erase {#Array:erase}
627 ----------------------------
629 Removes all occurrences of an item from the array.
631 ### Syntax:
633         myArray.erase(item);
635 ### Arguments:
637 1. item - (*object*) The item to search for in the array.
639 ### Returns:
641 * (*array*) This array with all occurrences of the item removed.
643 ### Examples:
645         ['Cow', 'Pig', 'Dog', 'Cat', 'Dog'].erase('Dog') // returns ['Cow', 'Pig', 'Cat']
646         ['Cow', 'Pig', 'Dog'].erase('Cat') // returns ['Cow', 'Pig', 'Dog']
650 Array method: empty {#Array:empty}
651 ----------------------------
653 Empties an array.
655 ### Syntax:
657         myArray.empty();
659 ### Returns:
661 * (*array*) This array, emptied.
663 ### Examples:
665         var myArray = ['old', 'data'];
666         myArray.empty(); //myArray is now []
669 Array method: flatten {#Array:flatten}
670 --------------------------------
672 Flattens a multidimensional array into a single array.
674 ### Syntax:
676         myArray.flatten();
678 ### Returns:
680 * (*array*) A new flat array.
682 ### Examples:
684         var myArray = [1,2,3,[4,5, [6,7]], [[[8]]]];
685         var newArray = myArray.flatten(); //newArray is [1,2,3,4,5,6,7,8]
689 Array method: pick {#Array:pick}
690 --------------------------
691 Returns the first defined value of the array passed in, or null.
693 ### Syntax:
695         var picked = [var1, var2, var3].pick();
697 ### Returns:
699 * (*mixed*) The first variable that is defined.
700 * (*null*) If all variables passed in are `null` or `undefined`, returns `null`.
702 ### Example:
704         function say(infoMessage, errorMessage){
705                 alert([errorMessage, infoMessage, 'There was no message supplied.'].pick());
707                 //or more MooTools 1.2 style using Generics
708                 Array.pick([errorMessage, infoMessage, 'There was no message supplied.']);
710         }
711         say(); // alerts 'There was no message supplied.'
712     say('This is an info message.'); // alerts 'This is an info message.'
713     say('This message will be ignored.', 'This is the error message.'); // alerts 'This is the error message.'
716 ### Notes:
718 This is equivalent to *$pick* from MooTools 1.2.
722 Array method: hexToRgb {#Array:hexToRgb}
723 ----------------------------------
725 Converts an hexadecimal color value to RGB. Input array must be the following hexadecimal color format.
726 \['FF', 'FF', 'FF'\]
728 ### Syntax:
730         myArray.hexToRgb([array]);
732 ### Arguments:
734 1. array - (*boolean*, optional) If true is passed, will output an array (e.g. \[255, 51, 0\]) instead of a string (e.g. "rgb(255, 51, 0)").
736 ### Returns:
738 * (*string*) A string representing the color in RGB.
739 * (*array*) If the array flag is set, an array will be returned instead.
741 ### Examples:
743         ['11', '22', '33'].hexToRgb(); // returns 'rgb(17, 34, 51)'
744         ['11', '22', '33'].hexToRgb(true); // returns [17, 34, 51]
746 ### See Also:
748 - [String:hexToRgb][]
752 Array method: rgbToHex {#Array:rgbToHex}
753 ----------------------------------
755 Converts an RGB color value to hexadecimal. Input array must be in one of the following RGB color formats.
756 \[255, 255, 255\], or \[255, 255, 255, 1\]
758 ### Syntax:
760         myArray.rgbToHex([array]);
762 ### Arguments:
764 1. array - (*boolean*, optional) If true is passed, will output an array (e.g. \['ff', '33', '00'\]) instead of a string (e.g. '#ff3300').
766 ### Returns:
768 * (*string*) A string representing the color in hexadecimal, or 'transparent' string if the fourth value of rgba in the input array is 0 (rgba).
769 * (*array*) If the array flag is set, an array will be returned instead.
771 ### Examples:
773         [17, 34, 51].rgbToHex(); // returns '#112233'
774         [17, 34, 51].rgbToHex(true); // returns ['11', '22', '33']
775         [17, 34, 51, 0].rgbToHex(); // returns 'transparent'
777 ### See Also:
779 - [String:rgbToHex][]
783 [Function:bind]: /core/Native/Function/#Function:bind
784 [String:hexToRgb]: /core/Types/String/#String:hexToRgb
785 [String:rgbToHex]: /core/Types/String/#String:rgbToHex
786 [MDC Array]: https://developer.mozilla.org/en/Core_JavaScript_1.5_Reference/Global_Objects/Array
787 [MDC Array:every]: https://developer.mozilla.org/en/Core_JavaScript_1.5_Reference/Global_Objects/Array/every
788 [MDC Array:filter]: https://developer.mozilla.org/en/Core_JavaScript_1.5_Reference/Global_Objects/Array/filter
789 [MDC Array:indexOf]: https://developer.mozilla.org/en/Core_JavaScript_1.5_Reference/Global_Objects/Array/indexOf
790 [MDC Array:map]: https://developer.mozilla.org/en/Core_JavaScript_1.5_Reference/Global_Objects/Array/map
791 [MDC Array:some]: https://developer.mozilla.org/en/Core_JavaScript_1.5_Reference/Global_Objects/Array/some
792 [MDC Array:forEach]: https://developer.mozilla.org/en/Core_JavaScript_1.5_Reference/Global_Objects/Array/forEach
793 [Array:every]: https://developer.mozilla.org/en/Core_JavaScript_1.5_Reference/Global_Objects/Array/every
794 [Array:filter]: https://developer.mozilla.org/en/Core_JavaScript_1.5_Reference/Global_Objects/Array/filter
795 [Array:indexOf]: https://developer.mozilla.org/en/Core_JavaScript_1.5_Reference/Global_Objects/Array/indexOf
796 [Array:map]: https://developer.mozilla.org/en/Core_JavaScript_1.5_Reference/Global_Objects/Array/map
797 [Array:some]: https://developer.mozilla.org/en/Core_JavaScript_1.5_Reference/Global_Objects/Array/some