From 29b2bfb65e29a042367f1b8506489acdb478bc96 Mon Sep 17 00:00:00 2001
From: wbamberg Several months later, Microsoft released JScript with Internet Explorer 3. It was a mostly-compatible JavaScript work-alike. Several months after that, Netscape submitted JavaScript to Ecma International, a European standards organization, which resulted in the first edition of the ECMAScript standard that year. The standard received a significant update as ECMAScript edition 3 in 1999, and it has stayed pretty much stable ever since. The fourth edition was abandoned, due to political differences concerning language complexity. Many parts of the fourth edition formed the basis for ECMAScript edition 5, published in December of 2009, and for the 6th major edition of the standard, published in June of 2015. Because it is more familiar, we will refer to ECMAScript as "JavaScript" from this point on. Note: Because it is more familiar, we will refer to ECMAScript as "JavaScript" from this point on. Unlike most programming languages, the JavaScript language has no concept of input or output. It is designed to run as a scripting language in a host environment, and it is up to the host environment to provide mechanisms for communicating with the outside world. The most common host environment is the browser, but JavaScript interpreters can also be found in a huge list of other places, including Adobe Acrobat, Adobe Photoshop, SVG images, Yahoo's Widget engine, server-side environments such as Node.js, NoSQL databases like the open source Apache CouchDB, embedded computers, complete desktop environments like GNOME (one of the most popular GUIs for GNU/Linux operating systems), and others. Note: The {{jsxref("Global_Objects/parseInt", "parseInt()")}} and {{jsxref("Global_Objects/parseFloat", "parseFloat()")}} functions parse a string until they reach a character that isn't valid for the specified number format, then return the number parsed up to that point. However the "+" operator converts the string to Starting in ECMAScript 5, reserved words may be used as object property names "in the buff". This means that they don't need to be "clothed" in quotes when defining object literals. See the ES5 Spec. Note: Starting in ECMAScript 5, reserved words may be used as object property names "in the buff". This means that they don't need to be "clothed" in quotes when defining object literals. See the ES5 Spec. For more on objects and prototypes see Object.prototype. For an explanation of object prototypes and the object prototype chains see Inheritance and the prototype chain. Starting in ECMAScript 2015, object keys can be defined by the variable using bracket notation upon being created. Note: Starting in ECMAScript 2015, object keys can be defined by the variable using bracket notation upon being created. In the above code, the variable args holds all the values that were passed into the function.Numbers
isFinite(NaN); // false
-NaN
if there is an invalid character contained within it. Just try parsing the string "10.2abc" with each method by yourself in the console and you'll understand the differences better.NaN
if there is an invalid character contained within it. Just try parsing the string "10.2abc" with each method by yourself in the console and you'll understand the differences better.Strings
@@ -466,13 +466,13 @@ Objects
{[phoneType]: 12345}
is possible instead of just var userPhone = {}; userPhone[phoneType] = 12345
.{[phoneType]: 12345}
is possible instead of just var userPhone = {}; userPhone[phoneType] = 12345
.Arrays
@@ -658,9 +658,9 @@ Functions
avg(2, 3, 4, 5); // 3.5
-
+
-It is important to note that wherever the rest parameter operator is placed in a function declaration it will store all arguments after its declaration, but not before. i.e. function avg(firstValue, ...args) will store the first value passed into the function in the firstValue variable and the remaining arguments in args. That's another useful language feature but it does lead us to a new problem. The avg()
function takes a comma-separated list of arguments — but what if you want to find the average of an array? You could just rewrite the function as follows:avg()
function takes a comma-separated list of arguments — but what if you want to find the average of an array? You could just rewrite the function as follows:
function avgArray(arr) { var sum = 0; @@ -680,11 +680,9 @@Functions
The second argument to
-apply()
is the array to use as arguments; the first will be discussed later on. This emphasizes the fact that functions are objects too.You can achieve the same result using the spread operator in the function call.
For instance:
-avg(...numbers)
Anonymous functions
@@ -757,7 +755,7 @@Recursive functions
Custom objects
-For a more detailed discussion of object-oriented programming in JavaScript, see Introduction to Object-Oriented JavaScript.+Note: For a more detailed discussion of object-oriented programming in JavaScript, see Introduction to Object-Oriented JavaScript.
In classic Object Oriented Programming, objects are collections of data and methods that operate on that data. JavaScript is a prototype-based language that contains no class statement, as you'd find in C++ or Java (this is sometimes confusing for programmers accustomed to languages with a class statement). Instead, JavaScript uses functions as classes. Let's consider a person object with first and last name fields. There are two ways in which the name might be displayed: as "first last" or as "last, first". Using the functions and objects that we've discussed previously, we could display the data like this:
diff --git a/files/en-us/web/javascript/closures/index.html b/files/en-us/web/javascript/closures/index.html index 9da4b52045d683f..46bfe1636bba41e 100644 --- a/files/en-us/web/javascript/closures/index.html +++ b/files/en-us/web/javascript/closures/index.html @@ -208,7 +208,7 @@Emulating private methods with
Notice how the two counters maintain their independence from one another. Each closure references a different version of the
privateCounter
variable through its own closure. Each time one of the counters is called, its lexical environment changes by changing the value of this variable. Changes to the variable value in one closure don't affect the value in the other closure.-Using closures in this way provides benefits that are normally associated with object-oriented programming. In particular, data hiding and encapsulation.
+Note: Using closures in this way provides benefits that are normally associated with object-oriented programming. In particular, data hiding and encapsulation.
Closure Scope Chain
diff --git a/files/en-us/web/javascript/data_structures/index.html b/files/en-us/web/javascript/data_structures/index.html index 3a8e2fc8d658748..20ac3b5040ac6c9 100644 --- a/files/en-us/web/javascript/data_structures/index.html +++ b/files/en-us/web/javascript/data_structures/index.html @@ -78,7 +78,7 @@Number type
To check for the largest available value or smallest available value within {{jsxref("Infinity", "±Infinity")}}, you can use the constants {{jsxref("Number.MAX_VALUE")}} or {{jsxref("Number.MIN_VALUE")}}.
-@@ -96,7 +96,7 @@Starting with ECMAScript 2015, you are also able to check if a number is in the double-precision floating-point number range using {{jsxref("Number.isSafeInteger()")}} as well as {{jsxref("Number.MAX_SAFE_INTEGER")}} and {{jsxref("Number.MIN_SAFE_INTEGER")}}.
+Note: Starting with ECMAScript 2015, you are also able to check if a number is in the double-precision floating-point number range using {{jsxref("Number.isSafeInteger()")}} as well as {{jsxref("Number.MAX_SAFE_INTEGER")}} and {{jsxref("Number.MIN_SAFE_INTEGER")}}.
Beyond this range, integers in JavaScript are not safe anymore and will be a double-precision floating point approximation of the value.
Number type
Although a number often represents only its value, JavaScript provides {{jsxref("Operators", "binary (bitwise) operators")}}.
-Caution: Although bitwise operators can be used to represent several Boolean values within a single number using bit masking, this is usually considered a bad practice. JavaScript offers other means to represent a set of Booleans (like an array of Booleans, or an object with Boolean values assigned to named properties). Bit masking also tends to make the code more difficult to read, understand, and maintain.
+Note: Although bitwise operators can be used to represent several Boolean values within a single number using bit masking, this is usually considered a bad practice. JavaScript offers other means to represent a set of Booleans (like an array of Booleans, or an object with Boolean values assigned to named properties). Bit masking also tends to make the code more difficult to read, understand, and maintain.
It may be necessary to use such techniques in very constrained environments, like when trying to cope with the limitations of local storage, or in extreme cases (such as when each bit over the network counts). This technique should only be considered when it is the last measure that can be taken to optimize size.
diff --git a/files/en-us/web/javascript/guide/control_flow_and_error_handling/index.html b/files/en-us/web/javascript/guide/control_flow_and_error_handling/index.html index c96acca8b536b2b..893cd1629a4abcf 100644 --- a/files/en-us/web/javascript/guide/control_flow_and_error_handling/index.html +++ b/files/en-us/web/javascript/guide/control_flow_and_error_handling/index.html @@ -55,7 +55,7 @@Example
Here,
{ x++; }
is the block statement.-Important: JavaScript before ECMAScript2015 (6th edition) +
Note: JavaScript before ECMAScript2015 (6th edition) does not have block scope! In older JavaScript, variables introduced within a block are scoped to the containing function or script, and the effects of setting them persist beyond the block itself. In other words, block statements do @@ -181,7 +181,7 @@
Falsy values
conditional statement.-Caution: Do not confuse the primitive boolean values +
Note: Do not confuse the primitive boolean values
@@ -437,7 +437,7 @@true
andfalse
with the true and false values of the {{jsxref("Boolean")}} object!The
catch
block-Best practice: When logging errors to the console inside +
Note: When logging errors to the console inside a
diff --git a/files/en-us/web/javascript/guide/details_of_the_object_model/index.html b/files/en-us/web/javascript/guide/details_of_the_object_model/index.html index 7c9ff561ce35799..50447e8ce8554e1 100644 --- a/files/en-us/web/javascript/guide/details_of_the_object_model/index.html +++ b/files/en-us/web/javascript/guide/details_of_the_object_model/index.html @@ -32,7 +32,7 @@catch
block, usingconsole.error()
rather thanconsole.log()
is advised for debugging. It formats the message as an error, and adds it to the list of error messages generated by the page.Defining a class
JavaScript follows a similar model, but does not have a class definition separate from the constructor. Instead, you define a constructor function to create objects with a particular initial set of properties and values. Any JavaScript function can be used as a constructor. You use the
new
operator with a constructor function to create a new object.-Note that ECMAScript 2015 introduces a class declaration:
+Note: ECMAScript 2015 introduces a class declaration:
JavaScript classes, introduced in ECMAScript 2015, are primarily syntactical sugar over JavaScript's existing prototype-based inheritance. The class syntax does not introduce a new object-oriented inheritance model to JavaScript.
@@ -592,7 +592,7 @@Determining instance relationships } -
Note: The implementation above checks the type of the object against "xml" in order to work around a quirk of how XML objects are represented in recent versions of JavaScript. See bug 634150 if you want the nitty-gritty details.+Note: The implementation above checks the type of the object against "xml" in order to work around a quirk of how XML objects are represented in recent versions of JavaScript. See bug 634150 if you want the nitty-gritty details.
Using the instanceOf function defined above, these expressions are true:
diff --git a/files/en-us/web/javascript/guide/expressions_and_operators/index.html b/files/en-us/web/javascript/guide/expressions_and_operators/index.html index 145d64589af016a..81a0950539887f9 100644 --- a/files/en-us/web/javascript/guide/expressions_and_operators/index.html +++ b/files/en-us/web/javascript/guide/expressions_and_operators/index.html @@ -349,7 +349,7 @@Comparison operators
-diff --git a/files/en-us/web/javascript/guide/functions/index.html b/files/en-us/web/javascript/guide/functions/index.html index 8a3d0ee783ad573..ba0d8a15421eaa5 100644 --- a/files/en-us/web/javascript/guide/functions/index.html +++ b/files/en-us/web/javascript/guide/functions/index.html @@ -470,7 +470,7 @@Note: (=>) is not an operator, but the notation +
Note:
=>
is not an operator, but the notation for Arrow functions.Closures
-Caution: There are a number of pitfalls to watch out for when using closures!
+Note: There are a number of pitfalls to watch out for when using closures!
If an enclosed function defines a variable with the same name as a variable in the outer scope, then there is no way to refer to the variable in the outer scope again. (The inner scope variable "overrides" the outer one, until the program exits the inner scope.)
diff --git a/files/en-us/web/javascript/guide/grammar_and_types/index.html b/files/en-us/web/javascript/guide/grammar_and_types/index.html index 086ae5dd7a910b0..c1b9d1c0b99a428 100644 --- a/files/en-us/web/javascript/guide/grammar_and_types/index.html +++ b/files/en-us/web/javascript/guide/grammar_and_types/index.html @@ -25,7 +25,7 @@Basics
A semicolon is not necessary after a statement if it is written on its own line. But if more than one statement on a line is desired, then they must be separated by semicolons.
-ECMAScript also has rules for automatic insertion of semicolons (ASI) to end statements. (For more information, see the detailed reference about JavaScript's lexical grammar.)
+Note: ECMAScript also has rules for automatic insertion of semicolons (ASI) to end statements. (For more information, see the detailed reference about JavaScript's lexical grammar.)
It is considered best practice, however, to always write a semicolon after a statement, even when it is not strictly needed. This practice reduces the chances of bugs getting into the code.
@@ -48,7 +48,7 @@Comments
Comments behave like whitespace, and are discarded during script execution.
-@@ -347,7 +347,7 @@Note: You might also see a third type of comment syntax at the start of some JavaScript files, which looks something like this:
+#!/usr/bin/env node
.Note: You might also see a third type of comment syntax at the start of some JavaScript files, which looks something like this:
#!/usr/bin/env node
.This is called hashbang comment syntax, and is a special comment used to specify the path to a particular JavaScript engine that should execute the script. See Hashbang comments for more details.
Converting strings to numbers
parseInt
only returns whole numbers, so its use is diminished for decimals.-Additionally, a best practice for
+parseInt
is to always include the radix parameter. The radix parameter is used to specify which numerical system is to be used.Note: Additionally, a best practice for
parseInt
is to always include the radix parameter. The radix parameter is used to specify which numerical system is to be used.parseInt('101', 2) // 5@@ -382,7 +382,7 @@Array literals
-Note : An array literal is a type of object initializer. See Using Object Initializers.
+Note: An array literal is a type of object initializer. See Using Object Initializers.
If an array is created using a literal in a top-level script, JavaScript interprets the array each time it evaluates the expression containing the array literal. In addition, a literal used in a function is created each time the function is called.
@@ -411,7 +411,7 @@Extra commas in array literals
In the following example, the
length
of the array is three. There is nomyList[3]
. All other commas in the list indicate a new element.-Note : Trailing commas can create errors in older browser versions and it is a best practice to remove them.
+Note: Trailing commas can create errors in older browser versions and it is a best practice to remove them.
let myList = ['home', , 'school', ]; @@ -436,7 +436,7 @@Boolean literals
The Boolean type has two literal values:
true
andfalse
.-@@ -495,7 +495,7 @@Be careful: Do not confuse the primitive Boolean values
+true
andfalse
with the true and false values of the {{jsxref("Boolean")}} object.Note: Do not confuse the primitive Boolean values
true
andfalse
with the true and false values of the {{jsxref("Boolean")}} object.The Boolean object is a wrapper around the primitive Boolean data type. See {{jsxref("Boolean")}} for more information.
Object literals
An object literal is a list of zero or more pairs of property names and associated values of an object, enclosed in curly braces (
{}
).-Do not use an object literal at the beginning of a statement! This will lead to an error (or not behave as you expect), because the
+{
will be interpreted as the beginning of a block.Note: Do not use an object literal at the beginning of a statement! This will lead to an error (or not behave as you expect), because the
{
will be interpreted as the beginning of a block.The following is an example of an object literal. The first element of the
diff --git a/files/en-us/web/javascript/guide/keyed_collections/index.html b/files/en-us/web/javascript/guide/keyed_collections/index.html index 5515c7c70c46470..56ec6fc5754d6d7 100644 --- a/files/en-us/web/javascript/guide/keyed_collections/index.html +++ b/files/en-us/web/javascript/guide/keyed_collections/index.html @@ -114,8 +114,7 @@car
object defines a property,myCar
, and assigns to it a new string, "Saturn
"; the second element, thegetCar
property, is immediately assigned the result of invoking the function(carTypes("Honda"))
; the third element, thespecial
property, uses an existing variable (sales
).Converting between Array and Set
You can create an {{jsxref("Array")}} from a Set using {{jsxref("Array.from")}} or the spread syntax. Also, the
Set
constructor accepts anArray
to convert in the other direction.-Note
-Remember that
+Set
objects store unique values—so any duplicate elements from an Array are deleted when converting!Note:
Set
objects store unique values—so any duplicate elements from an Array are deleted when converting!Array.from(mySet); diff --git a/files/en-us/web/javascript/guide/modules/index.html b/files/en-us/web/javascript/guide/modules/index.html index 00c266a5dff5401..b02537208aca6f4 100644 --- a/files/en-us/web/javascript/guide/modules/index.html +++ b/files/en-us/web/javascript/guide/modules/index.html @@ -39,7 +39,7 @@Introducing an example
These are fairly trivial, but have been kept deliberately simple to demonstrate modules clearly.
-Note: If you want to download the examples and run them locally, you'll need to run them through a local web server.
+Note: If you want to download the examples and run them locally, you'll need to run them through a local web server.
Basic example structure
@@ -53,7 +53,7 @@Basic example structure
square.js-Note: All of the examples in this guide have basically the same structure; the above should start getting pretty familiar.
+Note: All of the examples in this guide have basically the same structure; the above should start getting pretty familiar.
The modules directory's two modules are described below:
@@ -147,7 +147,7 @@Importing features into your script
You can see such lines in action in
main.js
.-Note: In some module systems, you can omit the file extension and the leading
+/
,./
, or../
(e.g.'modules/square'
). This doesn't work in native JavaScript modules.Note: In some module systems, you can omit the file extension and the leading
/
,./
, or../
(e.g.'modules/square'
). This doesn't work in native JavaScript modules.Once you've imported the features into your script, you can use them just like they were defined inside the same file. The following is found in
@@ -161,7 +161,7 @@main.js
, below the import lines:Importing features into your script
-Note: Although imported features are available in the file, they are read only views of the feature that was exported. You cannot change the variable that was imported, but you can still modify properties similar to
+const
. Additionally, these features are imported as live bindings, meaning that they can change in value even if you cannot modify the binding unlikeconst
.Note: Although imported features are available in the file, they are read only views of the feature that was exported. You cannot change the variable that was imported, but you can still modify properties similar to
const
. Additionally, these features are imported as live bindings, meaning that they can change in value even if you cannot modify the binding unlikeconst
.Applying the module to your HTML
@@ -219,7 +219,7 @@Default exports versus named expor
import {default as randomSquare} from './modules/square.js';-Note: The as syntax for renaming exported items is explained below in the Renaming imports and exports section.
+Note: The as syntax for renaming exported items is explained below in the Renaming imports and exports section.
Avoiding naming conflicts
@@ -389,7 +389,7 @@Aggregating modules
These grab the exports from the individual submodules and effectively make them available from the
shapes.js
module.-Note: The exports referenced in
+shapes.js
basically get redirected through the file and don't really exist there, so you won't be able to write any useful related code inside the same file.Note: The exports referenced in
shapes.js
basically get redirected through the file and don't really exist there, so you won't be able to write any useful related code inside the same file.So now in the
diff --git a/files/en-us/web/javascript/guide/regular_expressions/assertions/index.html b/files/en-us/web/javascript/guide/regular_expressions/assertions/index.html index 7500eec8f9f8237..287d53628916632 100644 --- a/files/en-us/web/javascript/guide/regular_expressions/assertions/index.html +++ b/files/en-us/web/javascript/guide/regular_expressions/assertions/index.html @@ -34,7 +34,7 @@main.js
file, we can get access to all three module classes by replacingBoundary-type assertions
Matches the beginning of input. If the multiline flag is set to true, also matches immediately after a line break character. For example,
/^A/
does not match the "A" in "an A", but does match the first "A" in "An A".-@@ -73,7 +73,7 @@This character has a different meaning when it appears at the start of a group.
+Note: This character has a different meaning when it appears at the start of a group.
Boundary-type assertions
Other assertions
-Note: The
+?
character may also be used as a quantifier.Note: The
?
character may also be used as a quantifier.