JavaScript – Cheat Sheet Page 2 of 2 string.slice(0, 4) Slices string from index 0 to index 4. Returns “java” string.replace(‘a’, ‘A’) Replaces first instance of ‘a’. Alert(“Zero”); Returns “jAvascript” CONDITIONAL STATEMENTS Relational Operators Equal to!= Not equal to Greater than. Media onabort, oncanplay, oncanplaythrough, ondurationchange onended, onerror, onloadeddata, onloadedmetadata, onloadstart, onpause, onplay, onplaying, onprogress. The async operator marks a function as asynchronous and will always return a Promise. You can use the await operator in an async function to pause execution on that line until the returned Promise from the expression either resolves or rejects.
JavaScript Cheat Sheet. There are seven data types in JavaScript: The first six data types are primitive, and Objects are derived data types. String – represents a sequence of characters e.g. “hello” Number – represents numeric values e.g. 100; Boolean – represents boolean value either false or true. JavaScript & AJAX For Dummies Cheat Sheet. The tables you find here offer a one-stop reference for the most common programming variables, commands, methods, and coding miscellany used in JavaScript programs, jQuery, and AJAX.
An array is a list-like object with extensive use cases. The most common, in my opinion, are described in this cheat sheet.
Create a new array
Item access
Items are accessed via index. Indexing starts at 0
Add new item at the end of an array
Method push
returns the new length of an array. In our example, it will return the number 4
Add new item at the beginning of an array
Method unshift
returns the new length of an array. In our example, it will return the number 5
Remove an item from the end of an array
Method pop
returns the removed item. In our example, it will return the text 'Opel'
Remove an item from the front of an array
Method shift
returns the removed item. In our example, it will return the text 'Renault'
Remove an item from the specific position
Method splice
returns the removed items. In our example, it will return an array with one item ['BMW']
Add an item at the specific position
The code above will insert a new item (BMW) at the position 1. The second parameter is the number of items we want to delete. After calling splice
, the returned array will be empty because we didn't delete anything (0 was provided as the second parameter)
Replace an item at the specific position
The method splice
, in this case, will return an array with one item ['Ford']
Reverse an array
NOTE: reverse method WILL MODIFY the original array
Sorting
Download innovative concepts network & wireless cards driver. The method sort
sorts the elements of an array and returns the sorted one.
NOTE: sort method WILL MODIFY the original array
Filtering
Array filter
method returns a new array filled with items that passed the provided condition in the callback. If no elements pass the condition, an empty array is returned.
NOTE: filter method DOES NOT modify the original array
Find the specific item or its index
Methods find
and findIndex
return the value of the first occurrence within an array that satisfies the condition
Cheat Sheet Terraria
NOTE: method find
stops the loop after the first item is found, meaning that if we had two cities with the name London only the first one would be returned. Method findIndex
works the same way, but the difference is that it returns an item index. They WILL NOT modify the original array
Loops
Method forEach
executes the provided callback for each item within an array
Mapping
The method map
creates a new array based on the result of the provided callback
Type Check (is an array)
Good to know is that method isArray
will return false
for a falsy value, therefore we don't need to check manually if the value is defined or not, for example. Maybe this method is not that commonly used, but I felt like it should be in this cheat sheet due to the old way of doing things.
Conversion
The method from
creates a new array by shallow-copying the array-like object given as a source. A common use case is a situation where we need to extract unique values from the source and place the result in an array. Combining Array.from
with a Set
we can achieve that, but do note that it works with primitive values only.
Item existence
To check if an array contains a specific element, we can use a new method called includes
. A use case for this would be replacing an if
statement containing multiple ||
operators.
Fantasy Football Cheat Sheet
I've written an entire article related to JavaScript conditionals. Read about it here Tips and Tricks for Better JavaScript Conditionals and Match Criteria
Validating any
By invoking the method some
we can check if at least one of the items within an array passes the given condition. It will invoke the given callback for each item in the array and will return true
immediately if a truthy item is found.
Validating all
Cheat Sheet Recipes
The method every
validates if all items within an array pass the given condition. It will invoke the callback for each item in the array and will return false
immediately if a falsy item is found.
Reducing
In my opinion, the reduce
method is the most useful one. With it, we can transform our array into the result we need.
Shifting Elements
Data copying within the same array might seem pointless to some, and to be honest, I don't see a lot of use cases to do this. I can imagine this being useful in cases when we are building a drag&drop list with reordering enabled. We can use copyWithin
to update the underlying data model for the list.
NOTE: This method modifies the source array and only does a shallow coping thus handling objects should be done with care
Flattening
Javascript Operators Cheat Sheet Example
One of the new methods added to the array API is the method flat
.
This method creates a new array with all sub-array elements concatenated into it recursively up to the specified depth. The default depth is 1
This means we can get a single array as a result in a case when we have an array of arrays. Not every item of the source array needs to be an array. Array.flat
is smart enough to figure that out.
I don't see this being used that often, but the reason I put it on this list is that I find it interesting the fact that it will remove all empty slots from our array. If you think of any other useful use case, feel free to write it in the comments section.
That's all I have for now.
Javascript Operators Cheat Sheet Examples
If you liked this quick guide, do share it and show me some love by buying me a coffee.
To stay tuned for future articles and cheat sheets, subscribe here or follow me on twitter.