JavaScript Toolbox

Coming from Ruby to JavaScript was more difficult than I thought it would be. The main difference to me: Documentation. Ruby has ruby-doc.org which has a well written and well organized dictionary for the entire language. While Javascript, I was primarily looking through w3schools and Modzilla’s documentation. Both not as well organized compared to Ruby’s. A part of my learning process is knowing what is available to me. Nothing I found was to my liking so I decided to gather all the information on the basic methods. What I came up with was surprisingly small. The JavaScript methods library was tiny compared to Ruby. So I compiled most of the methods (ones that I saw useful for me at this moment) for Numbers, Strings and Arrays with definitions and examples along with each.

Number
Method Description Example
#toString() Returns a string of that number 100.toString()
#=> "100"
#toExponential(num=0) Returns the exponential of a float as a string, cannot be an integer (num option of how many decimal places) 150.0.toExponential(4)
#=> "1.5000e+2"
#toFixed(num=0) Returns a string with the decimal places fixed to the num and rounds 150.3261.toFixed(2)
#=> "150.33"
#toPrecision(num=length) Returns a string of the number with a fixed length from num 150.3261.toPrecision(2)
#=> "1.5e+2"
String
Method Description Example
#indexOf(string) Returns the index of the first occurrence, returns -1 if none are found 'hello'.indexOf('l');
#=> 2
#indexLastOf(string) Returns the index of the last occurrence, returns -1 if none are found 'welcome'.indexLastOf('e');
#=> 6
#search(string) Same as #indexOf(string) except it allows for the search of regular expressions 't0'.search(/[0-9]/);
#=> 1
#match(string) Searches a string against a string or regular expression and returns the match in an array 'mY'.match(/[A-Z]/);
#=> ["Y"]
#charAt(num) Returns the character at the num index and returned empty string if out of range 'blog'.charAt(2);
#=> "o"
#split('x') Splits string by 'x' into an array 'string'.split('');
#=> ["s", "t", "r", "i", "n", "g"]
#concat(*args) Takes in as many string arguments and combines them into one 'java'.concat('scr', 'ipt');
#=> "javascript"
#slice(num1, num2) Returns the sting from index num1 to num2 not including num2, can accept negative numbers 'table'.slice(1,-1);
#=> "abl"
#substring(num1, num2) Same as #slice(num1, num2) except it cannot accept negative numbers 'enjoy'.substring(1, 3);
#=> "ej"
#substr(num1, num2) Returns a string where the substring starts at index of num1 to num2 characters 'yourself'.substr(1, 4);
#=> "ours"
#replace(string1, string2) Finds and replaces the first instance of string1 with string2, then returns the resulting string 'flatiron'.replace('iron', 'school');
#=> "flatschool"
#toUpperCase() Uppercase the entire string 'flatiron'.upUpperCase();
#=> "FLATIRON"
#toLowerCase() Lowercase the entire string 'FLATIRON'.upUpperCase();
#=> "flatiron"
#trim() Removes white space at the beginning and end of a string ' flatiron? '.trim()
#=> "flatiron?"
Array
Method Description Example
#concat(*arrs) Join multiple arrays into one [1,2,3].concat([4,5,6], [7,8,9]);
#=> [1,2,3,4,5,6,7,8,9]
#join('x') Joins each array element into a string separated by 'x' ('x' is optional, where the default is ',') ['flatiron', 'school'].join(' ');
#=> "flatiron school"
#indexOf(ele) Search array for the first matching element and returns the index, -1 if nothing is found [1,2,3,2].indexOf(2);
#=> 1
#lastIndexOf(ele) Search array for last matching element and returns the index, -1 if nothing is found[1,2,3,2].indexOf(2);
#=> 3
#pop() Removes and returns the last element of the array[1,2,3,2].pop();
#=> 2
#push(ele) Adds element to the end of the array and returns the length of the new array['h','e','l','l'].push('o');
#=> 5
#reverse() Reserve the elements of the array and returns the new array, this is destructive [1,2,3].reverse();
#=> [3,2,1]
#shift() Removes and returns the first element of the array [1,2,3,2].shift();
#=> 1
#unshift() Adds element to the beginning of the array and returns the length of the new array [1,2,3,2].unshift(1);
#=> 5
#sort() Sorts and returns the array, this is destructive [3,2,1].sort();
#=> [1,2,3]
#slice(num1, num2) Starts at index num1 and slices to index num2 not included, and returns the resulting array. [0,1,2,3,4,5].slice(1,3);
#=> [1,2]
#splice(num1, num2, *args) num1 represents the starting point, num2 represents the number of elements to remove and the *args is optional for any additions to be added to the array. Return value is an array of the removed elements ["h", "e", "l", "l", "o"].splice(1,2,9,8,7) => ["h", 9, 8, 7, "l", "o"]
#=> ["e", "l"]
Array Enumerable
Method Description Example
#every( function( element, index, array ) { return condition } ) Evaluates to true if callback function evaluates to be true for each element [1,2,3].every( function( element ) { return isFinite( element ) } );
#=> true
#filter( function( element, index, array ) { return condition } ) Like #select in Ruby, returns an array with elements who's callback function returned true [1,2,3,4,5].filter( function( element ) { return element > 3 } );
#=> [4, 5]
#forEach( function( element, index, array ) { do something } ) Like #each in Ruby, does something for each element in the array [1,2].forEach( function( element, index, array ) { console.log( element ) } );
#=> 1 #=> 2
#map( function( element, index, array ) { return something } ) Like #each in Ruby, creates an array of same length with returned values [1,2].map( function( element, index, array ){ return element + index } );
#=> [1, 3]
#reduce( function( previousValue, currentValue, index, array ) { return new previousValue }, initialValue ) Similar to #inject in Ruby, iterates through each element where previousValue initially starts off as initialValue and currentValue is the element. The return of the first iteration becomes the new previousValue and so on where the return is the final return. [1,2,3].reduce( function( a, b, index, array ) { return a+b }, 10 );
#=> 16
#some( function( element, index, array ) { return condition } ) Evaluates to true if callback function evaluates to be true for at least one element [1,2,3].some( function( element ) { return element/2 == 1 } );
#=> true
Global Methods
Method Description Example
#eval() Evaluates and executes a string eval('1+1');
#=> 2
#isFinite() Returns true or false either the input is a number or not isFinite(Infinity);
#=> false
#isNaN() Returns true for anything that is not a number isNaN(NaN);
#=> true
#Number() Converts input into a number Number('a');
#=> NaN
#parseFloat() Converts input into a float parseFloat('3.14');
#=> 3.14
#parseInt() Converts input into a integer parseInt('3.14');
#=> 3
#String() Converts input into a string String(3.14);
#=> "3.14"

#splice(num1, num2, *args) examples

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

array1 = [ 1, 2, 3, 4, 5 ];
array1.splice( 1, 2 );
#=> [ 2, 3 ]
array1;
#=> [ 1, 4, 5 ]

array2 = [ 1, 2, 3, 4, 5 ];
array2.splice( 2, 0, 3.33, 3.67 );
#=> []
array2;
#=> [ 1, 2, 3, 3.33, 3.67, 4, 5 ]

array3 = [ 1, 2, 3, 4, 5 ];
array3.splice( 1, 3, 'two', 'three', 'four' );
#=> [ 2, 3, 4 ]
array3;
#=> [ 1, 'two', 'three',  'four', 5 ]


Lastly, an additional note for the Array Enumerable. Coming from Ruby, enumerables were always used entirely along with being told to never use for loops. While in JavsScript, it seems to be the opposite where for loops are more prevalent. For all the Rubyist who shy away from for loops and would much rather use #forEach, well for loops aren’t that bad. Compared to the #forEach method, for loops are about 95% faster.
http://jsperf.com/foreach-vs-loop

flatiron school, javascript