JavaScript is a programming language used primarily by Web browsers to create a dynamic and interactive experience for the user. Most of the functions and applications that make the Internet indispensable to modern life are coded in some form of JavaScript. While JavaScript is not the only client-side scripting language on the Internet, it was one of the first and it is still the most widely used.
Here you can find the completed JavaScript cheat sheet 👇
| Functions | Description |
| concat() | Concatenate different arrays into one. |
| join() | Joins all the elements of one array as a string |
| indexof() | Returns the index (first position) of an element in the array |
| lastindexof() | Returns the last position of an element in the array |
| sort() | Alphabetic sort of array elements |
| reverse() | Sort elements in descending order |
| valueof() | Primitive value of the element specified |
| slice() | Cut a portion of one array and put it in a new array |
| splice() | Add elements to an array in a specific manner and position |
| unshift() | Add new element to the array in the beginning |
| shift() | Remove first element of the array |
| pop() | Remove the last element of the array |
| push() | Add new element to the array as the last one |
| tostring() | Prints the string value of the elements of the array |
| encodeURI() | Encodes a URI into UTF-8 | |
| encodeURIComponent() | Encoding for URI components | |
| decodeURI() | Decodes a Uniform Resource Identifier (URI) created by encodeURI or similar | |
| decodeURIComponent() | Decodes a URI component | |
| parseInt() | Parses the input returns an integer | |
| parseFloat() | Parses the input and returns a floating-point number | |
| eval() | Evaluates JavaScript code represented as a string | |
| Number() | Returns a number converted from its initial value | |
| isNaN() | Determines whether a value is NaN or not | |
| isFinite() | Determines whether a passed value is a finite number |
| for | looping in javascript | |
| while | execute a block of code while some condition is true | |
| do while | similar to while, but executes at least as the condition is applied after the code is executed |
|
| break | break and exit the cycle based on some conditions | |
| continue | continue next iteration if some conditions are met |
| Method | Meaning | |
| length | determines length of string | |
| indexof() | finds position of the first occurrence of a character or text in the string | |
| lastindexof() | returns last occurrence of text in a string | |
| search() | searches and returns position of a specified value in string | |
| slice() | extracts and returns part of a string as another new string | |
| substring() | substring returns part of the string from start index to the end index specified. cannot take negative values unlike slice() | |
| substr() | returns the sliced out portion of a string, the second parameter being the length of the final string. | |
| replace() | replaces a particular value with another | |
| touppercase() | changes all characters into uppercase | |
| tolowercase() | changes all characters into lowercase | |
| concat() | joins two or more strings together into another string | |
| trim() | removes white spaces from a string | |
| charat() | finds character at a specified position | |
| charcodeat() | returns the unicode of character at the specified position | |
| split() | convert a string into array based on special character | |
| accessing characters using [] | access a character of string using its index (doesn’t work on some versions of ie) |
| onclick | event that happens when user clicks on an element |
| onmouseover | when the mouse is moved over some element or its children |
| onmouseout | User moves the mouse pointer out of an element or one of its children |
| onmouseup | when user releases a mouse button while over an element |
| onmousedown | when user presses a mouse button over an element |
| onmouseenter | pointer moves onto an element |
| onmouseleave | Pointer moves out of an element |
| onmousemove | pointer is moving when it is over an element |
| oncontextmenu | User right-clicks on an element to open a context menu |
| ondblclick | The user double-clicks on an element |
| onkeydown | When the user is pressing a key down |
| onkeypress | The moment the user starts pressing a key |
| onkeyup | The user releases a key |
| onabort | The loading of a media is aborted |
| onbeforeunload | Event that occurs before a document is to be unloaded |
| onunload | Event occurs when a page has unloaded |
| onerror | When an error occurs while loading an external file |
| onhashchange | There have been changes to the anchor part of a URL |
| onload | When an object has loaded |
| onpagehide | The user navigates away from a webpage |
| onpageshow | the user navigates to a webpage |
| onresize | The document view is resized |
| onscroll | An element’s scrollbar is being scrolled |
| onblur | When an element loses focus |
| onchange | when content of a form element like <input>, <select> and <textarea> changes |
| onfocus | An element gets focus |
| onfocusin | When an element is about to get focus |
| onfocusout | When element is about to lose focus |
| oninput | User input on an element |
| oninvalid | An element is invalid |
| onreset | form reset |
| onsearch | The user writes something in the input type search |
| onselect | The user selects some text (<input> and <textarea>) |
| onsubmit | event that happens upon submitting the form |
| try | block of code to execute in case of no errors |
| catch | block of code to execute in case of an error |
| throw | Create custom error messages rather than standard JavaScript errors |
| finally | block that is always executed whether there is error in execution or not |
| transitionend | event triggered when a CSS transition has completed |
| onmessage | A message is received through the event source |
| ononline | The browser starts to work online |
| onoffline | The browser starts to work offline |
| ontoggle | The user opens or closes the <details> element |
| onpopstate | When the window’s history changes |
| onshow | A <menu> element is shown as a context menu |
| onstorage | A Web Storage area is updated |
| onwheel | Mouse wheel rolls up or down over an element |
| ontouchstart | A finger is placed on the touch-screen |
| ontouchend | User’s finger is removed from a touch-screen |
| ontouchcancel | Screen-touch is interrupted |
| ontouchmove | User finger is dragged across the screen |
| onabort | Media loading is aborted |
| onended | The media ended |
| onerror | Happens when an error occurs while loading an external file |
| oncanplay | The browser can start playing media |
| oncanplaythrough | The browser can play through media without stopping |
| ondurationchange | change in the duration of the media |
| onloadeddata | Media data loaded |
| onloadedmetadata | Metadata (e.g. dimensions, duration) are loaded |
| onloadstart | The browser starts looking for specified media |
| onpause | Media is paused either by the user or automatically |
| onplay | The media started to play or is no longer paused |
| onplaying | Media is playing after being paused or stopped for buffering |
| onprogress | The browser is in the process of downloading the media |
| onratechange | The playing speed of the media changes |
| onseeked | User is finished moving/skipping to a new position in the media |
| onseeking | The user starts moving/skipping |
| onstalled | The browser is trying to load the media but it is unavailable |
| onwaiting | Media paused but expected to resume (like in buffering) |
| onsuspend | The browser is intentionally not loading media |
| ontimeupdate | The playing position has changed (like in case of fast forward) |
| onvolumechange | Media volume has increased or reduced |
| Basic |
|
| Logical |
|
| Comparison |
|
| Bitwise |
|
| Date() | Creates a new date object with current date and time |
| Date(2019, 10, 21, 12, 24, 58, 13) | Create a custom date object. Format – (yyyy, mm, dd, hh, min, s, ms). Except for year and month, all parameters are optional. |
| Date("2019-10-21") | Date declaration as a string |
| getDate() | Get the day of the month as a number (1-31) |
| getDay() | The weekday as a number (0-6) |
| getFullYear() | Year as a four-digit number (yyyy) |
| getHours() | Get the hour (0-23) |
| getMilliseconds() | Get the millisecond (0-999) |
| getMinutes() | Get the minute (0-59) |
| getMonth() | Month as a number (0-11) |
| getSeconds() | Get the second (0-59) |
| getTime() | Get the milliseconds since January 1, 1970 |
| getUTCDate() | The day (date) of the month in the specified date according to universal time (also available for day, month, full year, hours, minutes etc.) |
| parse | Parses a string representation of a date and returns the number |
| setDate() | Set the day as a number (1-31) |
| setFullYear() | Sets the year (optionally month and day) |
| setHours() | Set the hour (0-23) |
| setMilliseconds() | Set milliseconds (0-999) |
| setMinutes() | Sets the minutes (0-59) |
| setMonth() | Set the month (0-11) |
| setSeconds() | Sets the seconds (0-59) |
| setTime() | Set the time (milliseconds since January 1, 1970) |
| setUTCDate() | Sets the day of the month for a specified date according to universal time (also available for day, month, full year, hours, minutes etc.) |
| . | Find a single character, except newline or line terminator |
| \w | Word character |
| \W | Non-word character |
| \d | A digit |
| \D | A non-digit character |
| \s | Whitespace character |
| \S | Non-whitespace character |
| \b | Find a match at the beginning/end of a word |
| \B | A match not at the beginning/end of a word |
| \0 | NULL character |
| \n | A new line character |
| \f | Form feed character |
| \r | Carriage return character |
| \t | Tab character |
| \v | Vertical tab character |
| \xxx | The character specified by an octal number xxx |
| \xdd | Character specified by a hexadecimal number dd |
| \uxxxx | The Unicode character specified by a hexadecimal number xxxx |
This cheat sheet is a modified cheatsheet provided on Hackr website
I hope you found this cheat sheet helpful. If you need any help please let me know in the comment section.
Let's connect on Twitter and LinkedIn
👋 Thanks for reading, See you next time