JavaScript syntax: Difference between revisions

Revision as of 20:43, 7 August 2023

Revision as of 20:44, 7 August 2023

Line 13:

==Origins==

[[Brendan Eich]] summarized the ancestry of the [https://jsonlinecompiler.com/javascript/javascript-syntax/ syntax] in the first paragraph of the [https://jsonlinecompiler.com/javascript/javascript-introduction/ JavaScript 1.1] specification<ref>[http://hepunx.rl.ac.uk/~adye/jsspec11/intro.htm#1006028 JavaScript 1.1 specification]</ref><ref>{{cite web|title=Chapter 1. Basic JavaScript|url=http://speakingjs.com/es5/ch01.html|access-date=2020-09-22|website=speakingjs.com}}</ref> as follows:

{{Quote|[https://jsonlinecompiler.com/javascript/javascript-introduction/ JavaScript] borrows most of its syntax from [[Java (programming language)|Java]], but also inherits from [[Awk]] and [[Perl]], with some indirect influence from [[Self (programming language)|Self]] in its object prototype system.}}

==Basics==

===Case sensitivity===

[https://jsonlinecompiler.com/javascript/javascript-introduction/ JavaScript] is [[Case sensitivity|case sensitive]]. It is common to start the name of a [[#Constructors|constructor]] with a [[CamelCase|capitalised]] letter, and the name of a function or [https://jsonlinecompiler.com/javascript/javascript-variables/ variable] with a lower-case letter.

Example:

Line 28:

console.log(A); // throws a ReferenceError: A is not defined

</syntaxhighlight>

Try this example code on [[https://jsonlinecompiler.com/javascript-online-editor/ JavaScript online compiler & Editor]].

===Whitespace and semicolons===

Line 54 ⟶ 52:

// a = b + c(d + e).foo();

</syntaxhighlight>

Try this example code on [[https://jsonlinecompiler.com/javascript-online-editor/ JavaScript online compiler & Editor]].

with the suggestion that the preceding statement be terminated with a semicolon.

Line 68 ⟶ 64:

// (d + e).foo();

</syntaxhighlight>

Try this example code on [[https://jsonlinecompiler.com/javascript-online-editor/ JavaScript online compiler & Editor]].

Initial semicolons are also sometimes used at the start of JavaScript libraries, in case they are appended to another library that omits a trailing semicolon, as this can result in ambiguity of the initial statement.

Line 84 ⟶ 78:

// return a + b;

</syntaxhighlight>

Try this example code on [[https://jsonlinecompiler.com/javascript-online-editor/ JavaScript online compiler & Editor]].

===Comments===

{{Main|Comment (computer programming)}}

[[Comment (computer programming)|Comment]] syntax is the same as in [https://jsonlinecompiler.com/javascript/javascript-comments/ JavaScript], [https://cprogrammingonline.com/c-programming/c-comments/ C], [[C++]], [[Swift (programming language)|Swift]] and many other languages.

<syntaxhighlight lang="javascript">

Line 99 ⟶ 92:

/* Comments /* may not be nested */ Syntax error */

</syntaxhighlight>

Try out this example code on the [[https://jsonlinecompiler.com/javascript-online-editor/ JavaScript online compiler & Editor]]. Also, consider reading the [https://jsonlinecompiler.com/javascript/javascript-comments/ comments] article on JavaScript.

==Variables==

{{Main|Variable (programming)}}

[[Variable (programming)|Variable]]s in standard JavaScript have no [[Type system|type]] attached, so any value (each ''value'' has a type) can be stored in any [https://jsonlinecompiler.com/javascript/javascript-variables/ variable]. Starting with [[ECMAScript#6th Edition – ECMAScript 2015|ES6]], the 6th version of the language, [https://jsonlinecompiler.com/javascript/javascript-variables/ variables] could be declared with <code>var</code> for function scoped variables, and <code>let</code> or <code>const</code> which are for [[block scope|block level]] variables. Before ES6, variables could only be declared with a <code>var</code> statement. Values assigned to variables declared with <code>const</code> cannot be changed, but its properties can. <code>var</code> should no longer be used since <code>let</code> and <code>const</code> are supported by modern browsers.<ref>{{Cite web |date=2023-05-09 |title=Storing the information you need — Variables - Learn web development {{!}} MDN |url=https://developer.mozilla.org/en-US/docs/Learn/JavaScript/First_steps/Variables |access-date=2023-06-23 |website=developer.mozilla.org |language=en-US}}</ref> A variable's [[Identifier (computer languages)|identifier]] must start with a letter, underscore (<code>_</code>), or dollar sign (<code>$</code>), while subsequent characters can also be digits (<code>0-9</code>). JavaScript is case sensitive, so the uppercase characters "A" through "Z" are different from the lowercase characters "a" through "z".

Starting with JavaScript 1.5, [[ISO 8859-1]] or [[Unicode]] letters (or <code>\uXXXX</code> Unicode escape sequences) can be used in identifiers.<ref>{{cite web | url=https://developer.mozilla.org/en/JavaScript/Guide/Values,_Variables,_and_Literals&revision=22#Variables | title=Values, Variables, and Literals - MDC | date=16 September 2010 | publisher=Mozilla Developer Network | access-date=1 February 2020 | archive-url=https://web.archive.org/web/20110629131728/https://developer.mozilla.org/en/JavaScript/Guide/Values%2C_Variables%2C_and_Literals%26revision%3D22#Variables | archive-date=29 June 2011 | url-status=dead }}</ref> In certain JavaScript implementations, the at sign (@) can be used in an identifier, but this is contrary to the specifications and not supported in newer implementations. {{Citation needed|date=January 2021}}

Line 121 ⟶ 113:

function func() { .. } // declaration and assignment are hoisted

</syntaxhighlight>

Try out this example code on the [https://jsonlinecompiler.com/javascript-online-editor/ JavaScript Online Compiler & Editor].

Block scoping can be produced by wrapping the entire block in a function and then executing it – this is known as the [[immediately-invoked function expression]] pattern – or by declaring the variable using the <code>let</code> keyword. <!-- Two totally slightly different things, wrapping cope in a block executes the whole code in a block, while let-or-const variables can be seen in the same block. So block-scope code, where code is executed, block-scope variables, where variables can be accessed. -->

Line 163 ⟶ 154:

console.log(z); // This line will raise a ReferenceError exception, because the value of z is no longer available

</syntaxhighlight>

Try out this example code on the [https://jsonlinecompiler.com/javascript-online-editor/ JavaScript Online Compiler & Editor].

<syntaxhighlight lang="javascript">

for (let i = 0; i < 10; i++) console.log(i);

console.log(i); // throws a ReferenceError: i is not defined

</syntaxhighlight>

Try out this example code on the [https://jsonlinecompiler.com/javascript-online-editor/ JavaScript Online Compiler & Editor].

<syntaxhighlight lang="javascript">

for (const i = 0; i < 10; i++) console.log(i); // throws a TypeError: Assignment to constant variable

Line 176 ⟶ 167:

const pi; // throws a SyntaxError: Missing initializer in const declaration

</syntaxhighlight>

Try out this example code on the [https://jsonlinecompiler.com/javascript-online-editor/ JavaScript Online Compiler & Editor].

==Primitive data types==

Line 209 ⟶ 199:

console.log(undefined === null); // enforce type during check, displays false

</syntaxhighlight>

Try out this example code on the [https://jsonlinecompiler.com/javascript-online-editor/ JavaScript Online Compiler & Editor].

Note: There is no built-in language literal for undefined. Thus {{code|lang=javascript|code=(x === undefined)}} is not a foolproof way to check whether a variable is undefined, because in versions before ECMAScript 5, it is legal for someone to write {{code|lang=javascript|code=var undefined = "I'm defined now";}}. A more robust approach is to compare using {{code|lang=javascript|code=(typeof x === 'undefined')}}.

Line 220 ⟶ 209:

function isUndefined(x) { return (typeof x) === "undefined"; } // ... or that third one

</syntaxhighlight>

Try out this example code on the [https://jsonlinecompiler.com/javascript-online-editor/ JavaScript Online Compiler & Editor].

Here, calling <code>isUndefined(my_var)</code> raises a {{mono|ReferenceError}} if {{mono|my_var}} is an unknown identifier, whereas {{code|lang=javascript|code=typeof my_var === 'undefined'}} doesn't.

Line 1,829 ⟶ 1,817:

* Mozilla Developer Center Core References for JavaScript versions [https://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference 1.5], [https://web.archive.org/web/20070210000908/http://research.nihonsoft.org/javascript/CoreReferenceJS14/index.html 1.4], [https://web.archive.org/web/20070210000504/http://research.nihonsoft.org/javascript/ClientReferenceJS13/index.html 1.3] and [https://web.archive.org/web/20070210000545/http://research.nihonsoft.org/javascript/jsref/index.htm 1.2]

* [https://developer.mozilla.org/en/docs/JavaScript Mozilla JavaScript Language Documentation]

* [https://jsonlinecompiler.com/javascript-online-editor/ JavaScript Online Compiler & Editor]

{{JavaScript}}