gaspersic/freeCodeCamp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Javascript -> JavaScript (English) (#35183)

Browse Source 
* Javascript -> JavaScript (English)

* Update technical documentation page for required change

* Update use-class-syntax-to-define-a-constructor-function.english.md

* Update left-factorials.md
This commit is contained in:
Lipis
2019-03-28 09:35:41 +01:00
committed by The Coding Aviator
parent fed6ffb606
commit e84ae45008
95 changed files with 192 additions and 192 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
guide/english/javascript/additional-javascript-resources/index.md
View File

@@ -41,7 +41,7 @@ title: JavaScript Tutorials and Other Resources
* [The Modern JavaScript Tutorial](https://javascript.info/)
* [Introduction to JavaScript: First Steps](https://www.educative.io/collection/5679346740101120/5720605454237696)
* [JavaScript for Cats](http://jsforcats.com/)
* [Javascript.com by Pluralsight](https://www.javascript.com/learn)
* [JavaScript.com by Pluralsight](https://www.javascript.com/learn)
* [SoloLearn JavaScript Tutorial](https://www.sololearn.com/Course/JavaScript/)
* [GeeksforGeeks](https://www.geeksforgeeks.org/javascript-tutorial/)
* [Udacity Intro to JavaScript](https://eu.udacity.com/course/intro-to-javascript--ud803)
@@ -54,7 +54,7 @@ title: JavaScript Tutorials and Other Resources
* [Derek Banas - Learn JS In One Video](https://www.youtube.com/watch?v=fju9ii8YsGs)
* [Derek Banas - Object Oriented JavaScript](https://www.youtube.com/watch?v=O8wwnhdkPE4)
* [JavaScript Fundamentals for Absolute Beginners 2018](https://www.youtube.com/watch?v=YMvzfQSI6pQ)
* [Udemy - Javascript Understanding the Weird Parts (_first 3.5 hrs_)](https://www.youtube.com/watch?v=Bv_5Zv5c-Ts)
* [Udemy - JavaScript Understanding the Weird Parts (_first 3.5 hrs_)](https://www.youtube.com/watch?v=Bv_5Zv5c-Ts)
* [Functional programming in JavaScript](https://www.youtube.com/playlist?list=PL0zVEGEvSaeEd9hlmCXrk5yUyqUag-n84)
* [Douglas Crockford's Videos](https://www.youtube.com/watch?v=v2ifWcnQs6M&index=1&list=PL62E185BB8577B63D)
* [Gordon Zhu - Practical JavaScript](https://watchandcode.com/p/practical-javascript)
@@ -75,7 +75,7 @@ title: JavaScript Tutorials and Other Resources
* [WebStorm](https://www.jetbrains.com/webstorm)
A full-feature IDE for Javascript, including code completion and support for live linting, version control, and testing. Made by JetBrains and modelled after their IntelliJ Java IDE.
A full-feature IDE for JavaScript, including code completion and support for live linting, version control, and testing. Made by JetBrains and modelled after their IntelliJ Java IDE.
* <a href='http://brackets.io' target='_blank' rel='nofollow'>Brackets</a>
@@ -151,7 +151,7 @@ title: JavaScript Tutorials and Other Resources
6 books on JavaScript by Kyle Simpson. From beginner to advanced.
* [Eloquent Javascript](https://eloquentjavascript.net/)
* [Eloquent JavaScript](https://eloquentjavascript.net/)
Fantastic, thorough introduction to the basics and features of JavaScript, complete with in-browser interactive code
@@ -165,8 +165,8 @@ title: JavaScript Tutorials and Other Resources
* [Learning JavaScript Design Patterns](http://addyosmani.com/resources/essentialjsdesignpatterns/book)
* [Airbnb JavaScript Style Guide](https://github.com/airbnb/javascript)
* [Javascript Allonge Six](https://leanpub.com/javascriptallongesix/read)
* [JavaScript Allonge Six](https://leanpub.com/javascriptallongesix/read)
* [The JavaScript Way](https://github.com/bpesquet/thejsway)
* [Modern JS Cheatsheet](https://mbeaudru.github.io/modern-js-cheatsheet)
* [Speaking Javascript](http://speakingjs.com/es5)
* [Speaking JavaScript](http://speakingjs.com/es5)
* [Exploring ES6](http://exploringjs.com/es6)

8
guide/english/javascript/advantages-and-disadvantages-of-javascript/index.md
View File

@@ -8,18 +8,18 @@ Like all computer languages, JavaScript has certain advantages and disadvantages
## Advantages of JavaScript
* **Speed**. Client-side JavaScript is very fast because it can be run immediately within the client-side browser. Unless outside resources are required, JavaScript is unhindered by network calls to a backend server. It also has no need to be compiled on the client side which gives it certain speed advantages (granted, adding some risk dependent on that quality of the code developed).
* **Simplicity**. JavaScript is relatively simple to learn and implement.
* **Popularity**. JavaScript is used everywhere in the web. The resources to learn JavaScript are numerous. StackOverflow and GitHub have many projects that are using Javascript and the language as a whole has gained a lot of traction in the industry in recent years especially.
* **Popularity**. JavaScript is used everywhere in the web. The resources to learn JavaScript are numerous. StackOverflow and GitHub have many projects that are using JavaScript and the language as a whole has gained a lot of traction in the industry in recent years especially.
* **Interoperability**. JavaScript plays nicely with other languages and can be used in a huge variety of applications. Unlike PHP or [SSI](https://en.wikipedia.org/wiki/Server_Side_Includes) scripts, JavaScript can be inserted into any web page regardless of the file extension. JavaScript can also be used inside scripts written in other languages such as Perl and PHP.
* **Server Load**. Being client-side reduces the demand on the website server.
* **Rich interfaces**. Drag and drop components or slider may give a rich interface to your website.
* **Extended Functionality**. Third party add-ons like Greasemonkey enable JavaScript developers to write snippets of JavaScript which can execute on desired web pages to extend its functionality.
* **Frameworks**. If there is anything JavaScript could thank for its wild success, it is frameworks. With the rise in demand of the popular [MEAN Stack](https://en.wikipedia.org/wiki/MEAN_(software_bundle)), JavaScript is giving developers a true bang for their buck. In addition to Node and React, both extremely helpful in web development and continually trending, other frameworks such as [React Native](https://facebook.github.io/react-native/), are giving JavaScript developers the ability to create their own hybrid mobile applications. Also, building desktop applications with JavaScript is possible by using the [Electron Framework](https://electronjs.org). With just one language, developers can, and will, go far with JavaScript.
* **Versatility**. Nowadays, there are many ways to use JavaScript through [Node.js](https://nodejs.org/en/) servers. If you were to bootstrap node.js with Express, use a document database like [MongoDB](https://www.mongodb.com/), and use JavaScript on the front-end for clients, it is possible to develop an entire JavaScript app from front to back using only JavaScript.
* **Updates**. Since the advent of EcmaScript 5 (the scripting specification that Javascript relies on), Ecma International has dedicated to updating JavaScript annually. So far, we have received browser support for ES6 in 2017 and look forward to ES7 being supported in future months.
* **Asynchronous nature**. Javascript is Asynchronous in nature which means that it doesn't freeze the working of other features if any function is taking lot of time to execute maybe a fethch request.
* **Updates**. Since the advent of EcmaScript 5 (the scripting specification that JavaScript relies on), Ecma International has dedicated to updating JavaScript annually. So far, we have received browser support for ES6 in 2017 and look forward to ES7 being supported in future months.
* **Asynchronous nature**. JavaScript is Asynchronous in nature which means that it doesn't freeze the working of other features if any function is taking lot of time to execute maybe a fethch request.
## Disadvantages of JavaScript
* **Client-Side Security**. Because the code executes on the user's computer, in some cases it can be exploited for malicious purposes. This is one reason some people choose to disable Javascript.
* **Client-Side Security**. Because the code executes on the user's computer, in some cases it can be exploited for malicious purposes. This is one reason some people choose to disable JavaScript.
* **Browser Support**. JavaScript is sometimes interpreted differently by different browsers. Whereas server-side scripts will always produce the same output, client-side scripts can be a little unpredictable. Don't be overly concerned by this though - as long as you test your script in all the major browsers you should be safe. Also, there are services out there that will allow you to test your code automatically on check-in of an update to make sure all browsers support your code.
* **Browser Optionality**. Most browsers come with features to disable JavaScript, and your website or application may not work properly if it is disabled.
* **Script Visibility**. JavaScript code is always visible to everyone.

2
guide/english/javascript/booleans/index.md
View File

@@ -6,7 +6,7 @@ title: Boolean
Boolean is a primitive data type commonly used in computer programming languages. By definition, a boolean has two possible values: `true` or `false`.
In Javascript, there is often implicit type coercion to boolean. If, for example, you have an if statement which checks a certain expression, that expression will be coerced to a boolean:
In JavaScript, there is often implicit type coercion to boolean. If, for example, you have an if statement which checks a certain expression, that expression will be coerced to a boolean:
```javascript
var a = 'a string';

6
guide/english/javascript/callback-functions/index.md
View File

@@ -1,11 +1,11 @@
---
title: Callback Functions
---
This article gives a brief introduction to the concept and usage of callback functions in the Javascript programming language.
This article gives a brief introduction to the concept and usage of callback functions in the JavaScript programming language.
## Functions are Objects
The first thing we need to know is that in Javascript, functions are first-class objects. As such, we can work with them in the same way we work with other objects, like assigning them to variables and passing them as arguments into other functions. This is important, because it's the latter technique that allows us to extend functionality in our applications.
The first thing we need to know is that in JavaScript, functions are first-class objects. As such, we can work with them in the same way we work with other objects, like assigning them to variables and passing them as arguments into other functions. This is important, because it's the latter technique that allows us to extend functionality in our applications.
## Callback Functions
@@ -41,7 +41,7 @@ createQuote("eat your vegetables!", function(quote){
});
```
Incidentally, you don't _have_ to use the word "callback" as the name of your argument, Javascript just needs to know that it's the correct argument name. Based on the above example, the below function will behave in exactly the same manner.
Incidentally, you don't _have_ to use the word "callback" as the name of your argument, JavaScript just needs to know that it's the correct argument name. Based on the above example, the below function will behave in exactly the same manner.
```javascript
function createQuote(quote, functionToCall) {

10
guide/english/javascript/closures/index.md
View File

@@ -4,7 +4,7 @@ title: Closures
# Closures
A closure is the combination of a function and the lexical environment (scope) within which that function was declared. Closures are a fundamental and powerful property of Javascript. This article discusses the 'how' and 'why' about Closures:
A closure is the combination of a function and the lexical environment (scope) within which that function was declared. Closures are a fundamental and powerful property of JavaScript. This article discusses the 'how' and 'why' about Closures:
@@ -97,7 +97,7 @@ In this example, we won't be able to access `balance` from anywhere outside of t
<b>Emulating block-scoped variables.</b>
Javascript did not have a concept of block-scoped variables. Meaning that when defining a variable inside a forloop for example, this variable is visible from outside the forloop as well. So how can closures help us solve this problem ? Let's take a look.
JavaScript did not have a concept of block-scoped variables. Meaning that when defining a variable inside a forloop for example, this variable is visible from outside the forloop as well. So how can closures help us solve this problem ? Let's take a look.
```javascript
var funcs = [];
@@ -145,7 +145,7 @@ Closures have many special applications that are useful when creating large java
<b>Emulating private variables.</b>
Unlike many other languages, Javascript does not have a mechanism which allows you to create encapsulated instance variables within an object. Having public instance variables can cause a lot of problems when building medium to large programs. However with closures, this problem can be mitigated.
Unlike many other languages, JavaScript does not have a mechanism which allows you to create encapsulated instance variables within an object. Having public instance variables can cause a lot of problems when building medium to large programs. However with closures, this problem can be mitigated.
Much like in the previous example, you can build functions which return object literals with methods that have access to the object's local variables without exposing them. Thus, making them effectively private.
@@ -204,7 +204,7 @@ for(var i = 0; i <= 10; ++i) {
```
While running the above function, it'll print the 10th power for all the iterations. The reason behind this scenario is, the for loop is iterating over the values and calls the readFile function asynchronouly; when the callback function gets the data, the value of the variable <b>pw</b> already becomes <b>10</b> and that is why the all the loop iteration uses the power as last values.
To mitigate this we can use closure function. We can keep the codes inside the loop in a closure function and then the variable <b>pw</b> will be inside the scope of closure function and it will be fixed for an iteration. While running a callback function for iteration fifth, it won't be overridden by the values of other iteration as the `var pw` will be scoped inside the closure function. This concept is called Immediately Invoked Function Expressions in Javascript
To mitigate this we can use closure function. We can keep the codes inside the loop in a closure function and then the variable <b>pw</b> will be inside the scope of closure function and it will be fixed for an iteration. While running a callback function for iteration fifth, it won't be overridden by the values of other iteration as the `var pw` will be scoped inside the closure function. This concept is called Immediately Invoked Function Expressions in JavaScript
```
for(var i = 0; i <= 10; ++i) {
@@ -225,4 +225,4 @@ for(var i = 0; i <= 10; ++i) {
<a href='https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures' target='_blank' rel='nofollow'>MDN</a>
<br />
<a href='https://medium.freecodecamp.org/lets-learn-javascript-closures-66feb44f6a44' target='_blank' rel='nofollow'>Javascript Closures</a>
<a href='https://medium.freecodecamp.org/lets-learn-javascript-closures-66feb44f6a44' target='_blank' rel='nofollow'>JavaScript Closures</a>

2
guide/english/javascript/code-linting-in-javascript/index.md
View File

@@ -14,7 +14,7 @@ Linters will go through your code, and highlight
Linters can be installed using `npm` or another package manager. Linters can be used from the command line by passing in files. Linters are also available as plugins for tools and sometimes they are directly integrated into editors.
Here are some popular Javascript Linters:
Here are some popular JavaScript Linters:
[JSLint](http://www.javascriptlint.com/online_lint.php)

4
guide/english/javascript/concurrency-model-and-event-loop/index.md
View File

@@ -4,7 +4,7 @@ title: Concurrency Model and Event Loop
## Concurrency Model and Event Loop
Javascript runtime is single threaded which means that it can execute one piece of code at a time. In order to understand the concurrency model and the event loop in Javascript we have to first get around with some common terms that are associated with it. First let's learn what is a call stack.
JavaScript runtime is single threaded which means that it can execute one piece of code at a time. In order to understand the concurrency model and the event loop in JavaScript we have to first get around with some common terms that are associated with it. First let's learn what is a call stack.
A call stack is a simple data structure that records where in the code we are currently. So if we step into a function that is a function invocation it is pushed to the call stack and when we return from a function it is popped out of the stack.
@@ -31,7 +31,7 @@ multiply executes and it returns with the multiplied value. Finally the squared
So to summarize whenever a function is invoked it is pushed into the call stack where it executes. Finally when the function is done with it's execution and is returning either implicitly or explicitly it will be popped off the stack. The call stack just records at what point in time which funciton was executing. It keeps track of which function is currently executing.
Now we know from this that Javascript can execute one thing at a time but that's not the case with the Browser. The Browser has it's own set of API's like setTimeout, XMLHttpRequests which are not specified in the Javascript runtime. In fact if you look through the source code of V8, the popular Javascript runtime that powers browsers like Google Chrome you won't find any definitions for it. It's because these special web API's exist in the browser environment not inside the javascript environment and you can say that these apis introduces concurrency into the mix. Let's look at a diagram to understand the whole picture.
Now we know from this that JavaScript can execute one thing at a time but that's not the case with the Browser. The Browser has it's own set of API's like setTimeout, XMLHttpRequests which are not specified in the JavaScript runtime. In fact if you look through the source code of V8, the popular JavaScript runtime that powers browsers like Google Chrome you won't find any definitions for it. It's because these special web API's exist in the browser environment not inside the javascript environment and you can say that these apis introduces concurrency into the mix. Let's look at a diagram to understand the whole picture.
![Concurrency and Event Loop Model](https://i.imgur.com/rnQEY7o.png)

2
guide/english/javascript/es6/destructuring/index.md
View File

@@ -4,7 +4,7 @@ title: Destructuring Assignment
## Destructuring Assignment
Destructuring Assignment syntax is a Javascript expression that makes it possible to unpack values or properties from arrays or objects.
Destructuring Assignment syntax is a JavaScript expression that makes it possible to unpack values or properties from arrays or objects.
Lets say that you have an array that contains a first name and last name as its two values, but you want to reassign those values to something more descriptive. You can use Destructuring to accomplish this.

4
guide/english/javascript/es6/let-and-const/index.md
View File

@@ -73,14 +73,14 @@ console.log(c); // ReferenceError: c is not defined
Consider another example.
```
const LANGUAGES = ['Js', 'Ruby', 'Python', 'Go'];
LANGUAGES = "Javascript"; // shows error.
LANGUAGES = "JavaScript"; // shows error.
LANGUAGES.push('Java'); // Works fine.
console.log(LANGUAGES); // ['Js', 'Ruby', 'Python', 'Go', 'Java']
```
This may be little confusing.
Consider in this way. Whenever you define a const variable, Javascript references the address of the value to the variable. In our example the variable ‘LANGUAGES’ actually references to the memory allocated to the array. So you cannot change the variable to reference some other memory location later. Throughout the program it only references to the array.
Consider in this way. Whenever you define a const variable, JavaScript references the address of the value to the variable. In our example the variable ‘LANGUAGES’ actually references to the memory allocated to the array. So you cannot change the variable to reference some other memory location later. Throughout the program it only references to the array.
## Further Reading

2
guide/english/javascript/function-invocation/index.md
View File

@@ -43,7 +43,7 @@ myObject.fullName(); // Function invoked as a method, will return "John
### Arrow Functions
In the newest version of Javascript, you can also shorten the syntax by using Arrow Functions.
In the newest version of JavaScript, you can also shorten the syntax by using Arrow Functions.
The following demonstrates two functions. One is written in the standard form, one is written as an arrow function. Keep in mind that arrow functions do not have their own this, arguments, super, or new.target.
```javascript

2
guide/english/javascript/global-object/index.md
View File

@@ -39,4 +39,4 @@ The global object also contains the properties `NaN`, `undefined` and `Infinity`
# References
1. MSDN: <a href='https://msdn.microsoft.com/en-us/library/52f50e9t' target='_blank' rel='nofollow'>Global Object (Javascript)</a>
1. MSDN: <a href='https://msdn.microsoft.com/en-us/library/52f50e9t' target='_blank' rel='nofollow'>Global Object (JavaScript)</a>

2
guide/english/javascript/global-variables/index.md
View File

@@ -36,7 +36,7 @@ console.log(window.dog); //Fluffy
It’s a best practice to minimize global variables. Since the variable can be accessed anywhere in the program, they can cause strange behavior.
References:
* [var -Javascript|MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/var)
* [var -JavaScript|MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/var)
* [You Don't Know JavaScript: Scopes & Closures](https://github.com/getify/You-Dont-Know-JS/tree/master/scope%20%26%20closures)
Additional Info:

2
guide/english/javascript/higher-order-functions/index.md
View File

@@ -133,5 +133,5 @@ There are limitations to this for example, the int 3 and the string '3' will be
See the guide on [Closures](https://guide.freecodecamp.org/javascript/closures) for more information on how `multiplyByTwo` keeps a reference to `num1` in the example above.
- [More info about Closures](https://eloquentjavascript.net/05_higher_order.html)
- [Eloquent Javascript](https://eloquentjavascript.net/05_higher_order.html)
- [Eloquent JavaScript](https://eloquentjavascript.net/05_higher_order.html)
- [Medium Article](https://medium.freecodecamp.org/higher-order-functions-in-javascript-d9101f9cf528)

4
guide/english/javascript/html-dom-innerhtml-property/index.md
View File

@@ -37,11 +37,11 @@ The HTML now will be like
***SECURITY CONSIDERATIONS***
The value that's set to `innerHTML` should come from trusted sources, since Javascript will put anything inside that element and it will be run as plain HTML.
The value that's set to `innerHTML` should come from trusted sources, since JavaScript will put anything inside that element and it will be run as plain HTML.
Example:
Setting a "`<script>alert();</script>`" value will cause the Javascript "alert()" function to be fired:
Setting a "`<script>alert();</script>`" value will cause the JavaScript "alert()" function to be fired:
```javascript

2
guide/english/javascript/immutable-types/index.md
View File

@@ -3,7 +3,7 @@ title: Immutable Types
---
> Immutable means unchangeable i.e. you can't change.
Javascript has lots of immutable types e.g. `string` primitive type. Try this in your console.
JavaScript has lots of immutable types e.g. `string` primitive type. Try this in your console.
s = "red";
console.log(s[1]); //→ "e"

10
guide/english/javascript/index.md
View File

@@ -17,16 +17,16 @@ or watch this [inspiring video from Preethi Kasireddy](https://www.youtube.com/w
## A Short History of JavaScript
<h3>1996:</h3>
<p>It changed from LIVESCRIPT to JAVASCRIPT to attract developers.<br>
<p>It changed from LiveScript to JavaScript to attract developers.<br>
*JavaScript has nothing to do with Java.</p>
<h3>1997:</h3>
<p>JAVASCRIPT was sold to ECMA and become,<br>
the first version of JAVASCRIPT Language Standerd.</p>
<p>JavaScript was sold to ECMA and become,<br>
the first version of JavaScript Language Standerd.</p>
<h3>2009:</h3>
<p>ES5 (ECMASCRIPT 5) was released with lots of new features.</p>
<p>ES5 (ECMAScript 5) was released with lots of new features.</p>
<h3>2015:</h3>
<p>It changed to annual realease cycle,<br>
It means JAVASCRIPT releases new Updates every year.<br>
It means JavaScript releases new Updates every year.<br>
(With small feature Updates.)</p>
<h3>2016/ 2017/18/19:</h3>
<p>Releases of versions - ES2016/ ES2017/ ES2018/....</p>

2
guide/english/javascript/logical-operators/index.md
View File

@@ -86,5 +86,5 @@ true || (anything) // short-circuit evaluated to true.
Note that where `&&` returns the first value, `||` returns the second value and vice versa.
## Additional Resources
- [Javascript Truth Table](https://guide.freecodecamp.org/javascript/truth-table)
- [JavaScript Truth Table](https://guide.freecodecamp.org/javascript/truth-table)
- [MDN](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Operators/Logical_Operators)

2
guide/english/javascript/object-instantiation/functional/index.md
View File

@@ -131,7 +131,7 @@ myFun.method1();
Pseudoclassical Instantiation is by far contains the least amount of code. Rather than creating a new object and returning it, the new keyword does that for us. Under the hood, when you use the new keyword to instantiate an object, you create a new object using this = Object.create(Object.prototype), where this refers to the prototype that is named after the new keyword. When we are defining our methods, we use the prototype keyword.
## Why would I use it?
Pseudoclassical is said to be the fastest instantiation pattern, which is helpful if you are creating tens of thousands of instances. It is also the most optimized since it utilizes Javascript functionality.
Pseudoclassical is said to be the fastest instantiation pattern, which is helpful if you are creating tens of thousands of instances. It is also the most optimized since it utilizes JavaScript functionality.
## What are the drawbacks?
The downside of Pseudoclassical Instantiation is that it requires a bit more knowledge about what JavaScript is doing under the hood, particularly with the this keyword. This makes this type of object instantiation a bit more complex to understand, especially if someone else is reading your code

2
guide/english/javascript/object-instantiation/index.md
View File

@@ -3,7 +3,7 @@ title: Object Instantiation
---
## Object Instantiation
In Javascript and most other languages, an object contains a series of properties, which are a key, value pair. There are multiple options available to you when you need to construct an object.
In JavaScript and most other languages, an object contains a series of properties, which are a key, value pair. There are multiple options available to you when you need to construct an object.
### Initialize an object variable
You can create an object with pre-defined properties like so:

6
guide/english/javascript/semicolons/index.md
View File

@@ -1,7 +1,7 @@
---
title: Semicolons
---
Semicolons are not required in Javascript. This is because Javascript has a feature called "Automatic Semicolon Insertion" or ASI for short. ASI puts semicolons in your Javascript for you. It is always active by default and it's a part of the language and can not be disabled.
Semicolons are not required in JavaScript. This is because JavaScript has a feature called "Automatic Semicolon Insertion" or ASI for short. ASI puts semicolons in your JavaScript for you. It is always active by default and it's a part of the language and can not be disabled.
ASI has a set of rules it uses to determine where it should insert semicolons. If there is already a semicolon in place, it won't change anything. See <a href='http://stackoverflow.com/a/2846298/3467946' target='_blank' rel='nofollow'>this StackOverflow answer</a> for more information on how ASI works.
@@ -18,7 +18,7 @@ A consistent coding style makes code more readable. Decide whether you will or w
## Errors you might run into
When Javascript was first made it was meant to aid beginners to get into programming. Nobody wants to be searching for a dang semi-colon in their code when they first start programming. So the choice of semi-colons was implemented, as stated above they are technically there.
When JavaScript was first made it was meant to aid beginners to get into programming. Nobody wants to be searching for a dang semi-colon in their code when they first start programming. So the choice of semi-colons was implemented, as stated above they are technically there.
For example:
```javasctipt
@@ -32,7 +32,7 @@ let z = foo(10);
z(10)// TypeError z is not a function
// Because of Automatic Semicolon Insertion, our inner function does not exist.
```
Javascript will implement semi-colons where they are expected.
JavaScript will implement semi-colons where they are expected.
### Other resources

6
guide/english/javascript/standard-objects/json/json-arrays/index.md
View File

@@ -3,11 +3,11 @@ title: JSON Arrays
---
## JSON Arrays
JSON Arrays are no different from normal array object that you use in Javascript. Its an array object which contains multiple `JSON Objects`.
JSON Arrays are no different from normal array object that you use in JavaScript. Its an array object which contains multiple `JSON Objects`.
Here is an example of a JSON Array:
```Javascript
```JavaScript
var aMyPlaylist = [{
artist: "Ed Sheeran",
track: "Supermarket flowers",
@@ -25,4 +25,4 @@ This is an JSON Array named as `aMyPlaylist`. All array methods like `map`, `fil
More array methods can be found in following links
- <a href='https://guide.freecodecamp.org/javascript/standard-objects/array' target='_blank' rel='nofollow'>Array - Freecodecamp</a>
- <a href='https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array' target='_blank' rel='nofollow'>Array - Mozilla Developer Network</a>
- <a href='https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array' target='_blank' rel='nofollow'>Array - Mozilla Developer Network</a>

14
guide/english/javascript/tutorials/how-to-create-a-dropdown-menu-with-css-and-javascript/index.md
View File

@@ -3,7 +3,7 @@ title: How to Create a Dropdown Menu with CSS and JavaScript
---
## How to Create a Dropdown Menu with CSS and JavaScript
In this tutorial you will learn how to create a simple dropdown menu with vanilla Javascript, HTML and CSS. We will walk through the HTML, CSS and Javascript code, but paying more attention to the programming, since this is a JS tutorial. We'll use just plain JS and CSS, with no frameworks or preprocessors. The only (kind-of) exception will be importing the [Font Awesome](https://fontawesome.com/) CSS file because we'll use one of its icons.
In this tutorial you will learn how to create a simple dropdown menu with vanilla JavaScript, HTML and CSS. We will walk through the HTML, CSS and JavaScript code, but paying more attention to the programming, since this is a JS tutorial. We'll use just plain JS and CSS, with no frameworks or preprocessors. The only (kind-of) exception will be importing the [Font Awesome](https://fontawesome.com/) CSS file because we'll use one of its icons.
This is targeted to developers that have an average understanding of HTML, CSS and JS. I tried to make it as clean as possible, but I won't focus too much on details here. I hope you all enjoy.
@@ -130,7 +130,7 @@ body{
```
#### JavaScript:
Now we'll see how the Javascript part is implemented. We'll first go through the function definitions
Now we'll see how the JavaScript part is implemented. We'll first go through the function definitions
and then the code that calls these functions to make the dropdown actions happen.
Basically, there are 3 actions that take place depending on what the user interaction is, as their listeners are added to the DOM elements:
@@ -141,7 +141,7 @@ Basically, there are 3 actions that take place depending on what the user intera
I'd like to make it clear that we are using arrow functions( `() => {}` ) and the `const` keyword, which are ES6 features. You're probably good if you're using a recent version of your browser, but keep that in mind.
#### 1. Clicking on the dropdown element
```Javascript
```JavaScript
function toggleClass(elem,className){
if (elem.className.indexOf(className) !== -1){
elem.className = elem.className.replace(className,'');
@@ -179,7 +179,7 @@ When the dropdown element is clicked, it opens(if it is closed) or closes(if it
#### 2. Selecting one of the dropdown options
```Javascript
```JavaScript
function handleOptionSelected(e){
toggleClass(e.target.parentNode, 'hide');
@@ -199,7 +199,7 @@ function handleOptionSelected(e){
}
```
#### 3. Changing the currently selected option
```Javascript
```JavaScript
function handleTitleChange(e){
const result = document.getElementById('result');
@@ -210,7 +210,7 @@ function handleTitleChange(e){
The function `handleTitleChange` is bound to the custom `change` event on the `.title` element, to change the `#result` element content whenever the title element changes. This event's triggering is done on the previous section.
#### Main code
```Javascript
```JavaScript
//get elements
const dropdownTitle = document.querySelector('.dropdown .title');
@@ -230,4 +230,4 @@ This application's full code and demo can be found [here](https://codepen.io/GCr
## More Information
* [ES6 introduction](https://guide.freecodecamp.org/javascript/es6)
* [Arrow functions](https://guide.freecodecamp.org/javascript/es6/arrow-functions/)
* [Let and Const](https://guide.freecodecamp.org/javascript/es6/let-and-const/)
* [Let and Const](https://guide.freecodecamp.org/javascript/es6/let-and-const/)

6
guide/english/javascript/tutorials/using-anonymous-functions-for-private-namespacing-in-your-javascript-apps/index.md
View File

@@ -3,7 +3,7 @@ title: Using Anonymous Functions for Private Namespacing in Your JavaScript Apps
---
Let's take a look at what a namespace is when it comes to building JavaScript applications and some of the benefits from using a private namespace when building your apps.
**Please note that this article references anonymous self-executing functions. If you're unaware of what this is, please read this excellent article by Noah Stokes: <a href='http://esbueno.noahstokes.com/post/77292606977/self-executing-anonymous-functions-or-how-to-write' target='_blank' rel='nofollow'>Self-Executing Anonymous Functions or How to Write Clean Javascript</a>. This article will go into detail about anonymous self-executing functions.**
**Please note that this article references anonymous self-executing functions. If you're unaware of what this is, please read this excellent article by Noah Stokes: <a href='http://esbueno.noahstokes.com/post/77292606977/self-executing-anonymous-functions-or-how-to-write' target='_blank' rel='nofollow'>Self-Executing Anonymous Functions or How to Write Clean JavaScript</a>. This article will go into detail about anonymous self-executing functions.**
## What is a Namespace?
@@ -35,7 +35,7 @@ To break this down into simpler terms from a real life scenario, let's say you a
## Achieving a Private Namespace
So, how do we achieve this **private namespace** in JavaScript? Use an anonymous self-executing function! If you didn't read the article by Noah Stokes, <a href='http://esbueno.noahstokes.com/post/77292606977/self-executing-anonymous-functions-or-how-to-write' target='_blank' rel='nofollow'>Self-Executing Anonymous Functions or How to Write Clean Javascript</a>, please do so now. This article will go into detail about anonymous self-executing functions.
So, how do we achieve this **private namespace** in JavaScript? Use an anonymous self-executing function! If you didn't read the article by Noah Stokes, <a href='http://esbueno.noahstokes.com/post/77292606977/self-executing-anonymous-functions-or-how-to-write' target='_blank' rel='nofollow'>Self-Executing Anonymous Functions or How to Write Clean JavaScript</a>, please do so now. This article will go into detail about anonymous self-executing functions.
Let's take a look at using that _points_ variable from earlier, but let's separate it into a **private namespace**:
@@ -71,4 +71,4 @@ is the same as:
document.querySelector('body').style.background = 'blue';
</script>
Keep in mind that this is just one way to use namespaces in JavaScript applications. Adapt your code to what best fits the situation at hand.
Keep in mind that this is just one way to use namespaces in JavaScript applications. Adapt your code to what best fits the situation at hand.

10
guide/english/javascript/tutorials/what-does-javascript-void-0-mean/index.md
View File

@@ -14,11 +14,11 @@ But, **void with operand 0 is preferred**.
**Two ways of using operand 0 -> void(0) or void 0.** Either of them is fine.
#### When to use Javascript void (0) ?
#### When to use JavaScript void (0) ?
When on link click, you don't want the browser to load a new page or refresh the same page( depending on the URL specified ).
Instead,perform the JavaScript attached to that link.
#### Sample Example 1 with Javascript void (0) :
#### Sample Example 1 with JavaScript void (0) :
```html
<html>
@@ -32,7 +32,7 @@ When clicked on ClickMe link,an alert pops up as below :
![Output1](https://github.com/srawat19/-Guide_Images/blob/master/voidOutput1.PNG?raw=true)
#### Sample Example 2 with Javascript void (0) :
#### Sample Example 2 with JavaScript void (0) :
```html
<html>
@@ -45,7 +45,7 @@ When clicked on ClickMe link,an alert pops up as below :
When you double click the link,an alert will popup without any page refresh.
#### Sample Example 3 with Javascript void (0) :
#### Sample Example 3 with JavaScript void (0) :
```html
<html>
@@ -59,7 +59,7 @@ ondblclick="alert('Hello !! You will see me and not get redirected to google.com
When you double click the link,an alert will popup,closing it will also not redirect to google.com.
#### Sample Example without Javascript void (0) :
#### Sample Example without JavaScript void (0) :
```html
<html>