This content originally appeared on DEV Community and was authored by Clean Code Studio
The Lexical Structure of a software language:
"Specifies a set of basic rules defining how code should or could be written"
As one of the world's most misunderstood programming language as well as a software language with some weird oddities, there are many questions that come up about what is best practice when it comes to writing JavaScript. In this blog we're going to dive into the Lexical structure of JavaScript. Lexical Structure simply specifies a set of basic rules defining how code should be written in a given language.
Unicode
JavaScript is written in Unicode. What's this mean? Well, one of the cool, lesser used, and generally considered a poor or bad practice is that we can actually use emojis as variable names. We can use emojis as variable names because JavaScript is written in Unicode. More importantly, you can write identifiers in any language, for example, Japanese or Chinese, with some rules.
Optional Semicolon
In JavaScript (and most other languages) the semicolon is used to separate one given statement from another. What's weird about JavaScript is that this semi-colon is optional. Personally, I opt out of using the semi-colon and just write my statements on two separate lines. Any two statements that are written on the same line will always need to utilize a semi-colon to separate them - but this in itself is considered bad practice.
Whitespaces and Line Breaks
In JavaScript, white space is NOT considered as anything meaningful. Spaces and line breaks can be added as you see fit.
For example
axios.get(endpoint)
.then(response => console.log(response))
.catch(errors => console.error(errors))
can also be written as
axios
.get(endpoint)
.then(response => console.log(response))
.catch(errors => console.error(errors))
or as
axios
.get
(endpoint)
.then
(response => console.log(response))
.catch
(errors => console.error(errors))
JavaScript doesn't care about the white space. Personally, I'll go about the former statement using the following syntax.
axios.get(endpoint)
.then(response => console.log(response))
.catch(errors => console.error(errors))
In the real world, you'll definitely want to keep a well-defined style and adhere to that commonly used style. You can and in larger project should enforce this style using a linter or a styling tool like Prettier.
Case Sensitive
JavaScript is case sensitive. What's this mean for a software language? If you have two variables spelling the same word and one is capitalized while the other is not - then these are considered two different variables.
let helloWorld = 'example'
let HelloWorld = 'heyooo'
HelloWorld and helloWorld are two different variables because JS is case sensitive.
Keywords, variables, function names, and other identifiers must always be typed with a consistent capitalization of letters to be or mean the same thing.
Comments
Good old comments. In JavaScript we have two types of comments we can utilize or call upon to add notes that are functionally meaningful within our code.
Single Line Comments
// this is a single line comment
Multiple Line Comments
/*
This is a multiple line
comment that we can
use to write a lot
of stuff when
we need to.
*/
Literals and Identifiers
Literals are defined as a value that is written within the source code.
For example, a string, a number, a Boolean, an object literal, or an array literal are all literals.
10 // a number literal
true // a Boolean literal
'hey' // a string literal
[1, 2] // an array literal
{ name: 'sarah' } // an object literal
An identifier is simply a sequence of characters used to identify a variable, function, or an object. An identifier can start with a letter, dollar sign ($), underscore (_), and may also contain digits. Using unicode, a letter can be considered any allowed char - thus we can also use an emoji. Another way to understand what an identifier means is to simply ask yourself what allowed variables names can I use in this language.
Name
name
NAME
_name
$name
?
Are all allowed variable names - aka allowed identifiers within JavaScript.
Reserved Words
Most (if not every) software language has a list of reserved words. These reserved words do special things that allow the software language to work properly. In JavaScript we have a list of Reserved Words that are not allowed to be used as identifiers due to the language saving these words to implement special functionality.
Some Reserved Words in JavaScript include:
- abstract
- arguments
- boolean
- break
- byte
- case
- catch
- char
- class
- const
- continue
- debugger
- default
- delete
- do
- double
- else
- enum
- eval
- export
- float
- extends
- false
- function
- final
- goto
- if
- finally
- float
- implements
- yield
- import
- in
- instanceof
- int
- interface
- let
- package
- private
- lang
- native
- new
- null
- protected
- public
- return
- short
- static
- super
- switch
- synchronized
- this
- throw
- throws
- transient
- true
- try
- typeof
- var -void
- volatile
- while
- with
Note, that not all reserved words do something within JavaScript currently. Many of these reserved words are simply marked as unusable by the language so that future versions of JavaScript where these reserved words add behavior to JavaScript won't cause legacy applications of JavaScript programs to break or need to be changed because they used the keywords that now do something as identifiers before these keywords were able to do anything within JS.
This content originally appeared on DEV Community and was authored by Clean Code Studio
Clean Code Studio | Sciencx (2021-08-02T12:52:08+00:00) JavaScript (Lexical Structure). Retrieved from https://www.scien.cx/2021/08/02/javascript-lexical-structure/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.