mirror of
https://github.com/kamranahmedse/developer-roadmap.git
synced 2026-09-24 15:00:31 +08:00
Change location for data files
This commit is contained in:
+14
@@ -0,0 +1,14 @@
|
||||
# What is JavaScript?
|
||||
|
||||
JavaScript, often abbreviated JS, is a programming language that is one of the core technologies of the World Wide Web, alongside HTML and CSS. It lets us add interactivity to pages e.g. you might have seen sliders, alerts, click interactions, popups, etc on different websites -- all of that is built using JavaScript. Apart from being used in the browser, it is also used in other non-browser environments as well such as Node.js for writing server-side code in JavaScript, Electron for writing desktop applications, React Native for mobile applications, and so on.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [JavaScript MDN Docs](https://developer.mozilla.org/en-US/docs/Web/JavaScript)
|
||||
- [W3Schools – JavaScript Tutorial](https://www.w3schools.com/js/)
|
||||
- [The Modern JavaScript Tutorial](https://javascript.info/)
|
||||
- [A Comprehensive Course on JavaScript with Quizzes and Exercises - CodeGuage](https://www.codeguage.com/courses/js/)
|
||||
- [Exploring JS: JavaScript books for programmers](https://exploringjs.com/)
|
||||
- [JavaScript Crash Course for Beginners](https://youtu.be/hdI2bqOjy3c?t=2)
|
||||
- [Build a Netflix Landing Page Clone with HTML, CSS & JS](https://youtu.be/P7t13SGytRk?t=22)
|
||||
- [Learn Javascript - Full course for bignners>](https://www.youtube.com/watch?v=PkZNo7MFNFg)
|
||||
+8
@@ -0,0 +1,8 @@
|
||||
# History of JavaScript
|
||||
|
||||
JavaScript was initially created by Brendan Eich of NetScape and was first announced in a press release by Netscape in 1995. It has a bizarre history of naming; initially, it was named Mocha by the creator, which was later renamed LiveScript. In 1996, about a year later after the release, NetScape decided to rename it to JavaScript with hopes of capitalizing on the Java community (although JavaScript did not have any relationship with Java) and released Netscape 2.0 with the official support of JavaScript.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Brief History of JavaScript](https://roadmap.sh/guides/history-of-javascript)
|
||||
- [The History of JavaScript](https://dev.to/iarchitsharma/the-history-of-javascript-5e98)
|
||||
+8
@@ -0,0 +1,8 @@
|
||||
# Javascript Versions
|
||||
|
||||
JavaScript was invented by Brendan Eich, and in 1997 and became an ECMA standard. ECMAScript is the official language name. ECMAScript versions include ES1, ES2, ES3, ES5, and ES6
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [JavaScript Versions: How JavaScript has changed over the years](https://www.educative.io/blog/javascript-versions-history)
|
||||
- [Brief History of JavaScript](https://roadmap.sh/guides/history-of-javascript)
|
||||
+9
@@ -0,0 +1,9 @@
|
||||
# How to run Javascript
|
||||
|
||||
JavaScript can be run in the browser by including the external script file using the `script` tag, writing it within the HTML page using the `script` tag again, running it in the browser console or you can also use [REPL](https://www.digitalocean.com/community/tutorials/how-to-use-the-node-js-repl).
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [How To Add JavaScript to HTML](https://www.digitalocean.com/community/tutorials/how-to-add-javascript-to-html)
|
||||
- [How To Write Your First JavaScript Program](https://www.digitalocean.com/community/tutorials/how-to-write-your-first-javascript-program)
|
||||
- [How To Use the JavaScript Developer Console](https://www.digitalocean.com/community/tutorials/how-to-use-the-javascript-developer-console)
|
||||
@@ -0,0 +1,14 @@
|
||||
# JavaScript
|
||||
|
||||
JavaScript, often abbreviated JS, is a programming language that is one of the core technologies of the World Wide Web, alongside HTML and CSS. It lets us add interactivity to pages e.g. you might have seen sliders, alerts, click interactions, popups, etc on different websites -- all of that is built using JavaScript. Apart from being used in the browser, it is also used in other non-browser environments as well such as Node.js for writing server-side code in JavaScript, Electron for writing desktop applications, React Native for mobile applications, and so on.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [JavaScript MDN Docs](https://developer.mozilla.org/en-US/docs/Web/JavaScript)
|
||||
- [W3Schools – JavaScript Tutorial](https://www.w3schools.com/js/)
|
||||
- [The Modern JavaScript Tutorial](https://javascript.info/)
|
||||
- [Exploring JS: JavaScript books for programmers](https://exploringjs.com/)
|
||||
- [Eloquent JavaScript textbook](https://eloquentjavascript.net/)
|
||||
- [You Dont Know JS Yet (book series)](https://github.com/getify/You-Dont-Know-JS)
|
||||
- [JavaScript Crash Course for Beginners](https://youtu.be/hdI2bqOjy3c?t=2)
|
||||
- [Build a Netflix Landing Page Clone with HTML, CSS & JS](https://youtu.be/P7t13SGytRk?t=22)
|
||||
+11
@@ -0,0 +1,11 @@
|
||||
# [var] keyword
|
||||
|
||||
The var statement declares a function-scoped or globally-scoped variable, optionally initializing it to a value.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [var keyword - MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/var)
|
||||
- [JavaScript Variables](https://javascript.info/variables)
|
||||
- [JavaScript Variables - W3Schools](https://www.w3schools.com/js/js_variables.asp)
|
||||
- [Declaring Variables without Var, Let, Const - What Would Happen?](https://www.youtube.com/watch?v=6UAKBYpUC-Y)
|
||||
- [How to declare variables in different ways in JavaScript?](https://www.geeksforgeeks.org/how-to-declare-variables-in-different-ways-in-javascript/)
|
||||
+9
@@ -0,0 +1,9 @@
|
||||
# [let] keyword
|
||||
|
||||
The `let` declaration declares a block-scoped local variable, optionally initializing it to a value.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [let keyword - MDN Docs](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let)
|
||||
- [JavaScript Variables](https://javascript.info/variables)
|
||||
- [How to declare variables in different ways in JavaScript?](https://www.geeksforgeeks.org/how-to-declare-variables-in-different-ways-in-javascript/)
|
||||
+10
@@ -0,0 +1,10 @@
|
||||
# [const] keyword
|
||||
|
||||
Constants are block-scoped, much like variables declared using the `let` keyword. The value of a constant can't be changed through reassignment (i.e. by using the assignment operator), and it can't be redeclared (i.e. through a variable declaration). However, if a constant is an object or array its properties or items can be updated or removed.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [JavaScript Constants - CodeGuage](https://www.codeguage.com/courses/js/constants)
|
||||
- [const keyword - MDN Docs](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/const)
|
||||
- [JavaScript Variables](https://javascript.info/variables)
|
||||
- [How to declare variables in different ways in JavaScript?](https://www.geeksforgeeks.org/how-to-declare-variables-in-different-ways-in-javascript/)
|
||||
+8
@@ -0,0 +1,8 @@
|
||||
# Variable Declarations
|
||||
|
||||
To use variables in JavaScript, we first need to create it i.e. declare a variable. To declare variables, we use one of the `var`, `let`, or `const` keywords.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Storing the information you need — Variables](https://developer.mozilla.org/en-US/docs/Learn/JavaScript/First_steps/Variables)
|
||||
- [JavaScript Variables - CodeGuage](https://www.codeguage.com/courses/js/variables)
|
||||
@@ -0,0 +1,9 @@
|
||||
# Hoisting
|
||||
|
||||
JavaScript Hoisting refers to the process whereby the interpreter appears to move the declaration of functions, variables, or classes to the top of their scope, prior to execution of the code.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [What is Hoisting - MDN Docs](https://developer.mozilla.org/en-US/docs/Glossary/Hoisting)
|
||||
- [JavaScript Hoisting](https://www.geeksforgeeks.org/javascript-hoisting/)
|
||||
|
||||
@@ -0,0 +1,11 @@
|
||||
# Naming Rules
|
||||
|
||||
A variable name should accurately identify your variable. When you create good variable names, your JavaScript code becomes easier to understand and easier to work with. Properly naming variables is really important. JavaScript also has some rules when it comes to naming variables; read about these rules through the links below.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [JavaScript Variable Naming Tips - CodeGuage](https://www.codeguage.com/courses/js/variables#Tips_for_naming_variables)
|
||||
- [Understanding Variables in JavaScript](https://www.informit.com/articles/article.aspx?p=131025&seqNum=3)
|
||||
- [Naming JavaScript Variables](https://www.dummies.com/article/technology/programming-web-design/javascript/naming-javascript-variables-142522/)
|
||||
- [JavaScript Naming Conventions](https://www.robinwieruch.de/javascript-naming-conventions/)
|
||||
- [Google JavaScript Style Guide](https://google.github.io/styleguide/jsguide.html)
|
||||
@@ -0,0 +1,8 @@
|
||||
# Block Scope
|
||||
|
||||
This scope restricts the variable that is declared inside a specific block, from access by the outside of the block. The let & const keyword facilitates the variables to be block scoped. In order to access the variables of that specific block, we need to create an object for it. Variables declared with the var keyword, do not have block scope.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [JavaScript Scope](https://www.w3schools.com/js/js_scope.asp)
|
||||
- [Block Scoping in JavaScript](https://www.geeksforgeeks.org/javascript-es2015-block-scoping)
|
||||
+9
@@ -0,0 +1,9 @@
|
||||
# Function Scope
|
||||
|
||||
When a variable is declared inside a function, it is only accessible within that function and cannot be used outside that function.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [JavaScript Scope](https://www.w3schools.com/js/js_scope.asp)
|
||||
- [Function Scope & Block Scope in JS](https://medium.com/nerd-for-tech/function-scope-block-scope-in-js-d29c8e7cd216)
|
||||
- [All about Functions and Scopes in JavaScript](https://www.geeksforgeeks.org/all-about-functions-and-scopes-in-javascript/)
|
||||
@@ -0,0 +1,9 @@
|
||||
# Global Scope
|
||||
|
||||
Variables declared Globally (outside any function) have Global Scope. Global variables can be accessed from anywhere in a JavaScript program. Variables declared with `var`, `let` and `const` are quite similar when declared outside a block.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [JavaScript Scope](https://www.w3schools.com/js/js_scope.asp)
|
||||
|
||||
|
||||
@@ -0,0 +1,16 @@
|
||||
# Scopes
|
||||
|
||||
In JavaScript, scope refers to the visibility of a variable or how it can be used after it is declared. The scope of a variable depends on the keyword that was used to declare it.
|
||||
|
||||
The three types of Scope are Global Scope, Function Scope, and Block Scope. Before ES6 (2015), JavaScript had only Global Scope and Function Scope with the `var` keyword. ES6 introduced `let` and `const` which allow Block Scope in JavaScript.
|
||||
|
||||
Global Scope: Variables declared outside any function or curly braces '{}' have Global Scope, and can be accessed from anywhere within the same Javascript code. `var`, `let` and `const` all provide this Scope.
|
||||
|
||||
Function Scope: Variables declared within a function can only be used within that same function. Outside that function, they are undefined. `var`, `let` and `const` all provide this Scope.
|
||||
|
||||
Block Scope: A block is any part of JavaScript code bounded by '{}'. Variables declared within a block can not be accessed outside that block. This Scope is only provided by the `let` and `const` keywords. If you declare a variable within a block using the `var` keyword, it will NOT have Block Scope.
|
||||
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [JavaScript Scope](https://www.w3schools.com/js/js_scope.asp)
|
||||
@@ -0,0 +1,8 @@
|
||||
# Javascript Variables
|
||||
|
||||
Most of the time, a JavaScript application needs to work with information. To store and represent this information in the JavaScript codebase, we use variables. A variable is a container for a value.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [JavaScript Variables](https://javascript.info/variables)
|
||||
- [Storing the information you need — Variables](https://developer.mozilla.org/en-US/docs/Learn/JavaScript/First_steps/Variables)
|
||||
@@ -0,0 +1,17 @@
|
||||
# Primitive Types
|
||||
|
||||
In JavaScript, a primitive (primitive value, primitive data type) is data that is not an object and has no methods or properties. There are 7 primitive data types:
|
||||
|
||||
- `string`
|
||||
- `number`
|
||||
- `bigint`
|
||||
- `boolean`
|
||||
- `undefined`
|
||||
- `Symbol`
|
||||
- `null`
|
||||
|
||||
Most of the time, a primitive value is represented directly at the lowest level of the language implementation.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Primitive](https://developer.mozilla.org/en-US/docs/Glossary/Primitive)
|
||||
+9
@@ -0,0 +1,9 @@
|
||||
# Prototypes
|
||||
|
||||
JavaScript is an object-oriented language built around a prototype model. In JavaScript, every object inherits properties from its prototype, if there are any. A prototype is simply an object from which another object inherits properties. To create complex programs using JavaScript, one has to be proficient in working with prototypes — they form the very core of OOP in the language.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Prototypes in JavaScript - A Comprehensive Guide](https://www.codeguage.com/courses/js/objects-prototypes)
|
||||
- [Prototypes, Inheritance](https://javascript.info/prototypes)
|
||||
- [Object prototypes - MDN](https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Objects/Object_prototypes)
|
||||
+10
@@ -0,0 +1,10 @@
|
||||
# Prototypal Inheritance
|
||||
|
||||
The Prototypal Inheritance is a feature in javascript used to add methods and properties in objects. It is a method by which an object can inherit the properties and methods of another object. Traditionally, in order to get and set the Prototype of an object, we use Object.getPrototypeOf and Object.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [JavaScript MDN Docs](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Inheritance_and_the_prototype_chain)
|
||||
- [GeeksForGeeks – JavaScript Tutorial](https://www.geeksforgeeks.org/prototypal-inheritance-using-__proto__-in-javascript/)
|
||||
- [The Modern JavaScript Tutorial](https://javascript.info/prototype-inheritance)
|
||||
- [Prototype Inheritance](https://javascript.info/prototype-inheritance)
|
||||
+17
@@ -0,0 +1,17 @@
|
||||
# Built-in objects
|
||||
|
||||
Built-in objects, or "global objects", are those built into the language specification itself. There are numerous built-in objects with the JavaScript language, all of which are accessible at the global scope. Some examples are:
|
||||
- `Number`
|
||||
- `Math`
|
||||
- `Date`
|
||||
- `String`
|
||||
- `Error`
|
||||
- `Function`
|
||||
- `Boolean`
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Built-in Objects](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects)
|
||||
- [Standard built-in objects](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects)
|
||||
- [JavaScript Built-in Objects](https://www.tutorialride.com/javascript/javascript-built-in-objects.htm)
|
||||
- [Built-in Objects](https://www.scaler.com/topics/javascript-built-in-objects/)
|
||||
@@ -0,0 +1,10 @@
|
||||
# Object
|
||||
|
||||
JavaScript object is a data structure that allows us to have key-value pairs; so we can have distinct keys and each key is mapped to a value that can be of any JavaScript data type. Comparing it to a real-world object, a pen is an object with several properties such as color, design, the material it is made of, etc. In the same way, JavaScript objects can have properties that define their characteristics.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Objects](https://javascript.info/object)
|
||||
- [Working with Objects](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Working_with_Objects)
|
||||
- [JavaScript Object Definition](https://www.w3schools.com/js/js_object_definition.asp)
|
||||
- [Objects in JavaScript ](https://www.geeksforgeeks.org/objects-in-javascript/)
|
||||
@@ -0,0 +1,8 @@
|
||||
# TypeOf Operator
|
||||
|
||||
You can use the typeOf operator to find the data type of a JavaScript variable.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Typeof Reference](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/typeof)
|
||||
- [Typeof Live Examples](https://www.w3schools.com/js/tryit.asp?filename=tryjs_typeof_all)
|
||||
@@ -0,0 +1,10 @@
|
||||
# Datatypes
|
||||
|
||||
Data type refers to the type of data that a JavaScript variable can hold. There are seven primitive data types in JavaScript (Number, BigInt, String, Boolean, Null, Undefined and Symbol). Objects are non-primitives.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [JavaScript Data Types - CodeGuage](https://www.codeguage.com/courses/js/data-types)
|
||||
- [JavaScript data types and data structures](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures)
|
||||
- [JavaScript Data Types](https://www.w3schools.com/js/js_datatypes.asp)
|
||||
- [JavaScript Data Types](https://javascript.info/types)
|
||||
+9
@@ -0,0 +1,9 @@
|
||||
# Type Conversion/Coercion
|
||||
|
||||
Type coercion is the automatic or implicit conversion of values from one data type to another (such as strings to numbers). Type conversion is similar to type coercion because they convert values from one data type to another with one key difference — type coercion is implicit. In contrast, type conversion can be either implicit or explicit.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Type Conversion - MDN](https://developer.mozilla.org/en-US/docs/Glossary/Type_Conversion)
|
||||
- [Type Coercion - MDN](https://developer.mozilla.org/en-US/docs/Glossary/Type_coercion)
|
||||
- [Type Conversion and Coercion video](https://www.youtube.com/watch?v=jfQyMPzPTjY)
|
||||
+11
@@ -0,0 +1,11 @@
|
||||
# Explicit Type Casting
|
||||
|
||||
Type casting means transferring data from one data type to another by explicitly specifying the type to convert the given data to. Explicit type casting is normally done to make data compatible with other variables. Examples of typecasting methods are `parseInt()`, `parseFloat()`, `toString()`.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Type Conversion](https://www.c-sharpcorner.com/article/type-conversions-in-javascript/)
|
||||
- [Type casting](https://www.scaler.com/topics/javascript/type-conversion-in-javascript/)
|
||||
- [Data Type Conversion](https://youtu.be/VQLYiFqetZM)
|
||||
- [Type conversion](https://developer.mozilla.org/en-US/docs/Glossary/Type_Conversion)
|
||||
- [What is typecasting in JavaScript](https://www.tutorialspoint.com/explain-typecasting-in-javascript)
|
||||
+10
@@ -0,0 +1,10 @@
|
||||
# Implicit Type Casting
|
||||
|
||||
Implicit type conversion happens when the compiler or runtime automatically converts data types. JavaScript is loosely typed language and most of the time operators automatically convert a value to the right type.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [GeeeksForGeeks - JavaScript Tutorials](https://www.geeksforgeeks.org/javascript-type-conversion/)
|
||||
- [W3Schools - JavaScript Tutorials](https://www.w3schools.com/js/js_type_conversion.asp)
|
||||
- [TutorialsPoint - JavaScript Tutorials](https://www.tutorialspoint.com/explain-typecasting-in-javascript)
|
||||
- [What you need to know about Javascripts Implicit Coercion](https://dev.to/promisetochi/what-you-need-to-know-about-javascripts-implicit-coercion-e23)
|
||||
@@ -0,0 +1,11 @@
|
||||
# Type Casting
|
||||
|
||||
Type conversion (or typecasting) means the transfer of data from one data type to another. Implicit conversion happens when the compiler (for compiled languages) or runtime (for script languages like [JavaScript](https://developer.mozilla.org/en-US/docs/Glossary/JavaScript)) automatically converts data types. The source code can also explicitly require a conversion to take place.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Type Conversions](https://javascript.info/type-conversions)
|
||||
- [JavaScript Type Conversion](https://www.w3schools.com/js/js_type_conversion.asp)
|
||||
- [Type Casting in JavaScript](https://www.tutorialspoint.com/type-casting-in-javascript)
|
||||
- [JavaScript Type Cast](https://www.geeksforgeeks.org/javascript-type-conversion)
|
||||
|
||||
+9
@@ -0,0 +1,9 @@
|
||||
# Arrays
|
||||
|
||||
Arrays are objects that store a collection of items and can be assigned to a variable. They have their methods that can perform operations on the array.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Working with Arrays in JavaScript](https://javascript.info/array)
|
||||
- [JavaScript Arrays](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array)
|
||||
- [JavaScript Arrays](https://www.youtube.com/watch?v=oigfaZ5ApsM)
|
||||
+8
@@ -0,0 +1,8 @@
|
||||
# Typed Arrays
|
||||
|
||||
In Javascript, a typed array is an array-like buffer of binary data. There is no JavaScript property or object named TypedArray, but properties and methods can be used with typed array objects.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [JavaScript typed arrays](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Typed_arrays)
|
||||
- [Intro to Typed Arrays in JavaScript](https://www.youtube.com/watch?v=UYkJaW3pmj0)
|
||||
+10
@@ -0,0 +1,10 @@
|
||||
# Indexed collections
|
||||
|
||||
Indexed Collections are collections that have numeric indices i.e. the collections of data that are ordered by an index value. In JavaScript, an array is an indexed collection. An array is an ordered set of values that has a numeric index.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Indexed Collections](https://www.geeksforgeeks.org/javascript-indexed-collections/)
|
||||
- [What is Indexed collections?](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Indexed_collections)
|
||||
- [Indexed collections in JavaScript](https://www.tutorialspoint.com/indexed-collections-in-javascript)
|
||||
- [Javascript Arrays](https://youtu.be/XYq9QpgAx8g)
|
||||
+8
@@ -0,0 +1,8 @@
|
||||
# Map
|
||||
|
||||
[Map](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map) is a collection of keyed data items, just like an `Object`. But the main difference is that `Map` allows keys of any type.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Map - Keyed Collections](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map)
|
||||
- [Map Data Type](https://javascript.info/map-set#map)
|
||||
+8
@@ -0,0 +1,8 @@
|
||||
# Weak map
|
||||
|
||||
[WeakMap](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/WeakMap) is a Map-like collection of key/value pairs whose keys must be objects, it removes them once they become inaccessible by other means
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [WeakMap](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/WeakMap)
|
||||
- [WeakMap and WeakSet](https://javascript.info/weakmap-weakset)
|
||||
+8
@@ -0,0 +1,8 @@
|
||||
# Set
|
||||
|
||||
The `Set` object lets you store unique values of any type, whether [primitive](https://developer.mozilla.org/en-US/docs/Glossary/Primitive) values or object references. A value in the `Set` may only occur once; it is unique in the `Set`'s collection.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Set - JavaScript](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set)
|
||||
- [Set - ExploringJS](https://exploringjs.com/impatient-js/ch_sets.html)
|
||||
+8
@@ -0,0 +1,8 @@
|
||||
# WeakSet
|
||||
|
||||
`WeakSet` objects are collections of objects. Just as with `Sets`, each object in a `WeakSet` may occur only once; all objects in a `WeakSet`'s collection are unique.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [WeakSet](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/WeakSet)
|
||||
- [WeakMap and WeakSet](https://javascript.info/weakmap-weakset)
|
||||
+10
@@ -0,0 +1,10 @@
|
||||
# Keyed Collections
|
||||
|
||||
Keyed collections are data collections that are ordered by key not index. They are associative in nature. Map and set objects are keyed collections and are iterable in the order of insertion.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Keyed collections](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Keyed_collections)
|
||||
- [ES6 keyed collections- Maps and sets](https://blog.logrocket.com/es6-keyed-collections-maps-and-sets/)
|
||||
- [How to use Keyed collections](https://www.freecodecamp.org/news/how-to-use-javascript-collections-map-and-set/)
|
||||
- [Creating keyed collection](https://youtu.be/4UqSqF4foy4)
|
||||
+8
@@ -0,0 +1,8 @@
|
||||
# JSON
|
||||
|
||||
JavaScript Object Notation (JSON) is a standard text-based format for representing structured data based on JavaScript object syntax. It is commonly used for transmitting data in web applications (e.g., sending some data from the server to the client, so it can be displayed on a web page, or vice versa).
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Working with JSON](https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Objects/JSON)
|
||||
- [JSON Tutorial for Beginners](https://www.youtube.com/watch?v=iiADhChRriM)
|
||||
+9
@@ -0,0 +1,9 @@
|
||||
# Structured data
|
||||
|
||||
Structured data is used by search-engines, like Google, to understand the content of the page, as well as to gather information about the web and the world in general.
|
||||
|
||||
It is also coded using in-page markup on the page that the information applies to.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Google Developers docs](https://developers.google.com/search/docs/appearance/structured-data/intro-structured-data)
|
||||
@@ -0,0 +1,13 @@
|
||||
# Data Structures
|
||||
|
||||
A Data structure is a format to organize, manage and store data in a way that allows efficient access and modification. JavaScript has primitive (built-in) and non-primitive (not built-in) data structures. Primitive data structures come by default with the programming language and you can implement them out of the box (like arrays and objects). Non-primitive data structures don't come by default and you have to code them up if you want to use them.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [ Data structures](https://www.freecodecamp.org/news/data-structures-in-javascript-with-examples/#what-is-a-data-structure)
|
||||
- [Introduction to the Stack Data Structure](https://youtu.be/4F-BnR2XwqU)
|
||||
- [Introduction to the Queue Data Structure](https://youtu.be/GRA_3Ppl2ZI)
|
||||
- [Intro to Recursion: Anatomy of a Recursive Solution](https://youtu.be/yBWlPte6FhA)
|
||||
- [Binary Tree Algorithms for Technical Interviews - Full Course](https://youtu.be/fAAZixBzIAI)
|
||||
- [Graph Algorithms for Technical Interviews - Full Course](https://youtu.be/tWVWeAqZ0WU)
|
||||
- [Dynamic Programming - Learn to Solve Algorithmic Problems & Coding Challenges](https://youtu.be/oBt53YbR9Kk)
|
||||
+8
@@ -0,0 +1,8 @@
|
||||
# isLooselyEqual
|
||||
|
||||
[isLooselyEqual](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Equality) checks whether its two operands are equal, returning a `Boolean` result. It attempts to convert and compare operands that are of different types.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [ Loosely Equality (==) Operator](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Equality)
|
||||
- [Comparison - javascript.info](https://javascript.info/comparison)
|
||||
+8
@@ -0,0 +1,8 @@
|
||||
# isStrictlyEqual
|
||||
|
||||
[isStrictlyEqual](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Strict_equality) checks whether its two operands are equal, returning a `Boolean` result. It always considers operands of different types to be different.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [ Strictly Equality (===) Operator](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Strict_equality)
|
||||
- [Comparison - javascript.info](https://javascript.info/comparison)
|
||||
+7
@@ -0,0 +1,7 @@
|
||||
# Same value zero
|
||||
|
||||
[SameValueZero](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Equality_comparisons_and_sameness#same-value-zero_equality) equality determines whether two values are functionally identical in all contexts with +0 and -0 are also considered equal.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [ Same-value-zero equality](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Equality_comparisons_and_sameness#same-value-zero_equality)
|
||||
+7
@@ -0,0 +1,7 @@
|
||||
# Same value
|
||||
|
||||
[SameValue](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Equality_comparisons_and_sameness#same-value_equality_using_object.is) equality determines whether two values are functionally identical in all contexts.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [ Same-value equality using Object.is()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Equality_comparisons_and_sameness#same-value_equality_using_object.is)
|
||||
+7
@@ -0,0 +1,7 @@
|
||||
# Equality algorithms
|
||||
|
||||
Equality algorithms are used to perform equality comparisons of values or variables in JavaScript. Each equality algorithm works slightly differently, and the one you use depends on the type of comparison you want to make.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Which JavaScript equality algorithm should you use?](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Equality_comparisons_and_sameness)
|
||||
+12
@@ -0,0 +1,12 @@
|
||||
# Value Comparison Operators
|
||||
|
||||
In javascript, the `==` operator does the type conversion of the operands before comparison, whereas the `===` operator compares the values and the data types of the operands. The `Object.is()` method determines whether two values are the same value: `Object.is(value1, value2)`.
|
||||
|
||||
`Object.is()` is not equivalent to the `==` operator. The `==` operator applies various coercions to both sides (if they are not the same type) before testing for equality (resulting in such behavior as `"" == false` being `true`), but `Object.is()` doesn't coerce either value.
|
||||
|
||||
`Object.is()` is also not equivalent to the `===` operator. The only difference between `Object.is()` and `===` is in their treatment of signed zeros and `NaN` values. The `===` operator (and the `==` operator) treats the number values `-0` and `+0` as equal but treats `NaN` as not equal to each other.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [The Difference Between == and === in Javascript](https://www.scaler.com/topics/javascript/difference-between-double-equals-and-triple-equals-in-javascript/)
|
||||
- [Equality comparisons and sameness - MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Equality_comparisons_and_sameness#same-value_equality_using_object.is)
|
||||
@@ -0,0 +1,8 @@
|
||||
# Equality Comparisons
|
||||
|
||||
Comparison operators are used in logical statements to determine equality or difference between variables or values. Comparison operators can be used in conditional statements to compare values and take action depending on the result.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [JavaScript Comparisons](https://www.w3schools.com/js/js_comparisons.asp)
|
||||
- [JavaScript Equality Operators](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators#equality_operators)
|
||||
+8
@@ -0,0 +1,8 @@
|
||||
# for...in statement
|
||||
|
||||
The for...in statement iterates over all enumerable properties of an object that are keyed by strings (ignoring ones keyed by Symbols), including inherited enumerable properties.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [for...in statement - MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...in)
|
||||
- [The for..in loop with examples](https://javascript.info/object#forin)
|
||||
+7
@@ -0,0 +1,7 @@
|
||||
# for...of statement
|
||||
|
||||
The for...of statement executes a loop that operates on a sequence of values sourced from an iterable object. Iterable objects include instances of built-ins such as Array, String, TypedArray, Map, Set, NodeList (and other DOM collections), and the arguments object, generators produced by generator functions, and user-defined iterables.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [for...of statement - MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of)
|
||||
+10
@@ -0,0 +1,10 @@
|
||||
# Labeled Statements
|
||||
|
||||
JavaScript label statements are used to prefix a label to an identifier. It can be used with `break` and `continue` statement to control the flow more precisely.
|
||||
|
||||
A label is simply an identifier followed by a colon`(:)` that is applied to a block of code.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [JavaScript MDN Docs](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/label)
|
||||
- [Tutorialspoint – JavaScript Tutorial](https://www.tutorialspoint.com/What-are-label-statements-in-JavaScript)
|
||||
+11
@@ -0,0 +1,11 @@
|
||||
# Break continue
|
||||
|
||||
`break` statement, without a label reference, can only be used to jump out of a loop or a switch block.
|
||||
|
||||
`continue` statement, with or without a label reference, can only be used to skip one loop iteration.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [JavaScript MDN Docs - continue statement](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/continue)
|
||||
- [JavaScript MDN Docs - break statement](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/break)
|
||||
- [W3Schools – JavaScript Tutorial](https://www.w3schools.com/js/js_break.asp)
|
||||
+8
@@ -0,0 +1,8 @@
|
||||
# The `for` loop
|
||||
|
||||
The `for` loop is a standard control-flow construct in many programming languages, including JavaScript. It's commonly used to iterate over given sequences or iterate a known number of times and execute a piece of code for each iteration.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [JavaScript for Loop - CodeGuage](https://www.codeguage.com/courses/js/loops-for-loop)
|
||||
- [The for Loop - MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for)
|
||||
+8
@@ -0,0 +1,8 @@
|
||||
# do...while statement
|
||||
|
||||
The `do...while` statement creates a loop that executes a specified statement until the test condition evaluates to `false`. The condition is evaluated after executing the statement, resulting in the specified statement executing at least once.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [do...while - MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/do...while)
|
||||
- [JavaScript do...while Loop - W3Schools](https://www.w3schools.com/jsref/jsref_dowhile.asp)
|
||||
+8
@@ -0,0 +1,8 @@
|
||||
# while statement
|
||||
|
||||
The `while` statement creates a loop that executes a specified statement as long as the test condition evaluates to `true`. The condition is evaluated before executing the statement.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [While Statement - MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/while)
|
||||
- [The while Loop - CodeGuage](https://www.codeguage.com/courses/js/loops-while-loop)
|
||||
@@ -0,0 +1,16 @@
|
||||
# Loops and Iterations
|
||||
|
||||
Loops offer a quick and easy way to do something repeatedly.
|
||||
|
||||
You can think of a loop as a computerized version of the game where you tell someone to take X steps in one direction, then Y steps in another. For example, the idea "Go five steps to the east" could be expressed this way as a loop:
|
||||
|
||||
```
|
||||
for (let step = 0; step < 5; step++) {
|
||||
// Runs 5 times, with values of step 0 through 4.
|
||||
console.log('Walking east one step');
|
||||
}
|
||||
```
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Loops and iteration](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Loops_and_iteration)
|
||||
+5
@@ -0,0 +1,5 @@
|
||||
# Throw Statement
|
||||
|
||||
The throw statement throws a user-defined exception. Execution of the current function will stop (the statements after throw won't be executed), and control will be passed to the first catch block in the call stack. If no catch block exists among caller functions, the program will terminate. (excerpt from MDN)
|
||||
|
||||
Visit the following resources to learn more:
|
||||
+8
@@ -0,0 +1,8 @@
|
||||
# Try, Catch, Finally
|
||||
|
||||
These are ways of handling errors in your JavaScript code. Inside the try code block we have the code to run, inside the catch block we handle the errors, and inside the finally block we have code that runs after the execution of the previous code blocks, regardless of the result.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [JavaScript Errors](https://www.w3schools.com/js/js_errors.asp)
|
||||
|
||||
+35
@@ -0,0 +1,35 @@
|
||||
# Utilizing error objects
|
||||
|
||||
When a runtime error occurs, a new `Error` object is created and thrown. With this `Error` object, we can determine the type of the Error and handle it according to its type.
|
||||
|
||||
## Types of Errors:
|
||||
|
||||
Besides error constructors, Javascript also has other core Error constructors.
|
||||
|
||||
- [AggregateError](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/AggregateError)
|
||||
- [EvalError](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/EvalError)
|
||||
- [InternalError](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/InternalError)
|
||||
- [RangeError](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RangeError)
|
||||
- [ReferenceError](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/ReferenceError)
|
||||
- [SyntaxError](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/SyntaxError)
|
||||
|
||||
## Example
|
||||
|
||||
```js
|
||||
try {
|
||||
willGiveErrorSometime();
|
||||
} catch (error) {
|
||||
if (error instanceof RangeError) {
|
||||
rangeErrorHandler(error);
|
||||
} else if (error instanceof ReferenceError) {
|
||||
referenceErrorHandle(error);
|
||||
} else {
|
||||
errorHandler(error);
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Error Object - MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Error)
|
||||
- [Control flow & Error handling - MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Control_flow_and_error_handling)
|
||||
+7
@@ -0,0 +1,7 @@
|
||||
# Exception Handling
|
||||
|
||||
In JavaScript, all exceptions are simply objects. While the majority of exceptions are implementations of the global Error class, any old object can be thrown. With this in mind, there are two ways to throw an exception: directly via an Error object, and through a custom object. (excerpt from Rollbar)
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Throwing Exceptions in JavaScript](https://rollbar.com/guides/javascript/how-to-throw-exceptions-in-javascript)
|
||||
+17
@@ -0,0 +1,17 @@
|
||||
# If else
|
||||
|
||||
The `if` statement executes a statement if a specified condition is `truthy`. If the condition is `falsy`, another statement in the optional `else` clause will be executed.
|
||||
|
||||
## Example
|
||||
```js
|
||||
if (condition) {
|
||||
statement1
|
||||
} else {
|
||||
statement2
|
||||
}
|
||||
```
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [if...else - MDN docs](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/if...else)
|
||||
- [Conditional branching: if, ? - javascript.info](https://javascript.info/ifelse)
|
||||
+28
@@ -0,0 +1,28 @@
|
||||
# Switch Case
|
||||
|
||||
The `switch` statement evaluates an expression, matching the expression's value against a series of `case` clauses, and executes statements after the first `case` clause with a matching value, until a `break` statement is encountered. The `default` clause of a `switch` statement will be jumped to if no `case` matches the expression's value.
|
||||
|
||||
## Example
|
||||
```js
|
||||
switch (expression) {
|
||||
case value1:
|
||||
//Statements executed when the result of expression matches value1
|
||||
break;
|
||||
case value2:
|
||||
//Statements executed when the result of expression matches value2
|
||||
break;
|
||||
...
|
||||
case valueN:
|
||||
//Statements executed when the result of expression matches valueN
|
||||
break;
|
||||
default:
|
||||
//Statements executed when none of the values match the value of the expression
|
||||
break;
|
||||
}
|
||||
```
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [switch - MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/switch)
|
||||
- [The `switch` Statement: Why, What and How - CodeGuage](https://www.codeguage.com/courses/js/conditions-switch)
|
||||
- [The switch statement - javascript.info](https://javascript.info/switch)
|
||||
+8
@@ -0,0 +1,8 @@
|
||||
# Conditional statements
|
||||
|
||||
When you write code, you often want to perform different actions for different decisions. You can use conditional statements in your code to do this. In JavaScript, we have three conditional statements: `if`, `if...else`, and `switch`.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Making decisions in your code — conditionals](https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Building_blocks/conditionals)
|
||||
- [Conditional branching: if, ?](https://javascript.info/ifelse)
|
||||
@@ -0,0 +1,13 @@
|
||||
# Control Flow
|
||||
|
||||
In JavaScript, the `Control flow` is a way of how your computer runs code from top to bottom. It starts from the first line and ends at the last line unless it hits any statement that changes the control flow of the program such as loops, conditionals, etc.
|
||||
|
||||
We can control the flow of the program through any of these control structures:
|
||||
- Sequential (default mode)
|
||||
- Conditional Statements
|
||||
- Exception Handling
|
||||
- Loops and Iterations
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Control Flow - MDN](https://developer.mozilla.org/en-US/docs/Glossary/Control_flow)
|
||||
+8
@@ -0,0 +1,8 @@
|
||||
# Assignment Operators
|
||||
|
||||
An assignment operator assigns a value to its left operand based on the value of its right operand. The simple assignment operator is equal (`=`), which assigns the value of its right operand to its left operand. That is, `x = f()` is an assignment expression that assigns the value of `f()` to `x`.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Assignment Operators](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Expressions_and_Operators#assignment_operators)
|
||||
- [Basic Operators](https://javascript.info/operators#assignment)
|
||||
+9
@@ -0,0 +1,9 @@
|
||||
# Comparison Operators
|
||||
|
||||
Comparison operators are the operators that compare values and return true or false. The operators include: `>`, `<`, `>=`, `<=`, `==`, `===`, `!=` and `!==`
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [W3Schools - JavaScript Tutorials](https://www.w3schools.com/js/js_comparisons.asp)
|
||||
- [JavaScript MDN Docs](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Expressions_and_Operators#comparison_operators)
|
||||
- [Comparison operators](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Expressions_and_Operators#comparison_operators)
|
||||
+19
@@ -0,0 +1,19 @@
|
||||
# Arithmetic operators
|
||||
|
||||
The Arithmetic operators perform addition, subtraction, multiplication, division, exponentiation, and remainder operations.
|
||||
|
||||
Arithmetic operators in JavaScript are as follows:
|
||||
- `+` (Addition)
|
||||
- `-` (Subtraction)
|
||||
- `*` (Multiplication)
|
||||
- `**` (Exponentiation)
|
||||
- `/` (Division)
|
||||
- `%` (Modulus i.e. Remainder)
|
||||
- `++` (Increment)
|
||||
- `--` (Decrement)
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Arithmetic Operators - MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators#arithmetic_operators)
|
||||
- [Arithmetic Operators - JavaScript.info](https://javascript.info/operators#maths)
|
||||
- [JavaScript Arithmetic Operators](https://www.w3schools.com/js/js_arithmetic.asp)
|
||||
+19
@@ -0,0 +1,19 @@
|
||||
# Bitwise operators
|
||||
|
||||
Bitwise operators treat arguments as 32-bits (zeros & ones) and work on the level of their binary representation.
|
||||
Ex. Decimal number `9` has a binary representation of `1001`. Bitwise operators perform their operations on such binary representations, but they return standard JavaScript numerical values.
|
||||
|
||||
Bitwise operators in JavaScript are as follows:
|
||||
|
||||
- `&` (AND)
|
||||
- `|` (OR)
|
||||
- `^` (XOR)
|
||||
- `~` (NOT)
|
||||
- `<<` (Left SHIFT)
|
||||
- `>>` (Right SHIFT)
|
||||
- `>>>` (Zero-Fill Right SHIFT)
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Bitwise Operators - MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Expressions_and_Operators#bitwise_operators)
|
||||
- [Bitwise Operators - JavaScript.info](https://javascript.info/operators#bitwise-operators)
|
||||
+8
@@ -0,0 +1,8 @@
|
||||
# Logical Operators
|
||||
|
||||
There are four logical operators in JavaScript: `||` (OR), `&&` (AND), `!` (NOT), `??` (Nullish Coalescing).
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Logical Operators - MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators#binary_logical_operators)
|
||||
- [Logical Operators - MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators#binary_logical_operators)
|
||||
+7
@@ -0,0 +1,7 @@
|
||||
# BigInt Operators
|
||||
|
||||
Most operators that can be used with the `Number` data type will also work with `BigInt` values (e.g. arithmetic, comparison, etc.). However, the unsigned right shift `>>>` operator is an exception and is not supported. Similarly, some operators may have slight differences in behaviour (for example, division with `BigInt` will round towards zero).
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [BigInt Operators](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Expressions_and_Operators#bigint_operators)
|
||||
+10
@@ -0,0 +1,10 @@
|
||||
# String Operators
|
||||
|
||||
In addition to the comparison operators, which can be used on string values, the concatenation operator (`+`) concatenates two string values together, returning another string that is the union of the two operand strings.
|
||||
|
||||
The shorthand assignment operator `+=` can also be used to concatenate strings.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [JavaScript MDN Tutorials](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Expressions_and_Operators#string_operators)
|
||||
- [String Concatenation - JavaScript.info](https://javascript.info/operators#string-concatenation-with-binary)
|
||||
+14
@@ -0,0 +1,14 @@
|
||||
# Conditional operators
|
||||
|
||||
Conditional operator also known as Ternary operator is the only JS operator that takes three operands.
|
||||
|
||||
The operator can have one of two values based on a condition.
|
||||
|
||||
Syntax:
|
||||
|
||||
`condition ? val_for_true : val_for_false `
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [JavaScript MDN Docs](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Expressions_and_Operators#conditional_operator)
|
||||
- [W3Schools - JavaScript Tutorials](https://www.w3schools.com/js/js_comparisons.asp)
|
||||
+7
@@ -0,0 +1,7 @@
|
||||
# Comma operators
|
||||
|
||||
The comma operator (`,`) evaluates each of its operands (from left to right) and returns the value of the last operand. This lets you create a compound expression in which multiple expressions are evaluated, with the compound expression's final value being the value of the rightmost of its member expressions. This is commonly used to provide multiple parameters to a `for` loop.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Comma operator](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comma_Operator)
|
||||
+8
@@ -0,0 +1,8 @@
|
||||
# Unary Operators
|
||||
|
||||
JavaScript Unary Operators are the special operators that consider a single operand and perform all the types of operations on that single operand. These operators include unary plus, unary minus, prefix increments, postfix increments, prefix decrements, and postfix decrements.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Unary Operators in JavaScript](https://www.educba.com/unary-operators-in-javascript/)
|
||||
- [Unary Operators - MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators#unary_operators)
|
||||
+7
@@ -0,0 +1,7 @@
|
||||
# Relational Operators
|
||||
|
||||
Relational operators are also known as comparison operators. They are used to find the relationship between two values or compare the relationship between them; on the comparison, they yield the result true or false.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Relational Operators - MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators#relational_operators)
|
||||
@@ -0,0 +1,7 @@
|
||||
# Expressions and Operators
|
||||
|
||||
At a high level, an expression is a valid unit of code that resolves to a value. There are two types of expressions: those that have side effects (such as assigning values) and those that purely evaluate. The expression `x = 7` is an example of the first type. This expression uses the `=` operator to assign the value seven to the variable x. The expression itself evaluates to 7. The expression `3 + 4` is an example of the second type. This expression uses the `+` operator to add `3` and `4` together and produces a value, `7`. However, if it's not eventually part of a bigger construct (for example, a variable declaration like const `z = 3 + 4`), its result will be immediately discarded `—` this is usually a programmer mistake because the evaluation doesn't produce any effects. As the examples above also illustrate, all complex expressions are joined by operators, such as `=` and `+`.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Expressions and operators](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Expressions_and_Operators)
|
||||
+18
@@ -0,0 +1,18 @@
|
||||
# Defining and Calling Functions
|
||||
|
||||
**Defining:**
|
||||
- JavaScript function *declarations* are made by using the `function` keyword.
|
||||
- Functions can also be defined by saving function *expressions* to a variable. "Arrow" functions are commonly used in this way.
|
||||
|
||||
**Calling:**
|
||||
- When a function is defined, it is not yet executed.
|
||||
- To call and invoke a function's code, use the function's name followed by parentheses: `functionName()`.
|
||||
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Defining Functions](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions#defining_functions)
|
||||
- [Calling Functions](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions#calling_functions)
|
||||
- [Function Definitions](https://www.w3schools.com/js/js_function_definition.asp)
|
||||
|
||||
|
||||
+7
@@ -0,0 +1,7 @@
|
||||
# Default Parameters
|
||||
|
||||
Default function parameters allow named parameters to be initialized with default values if no value or `undefined` is passed.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Default Parameters - MDN Docs](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Default_parameters)
|
||||
+7
@@ -0,0 +1,7 @@
|
||||
# Rest Parameters
|
||||
|
||||
The rest parameter syntax allows a function to accept an indefinite number of arguments as an array, providing a way to represent [variadic functions](https://en.wikipedia.org/wiki/Variadic_function) in JavaScript.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Rest Parameters - MDN Docs](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/rest_parameters)
|
||||
+7
@@ -0,0 +1,7 @@
|
||||
# Function Parameters
|
||||
|
||||
The parameter is the name given to the variable declared inside the definition of a function. There are two special kinds of syntax: default and rest parameters.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Function Parameters](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions#function_parameters)
|
||||
@@ -0,0 +1,8 @@
|
||||
# Arrow Functions
|
||||
|
||||
Arrow Function is a new way of creating functions with the '=>' operator with a shorter syntax.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [MDN - Arrow Function Expressions](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions)
|
||||
- [JavaScript Arrow Function](https://www.w3schools.com/js/js_arrow_function.asp)
|
||||
@@ -0,0 +1,8 @@
|
||||
# IIFE
|
||||
|
||||
Immediately-Invoked Function Expression is a function that is executed immediately after it is created.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [IIFE — MDN Docs](https://developer.mozilla.org/en-US/docs/Glossary/IIFE)
|
||||
- [JavaScript in Plain English - IIFE](https://javascript.plainenglish.io/https-medium-com-javascript-in-plain-english-stop-feeling-iffy-about-using-an-iife-7b0292aba174)
|
||||
@@ -0,0 +1,7 @@
|
||||
# Arguments object
|
||||
|
||||
The arguments object is an Array-like object accessible inside functions that contains the values of the arguments passed to that function, available within all non-arrow functions. You can refer to a function's arguments inside that function by using its arguments object. It has entries for each argument the function was called with, with the first entry's index at 0. But, in modern code, rest parameters should be preferred.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [The arguments object - MDN Docs](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/arguments)
|
||||
+9
@@ -0,0 +1,9 @@
|
||||
# Recursion
|
||||
|
||||
One of the most powerful and elegant concept of functions, recursion is when a function invokes itself. Such a function is called a **_recursive function_**. As recursion happens, the underlying code of the recursive function gets executed again and again until a terminating condition, called the _base case_, gets fulfilled. As you dive into the world of algorithms, you'll come across recursion in many many instances.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Recursion and Stack](https://javascript.info/recursion)
|
||||
- [JavaScript Function Recursions - CodeGuage](https://www.codeguage.com/courses/js/functions-recursions)
|
||||
- [Recursion - MDN](https://developer.mozilla.org/en-US/docs/Glossary/Recursion)
|
||||
+9
@@ -0,0 +1,9 @@
|
||||
# Lexical scoping
|
||||
|
||||
Before one can make an intuition of closures in JavaScript, it's important to first get the hang of the term '**_lexical environment_**'. In simple words, the lexical environment for a function `f` simply refers to the environment enclosing that function's definition in the source code.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [What is a lexical environment? - JavaScript - CodeGuage](https://www.codeguage.com/courses/js/functions-closures#What_is_a_lexical_environment)
|
||||
- [Lexical scoping - JavaScript - MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures#lexical_scoping)
|
||||
- [Lexical Scope in JavaScript – What Exactly Is Scope in JS?](https://www.freecodecamp.org/news/javascript-lexical-scope-tutorial/)
|
||||
+7
@@ -0,0 +1,7 @@
|
||||
# Closures
|
||||
|
||||
Function closures are one of the most powerful, yet most misunderstood, concepts of JavaScript that are actually really simple to understand. A closure refers to a function along with its lexical environment. It is essentially what allows us to return a function `A`, from another function `B`, that remembers the local variables defined in `B`, even after `B` exits. The idea of closures is employed in nearly every other JavaScript program, hence, it's paramount for a JavaScript developer to know it really well.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [JavaScript Closures - The Simplest Explanation](https://www.codeguage.com/courses/js/functions-closures)
|
||||
+18
@@ -0,0 +1,18 @@
|
||||
# Scope and function stack
|
||||
|
||||
## Scope
|
||||
A space or environment in which a particular variable or function can be accessed or used. Accessibility of this variable or function depends on where it is defined.
|
||||
|
||||
JavaScript has the following kinds of scopes:
|
||||
- **Global scope**: The default scope for all code running in script mode.
|
||||
- **Module scope**: The scope for code running in module mode.
|
||||
- **Function scope**: The scope created with a function.
|
||||
- **Block scope**: The scope created with a pair of curly braces (a block).
|
||||
|
||||
## Function Stack (Call stack)
|
||||
The function stack is how the interpreter keeps track of its place in a script that calls multiple functions, like which function is currently executing and which functions within that function are being called.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Function stack (call stack) - MDN](https://developer.mozilla.org/en-US/docs/Glossary/Call_stack)
|
||||
- [Kinds of Scope - MDN](https://developer.mozilla.org/en-US/docs/Glossary/Scope)
|
||||
+11
@@ -0,0 +1,11 @@
|
||||
# Built in functions
|
||||
|
||||
- A JavaScript **method** is a property containing a **function definition** . In other words, when the data stored on an object is a function we call that a method.
|
||||
- To differentiate between properties and methods, we can think of it this way: **A property is what an object has, while a method is what an object does.**
|
||||
- Since JavaScript methods are actions that can be performed on objects, we first need to have objects to start with. There are several objects built into JavaScript which we can use.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [JavaScript Built-in Functions](https://www.tutorialspoint.com/javascript/javascript_builtin_functions.htm)
|
||||
- [Built-in Methods in Javascript](https://dev.to/elpepebenitez/built-in-methods-in-javascript-4bll)
|
||||
- [Built-in Functions:](https://www.tutorialride.com/javascript/javascript-built-in-functions.htm)
|
||||
@@ -0,0 +1,9 @@
|
||||
# Functions
|
||||
|
||||
Functions exist so we can reuse code. They are blocks of code that execute whenever they are invoked. Each function is typically written to perform a particular task, like an addition function used to find the sum of two or more numbers. When numbers need to be added anywhere within your code, the addition function can be invoked as many times as necessary.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Functions - MDN Docs](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions)
|
||||
- [JavaScript Functions - Programming with Mosh](https://youtu.be/N8ap4k_1QEQ)
|
||||
- [JavaScript Functions in Detail - CodeGuage](https://www.codeguage.com/courses/js/functions-basics)
|
||||
@@ -0,0 +1,14 @@
|
||||
# Strict Mode
|
||||
|
||||
JavaScript's strict mode is a way to opt-in to a restricted variant of JavaScript, thereby implicitly opting out of "sloppy mode". Strict mode isn't just a subset: it intentionally has different semantics from regular code. Browsers not supporting strict mode will run strict mode code with different behavior from browsers that do, so don't rely on strict mode without feature-testing for support for the relevant aspects of strict mode. Strict mode code and non-strict mode code can coexist so that scripts can opt into strict mode incrementally.
|
||||
|
||||
Strict mode makes several changes to normal JavaScript semantics:
|
||||
|
||||
- Eliminates some JavaScript silent errors by changing them to throw errors.
|
||||
- Fixes mistakes that make it difficult for JavaScript engines to perform optimizations: strict mode code can sometimes run faster than identical code that's not strict mode.
|
||||
- Prohibits some syntax likely to be defined in future versions of ECMAScript.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Strict mode](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Strict_mode)
|
||||
- [Strict mode in JavaScript](https://javascript.info/strict-mode)
|
||||
+7
@@ -0,0 +1,7 @@
|
||||
# Function Borrowing
|
||||
|
||||
Function borrowing allows us to use the methods of one object on a different object without having to make a copy of that method and maintain it in two separate places. It is accomplished through the use of `.call()`, `.apply()`, or `.bind()`, all of which exist to explicitly set this on the method we are borrowing.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Function borrowing](https://medium.com/@ensallee/function-borrowing-in-javascript-4bd671e9d7b4)
|
||||
+8
@@ -0,0 +1,8 @@
|
||||
# this in a method
|
||||
|
||||
Methods are properties of an object which are functions. The value of this inside a method is equal to the calling object. In simple words, this value is the object “before dot”, the one used to call the method.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [`this` in methods](https://javascript.info/object-methods#this-in-methods)
|
||||
- [Short and clear post about the `this` keyword](https://www.w3schools.com/js/js_this.asp)
|
||||
+9
@@ -0,0 +1,9 @@
|
||||
# this in a function
|
||||
|
||||
The keyword `this` when used in a function refers to the global object.
|
||||
|
||||
*Note: in a browser window the global object is the `window` object.*
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [this in a function](https://www.w3schools.com/js/js_this.asp)
|
||||
+9
@@ -0,0 +1,9 @@
|
||||
# Using this alone
|
||||
|
||||
The keyword `this` when used alone refers to the global object.
|
||||
|
||||
*Note: in a browser window the global object is the `window` object.*
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [this Alone](https://www.w3schools.com/js/js_this.asp)
|
||||
+7
@@ -0,0 +1,7 @@
|
||||
# this in event handlers
|
||||
|
||||
The keyword `this` when used in an event handler refers to the element that received the event.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [this in Event handlers](https://www.w3schools.com/js/js_this.asp)
|
||||
+7
@@ -0,0 +1,7 @@
|
||||
# this in arrow functions
|
||||
|
||||
The keyword `this` when used in an arrow function refers to the parent object.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [this keyword and arrow function](https://stackoverflow.com/questions/66518020/javascript-this-keyword-and-arrow-function)
|
||||
+8
@@ -0,0 +1,8 @@
|
||||
# Explicit binding
|
||||
|
||||
Explicit binding is when you use the `call` or `apply` methods to explicitly set the value of `this` in a function. Explicit Binding can be applied using `call()`, `apply()`, and `bind()`.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [Explicit Binding](https://medium.com/swlh/javascript-this-ac28f8e0f65d)
|
||||
- [Explicit Binding rule for this keyword](https://medium.com/@msinha2801/explicit-binding-rule-for-this-keyword-in-js-712405b0a11)
|
||||
@@ -0,0 +1,7 @@
|
||||
# call() method
|
||||
|
||||
The `call()` method calls the function with a reference to the aspire object to `this` keyword. `call()` method accepts an argument list and each arguments should be provided individually.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [call() method](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/call)
|
||||
@@ -0,0 +1,7 @@
|
||||
# apply() method
|
||||
|
||||
`apply()` method is almost identical to `call()` method, except that `call()` method accepts an argument list, while `apply()` method accepts a single array of arguments.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [apply() method](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/apply)
|
||||
@@ -0,0 +1,7 @@
|
||||
# bind() method
|
||||
|
||||
The `bind()` method return a new method that has its `this` keyword refers to the aspire object, with a given sequence of arguments which can be call later.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [bind() method](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind)
|
||||
@@ -0,0 +1,15 @@
|
||||
# This Keyword
|
||||
|
||||
In JavaScript, the `this` keyword is a little different compared to other languages. It refers to an object, but it depends on how or where it is being invoked. It also has some differences between strict mode and non-strict mode.
|
||||
|
||||
- In an object method, `this` refers to the object
|
||||
- Alone, `this` refers to the global object
|
||||
- In a function, `this` refers to the global object
|
||||
- In a function, in strict mode, `this` is undefined
|
||||
- In an event, `this` refers to the element that received the event
|
||||
- Methods like call(), apply(), and bind() can refer `this` to any object
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [The JavaScript `this` Keyword](https://www.w3schools.com/js/js_this.asp)
|
||||
- [This Keyword](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this)
|
||||
+9
@@ -0,0 +1,9 @@
|
||||
# Event Loop
|
||||
|
||||
The Event Loop is one of the most important aspects to understand about Node.js. Why is this so important? Because it explains how Node.js can be asynchronous and have non-blocking I/O, it explains the "killer feature" of Node.js, which made it this successful.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [The Node.Js Event Loop](https://nodejs.org/en/docs/guides/event-loop-timers-and-nexttick/#what-is-the-event-loop)
|
||||
- [JavaScript Visualized: Event Loop](https://dev.to/lydiahallie/javascript-visualized-event-loop-3dif)
|
||||
- [What the heck is the event loop anyway?](https://www.youtube.com/watch?v=8aGhZQkoFbQ)
|
||||
+10
@@ -0,0 +1,10 @@
|
||||
# setTimeout
|
||||
|
||||
The setTimeout runs a function after the specified period expires. Times are declared in milliseconds.
|
||||
|
||||
Visit the following resources to learn more:
|
||||
|
||||
- [JavaScript MDN Docs](https://developer.mozilla.org/en-US/docs/Web/API/setTimeout)
|
||||
- [W3Schools – JavaScript - setTimeOut](https://www.w3schools.com/jsref/met_win_settimeout.asp)
|
||||
- [setInterval and setTimeout: timing events](https://www.youtube.com/watch?v=kOcFZV3c75I)
|
||||
- [setTimeout EXPLAINED in 5 minutes!](https://www.youtube.com/watch?v=z9lJb4D3nJY)
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user