JavaScript
is one of the essential programming languages for web development. Its appeal is that it is easy to learn even for beginners, and it can be used with
HTML
and
CSS
to make web pages dynamic.
This article provides an easy-to-understand explanation of the basic concepts and mechanisms of JavaScript. If you are interested in learning JavaScript, please refer to this article and use it to help you learn JavaScript.
What is JavaScript?
JavaScript is a scripting language that runs on web browsers and is a programming language used to create dynamic web pages. You can control web browser functionality to achieve dynamic operations and animations, user interaction, data validation and processing, and more.
Recently, a library called Node.js for executing JavaScript on the server side has also appeared, and it is being used not only for web development but also for
server
-side development.
History of JavaScript
JavaScript was developed in 1995 by Brendan Eich at Netscape Communications Corporation.
It was originally designed as a scripting language to run in the browser and was included in Netscape Navigator 2.0. It was originally called “LiveScript” but was later renamed to “JavaScript”.
First released to the public in 1996 with Netscape Navigator 3.0, Microsoft later developed JScript to provide similar functionality and adopted it in Internet Explorer 3.0. It quickly gained popularity as it was found to be useful for enabling dynamic content and interactive features on the web.
In 2002, a new version called ECMAScript 4 was announced, and in 2005, ECMAScript 3 was released. As of March 2023, ECMAScript 2022 is the latest version and is the basis of the JavaScript standard specification. (Reference: ECMA INTERNATIONAL
))
JavaScript plays a very important role in web development and has become one of the main programming languages for creating dynamic web pages and web applications.
What is the difference between JavaScript and Java?
Although JavaScript and Java have similar names, people tend to think they are the same programming language, but they are completely different programming languages. So what’s the difference?
JavaScript is a scripting language that runs on web browsers and is used in combination with HTML and CSS to create dynamic behavior on web pages. It is a scripting language with a syntax similar to the grammar and structure of the C language, and supports a variety of programming styles such as object-oriented and functional programming.
Java, on the other hand, is an object-oriented, general-purpose programming language that is used in a wide range of fields, including desktop applications, web applications, and mobile applications. Java is a language derived from C++ and focuses on program safety, reliability, and portability.
Characteristics of JavaScript
Next, let’s take a look at the characteristics of the programming language JavaScript.
JavaScript has the following main characteristics:
I will explain each in turn.
case sensitive
JavaScript is case sensitive. Therefore, identifiers such as variable names, function names, and object property names must be case-sensitive.
For example, the following variable names are all treated as different variables.
var ThisVariable = “apple”;
var thisvariable = “mandarin”;
var THISVARIABLE = “banana”;
Similarly, all of the following function names are treated as different functions.
function thisFunction() {
//…
}
function ThisFunction() {
//…
}
function THISFUNCTION() {
//…
}
However, all JavaScript keywords (reserved words) must be written in lowercase letters (we will discuss “reserved words” later). Keywords have special meaning in JavaScript syntax, so writing them in uppercase can cause errors.
For example, the following code will result in an error.
var Function = 10; // “Function” is a keyword, so it cannot be used as a variable name
In general, when writing JavaScript code, it is important to consistently use the same case for identifiers. This improves code readability and avoids misleading errors.
Separate with a semicolon
A semicolon (;) is used in JavaScript to mark the end of a statement. In other words, you must always add a semicolon at the end of a sentence.
However, there are some JavaScript cases in which the semicolon itself can be omitted. Specifically, in the following cases:
- When a line break marks the end of a sentence
In JavaScript, you can mark the end of a sentence with a line break. In other words, even if you do not add a semicolon at the end of a sentence, it will be determined that the sentence ends with a line break. The following is an example where the semicolon is not required.
var x = 10
var y = 20
- If the statement is inside a block ({})
Statements within a block end with a closing parenthesis (}), which is the end of the block, so there is no need to add a semicolon.
The following is an example where the semicolon is not required.
if (x === 10) {
console.log(“x is 10”)
}
However, omitting the semicolon can cause your code to behave unexpectedly, so it is generally recommended to include it. Also, if you write multiple statements on one line, you need to add a semicolon at the end of each statement.
var x = 10; var y = 20;
Whether or not to omit the semicolon depends on the developer’s preference and the coding style of the development project team, but it is recommended that you explicitly include the semicolon, as computer interpretation may be ambiguous.
Reserved word exists
JavaScript has words called “reserved words” that have special meanings within the language itself. These words can no longer be used as identifiers, such as variable names or function names.
JavaScript reserved words include the following:
There are many other reserved words, so be careful when declaring variables or creating functions.
strict mode (execution mode) exists
JavaScript has a feature called “strict mode” that allows JavaScript code to be interpreted more strictly. Strict mode is enabled by writing “use strict”; at the beginning of the code.
By using strict mode, the following restrictions are implemented.
Strict mode is a useful feature that makes your code more maintainable, fewer bugs, and more secure. However, it should be used with caution as it may break compatibility with older code.
Basic grammar of JavaScript
Explains the basic syntax of JavaScript. It includes basic concepts such as variable declaration, data types, operators, control structures, and functions.
Declaration of variables
JavaScript uses the var, let, and const keywords to declare variables.
- var: Declare a function scope variable.
- let: Declare a block-scoped variable.
- const: Declare a block-scope constant (non-reassignable).
|
var x = 100; let y = 200; const z = 300; |
data type
The basic data types in JavaScript include:
- Number
- String
- Boolean
- Array
- Object
- Undefined
- Null
|
let number = 42; // number let string = “Hello, World!”; // string let boolean = true; // Boolean let array = [1, 2, 3]; // array let object = { name: “John”, age: 30 }; // object let undefinedValue; // undefined let nullValue = null; // null |
operator
JavaScript has various operators.
arithmetic operators
- +: addition
- -: Subtraction
- *: Multiplication
- /:division
- %: remainder
|
let c = 10; c += 5; // c = c + 5 console.log(c); // 15 c -= 2; // c = c – 2 console.log(c); // 13 |
control structure
Use if statement to execute code based on a condition.
|
let f = 10; if (f > 5) { console.log(“f is greater than 5”); } else if (f === 5) { console.log(“f equals 5”); } else { console.log(“f is less than 5”); } |
function
A function in JavaScript is a block of code that performs a specific task.
|
function greet(name) { return “Hello, ” + name; } console.log(greet(“Alice”)); // “Hello, Alice” |
function expression
|
let greet = function(name) { return “Hello, ” + name; }; console.log(greet(“Bob”)); // “Hello, Bob” |
arrow function
|
let greet = (name) => { return “Hello, ” + name; }; console.log(greet(“Charlie”)); // “Hello, Charlie” |
What you can do with JavaScript
By using JavaScript, you can perform various web-related processes.
The main things you can do with JavaScript are as follows.
I will explain each in turn.
Activate on the server side
Typical programming languages for running things on the server side are PHP and Ruby, but JavaScript can also be run on the server side by using a library called Node.js.
Not only can you connect to a database and retrieve, update, and delete data, but you can also create real-time applications such as chat and live streaming.
If the same programming language (JavaScript) could be used on the client and server sides, developers would no longer need to acquire JavaScript knowledge, improving development efficiency.
Add movement to the website (instructions to HTML and CSS)
It is also possible to use JavaScript to give instructions to HTML and CSS to add movement to your website.
For example, by retrieving and manipulating HTML elements, you can hide certain elements, change text, and verify form input content. You can also change the CSS styles, allowing you to change the background color and font size of specific elements.
This allows you to create dynamic websites by changing the display according to user actions.
Asynchronous communication possible
JavaScript uses a technology called “Ajax (Asynchronous JavaScript and XML)” to communicate with the server asynchronously without reloading part of the web page.
For example, you can send data that a user enters into a form to a server for checking and displaying error messages without reloading the entire page.
By using Ajax, you can improve the responsiveness and usability of your web pages.
Can develop web application services
By using JavaScript, you can develop various applications.
For example, Google’s webmail service “Gmail” is known for being developed with extensive use of JavaScript. You can read, write, and delete emails without reloading the page.
Also, Twitter, a famous social media site, uses JavaScript so that new tweets can be loaded without reloading the page. Forms for posting tweets are also implemented using JavaScript.
JavaScript specifications are updated every year.
JavaScript is a programming language whose specifications are updated every year, and is developed based on the specifications set by a standards organization called ECMAScript. A new version of ECMAScript is released every year, and each time the JavaScript specification is updated and new functions and features become available.
However, even if it becomes possible to take advantage of new features, not all browsers are compatible with the latest specifications, so appropriate processing must be done for each browser, and even older browsers can use new features. You need to be able to do it.
summary
In this article, we explained the basic concepts and mechanisms of JavaScript in an easy-to-understand manner. JavaScript is a programming language that plays an important role in web development.
It has the advantage of not requiring a special development environment and is easy to learn even for beginners, and can make web pages more dynamic by combining it with HTML and CSS. In addition, it is a programming language that is becoming more and more capable of doing things every year, such as adding movement to the server side, asynchronous communication, and web application development.
If you want to learn a programming language, be sure to understand the basic concepts of JavaScript.