Skip to main content

Javascript

What is JavaScript?​

JavaScript (JS) is a popular programming language that is integrated and embedded into HTML to make websites more vivid.

JavaScript is an interpreted programming language with object-oriented capabilities, developed by Netscape since 1995. It has a syntax developed based on the C language. JavaScript was originally created for use in browsers, which help design dynamic web pages and handle some visual effects through the DOM. This language is an essential addition that helps perform tasks that cannot be done with HTML alone.

JavaScript Framework is a library built based on JS to serve different purposes and fields. Currently, there are many popular JavaScript Frameworks such as: ReactJS, NodeJS, AngularJS, VueJS...

What role does JavaScript play?​

JavaScript is one of the three main languages in website programming and is closely related to each other to build a vibrant, professional website:

  • HTML: builds basic structure, add content to website.
  • CSS: defines designing, building layouts, creating styles, colors...
  • JavaScript: creates "dynamic" content on the website, interactive events with users.

Javascript's task is to process HTML objects in the browser. It can add/remove/edit CSS properties and HTML elements easily. In other words, Javascript is a programming language on the browser on the client-side. However, now with the appearance of NodeJS, Javascript can work in the backend. If you try accessing some websites on the internet, you will see beautiful slide effects, drop-down menus, images running back and forth... All of these functions are handled by Javascript.

How does JS works on websites​

JavaScript will often be embedded directly into a web page or referenced via a separate .js file. JavaScript is a client-side language, so the script will be downloaded to the PC client when accessing and processed there. Instead of processing on the Server-side and responding the results to the client after processing is complete.

Currently, some popular web browsers allow you to enable/disable JavaScript at your discretion. Then you can see what a website would look like without JavaScript? From there, you can more easily visualize how JavaScript works.

What can Javascript do?​

  • Change HTML content

  • Change HTML attribute values

  • Change HTML Styles (CSS)

  • Hide/show HTML elements

  • Vvalidate the input data

Advantages and disadvantages of Javascript​

Advantages​

  • Easy to learn, easy to detect errors and fix errors faster.
  • Web browsers can compile it in HTML without a compiler.
  • Support on many different platforms and browsers.
  • Faster and lighter than other programming languages.
  • JS helps make websites more interactive and increase user experience.
  • JS helps validate input data instead of checking manually.
  • JS can be attached to some elements or events of the website.

Disadvantages​

  • Easily exploited by hackers and scammers.
  • Can be used to execute malicious code on the PC's client.
  • Large JS Code Snippet.
  • Different devices may implement JS differently, leading to inconsistency.
  • Because of security, client-side JavaScript does not allow reading and writing files.
  • JS is sometimes not supported on all browsers.

Embed Javascript into the website​

We have 3 popular ways:

Internal​

Writing in the current HTML file, the script tag will usually be placed in the <head> tag, but you can also place it anywhere in the HTML file. The only requirement is that it must contain the full opening and closing <script></script> tags

<html>
  <head>
      <title>...</title>
      <script>
          alert("Hello World!");
      </script>
  </head>
  <body>
    ...
  </body>
</html>

External​

Write the Javascript code in a new file (extension .js). Then, we will use the Script tag to import this file.

test.js
alert("Hello World!"); 
<html>
  <head>
      <title>...</title>
      <script src="test.js"></script> 
  </head>
  <body>
    ...
  </body>
</html>

Inline​

Write JS code directly inside HTML tags.

<button type="button" onclick="alert('Hello World!')">Click me!</button>

Some practical applications of Javascript​

  • Website development: according to statistics from W3techs, more than 90% of websites in the world use JS.
  • Developing Website applications: JS provides frameworks used to build and develop powerful web applications such as: React Native, React, Angular, Vue...
  • Mobile applications: React Native allows building cross-platform mobile applications, where developers can use a common user interface for Android and IOS platforms.
  • Online Games: The combination of JS and HTML5 plays an important role in developing online games, for example: Gunny, CrossCode, SWORDSMAN Online…
  • Web servers and server applications: with the emergence of NodeJS, JS can help us create both web servers and build server-side applications.
  • Development of smart devices: smart watches (PebbleJS), drones, flying robots...

References​