Javascript 101: Introduction To Modern Javacript

Javascript is client side scripting language in web development to make websites more interactive to their users. It is an interpreted language unlike other progamming languages.

A Brief Javascript History

JavaScript was created at Netscape Communications by Brendan Eich in 1995.Initially known as LiveScript, Netscape changed the name to JavaScript so they could position it as a companion for the Java language.
JavaScript is in no way related to the Java programming language. .

Requirements to get you started

A computer
A web browser
A text editor of your choice(I prefer using VSCode).
Good internet.
Motive.

Javascript syntax

The syntax of JavaScript is the set of rules that define a correctly structured JavaScript program.

<script ...>
   JavaScript code
</script>

The script tag takes two important attributes:

language - specifies what scripting language you are using.
type - indicate the scripting language in use and its value should be set to "text/javascript".

<script language = "javascript" type = "text/javascript">
   JavaScript code
</script>

** Your first javascript code**

<html>
   <body>   
      <script language = "javascript" type = "text/javascript">
         <!--
            document.write("Hello World!")
         //-->
      </script>      
   </body>
</html>

Javascript is a free format language , that is , it ignores space, tabs and line breaks.

semicolons in Javascript are optional. It is though a good practice to use them in your code.

<script language = "javascript" type = "text/javascript">
   <!--
//codes lines without semicolons
      var1 = 10
      var2 = 20
// codes lines with semicolons
      var3 = 15; var4 = 25;
   //-->
</script>

Comments in JS
Comments are crucial in any programming language.They make code more readable and leave remarks in our code.

Single line Comments

// This is the first comment
// This is the second comment
// I am a single line comment

Multiline comments

/* This is a multiline comment
Multiline comments can take multiple lines
JavaScript is the language of the web
*/

Javascript Placement

There is a flexibility given to include JavaScript code anywhere in an HTML
document. However the most preferred ways to include JavaScript in an HTML
file are as follows:

Script in ... section.
Script in ... section.
Script in ... and ... sections.
Script in an external file and then include in ... section. The first three are written between the script tags.

<script language = "javascript" type = "text/javascript">
   JavaScript code
</script>

Script in an external file and then include in

... section.

<html>
<head>
<script type="text/javascript" src="filename.js" ></script>
</head>
<body>
.......
</body>
</html>

Variables in Js

Variable declaration
We can declare variables using three methods.

var age = 20;
    // var values can change

let name = 'Joshua';
    // same as var
const gravity = 10;
   //used to declare constant values e.g gravity as in above

NB It is a good practice to use let rather than var in variable declarations as it is more secure method.
Variables are containers of data..
In JS variable there are diffrent kinds of data types:

Numbers
integers(whole numbers)
Var num1 = 10;

float-point number(numbers with fractions)
var num2 = 15.69;
Strings
A collections of more than one characters between two single quotes, double quotes, or backticks.
var sayHi = "Hello, World";
Booleans
A boolean value is either True or False while boolean data types are either true or false. They return a true or false value.
true // if the light is on, the value is true false // if the light is off, the value is false
Undefined
In JavaScript, if we don't assign a value to a variable, the value is undefined. In addition to that, if a function is not returning anything, it returns undefined.

<html>
<head>
<script>
var firstName;
document.write(firstName) // undefined, because it is not assigned to a value yet
</script>
</head>
<body>
.......
</body>
</html>

Null Null in JavaScript means an empty value. var emptyValue = null;

Variable naming rules
In Javascript we have rules that are used when naming variables. Most of the rules apply in other programming languages.
A valid JavaScript variable name must follow the following rules:

A JavaScript variable name should not begin with a number.
A JavaScript variable name does not allow special characters except dollar sign and underscore.
A JavaScript variable name follows a camelCase convention.
A JavaScript variable name should not have space between words.

The following are examples of valid JavaScript variables.

firstName
lastName
country
city
capitalCity
age
isMarried

first_name
last_name
is_married
capital_city

num1
num_1
_num_1
$num1
year2020
year_2020

Example of invalid Variable names

  first-name
  1_num
  num_#_1

Conclusion
Javascript is an awesome scripting language that can be used in almost all fields in technology especially in web development.It is easy to learn and user-friendly. Happy coding!
Please drop a comment if you liked this blog or if there is anything you need clarification about. Thank you.

Blog

Javascript 101: Introduction To Modern Javacript

Joseph Kilatya

Javascript syntax

Javascript Placement

Variables in Js

Join Our Newsletter. No Spam, Only the good stuff.

Related