Skip to main content

Command Palette

Search for a command to run...

GETTING STARTED WITH JAVASCRIPT

Updated
•7 min read•View as Markdown
GETTING STARTED  WITH JAVASCRIPT

JavaScript is one of the most powerful and flexible programming language, which is quite popular as well. It is responsible for the dynamism of most websites, it enables user interaction in a web page. JavaScript basically dictates the behaviour of the web. JavaScript is also being used widely in game development and Mobile application development, which means it is not only useful on web pages, making it one of the most versatile programming language. JavaScript complements HTML- hypertext markup language(responsible for structure) and CSS- cascading style sheet(responsible for the beautification) on web pages.

A text editor to write your code and a browser to display your web pages is all that is needed to get started with JavaScript. Text editor varies from Visual Studio Code, Sublime Text, Atom, Notepad++, e.t.c, you can choose the one you are most comfortable working with. Web browsers also varies from Google Chrome, Firefox, Internet Explorer, e.t.c.

There are two major ways in which you can write your JavaScript code;

  • Writing your code within the html document, this is done by placing your code within the <script> tags (<script> </script>
          <script>
          alert ("Hello, World!");
          </script>
  • Creating a new file for your JavaScript code, all you have to do is link the file to your html document, which can either be at the head tag or the body tag (best position), so your browser can access it.
       <script src="whatever you save your file with goes here">
       </script>

For example,

      <script src="main.js">
      </script>

JavaScript Variable

Variables acts as containers to hold data values, the var keyword is used to declare a variable;

    var name;

you can assign any value to the variable

var name = "Kenny"; // name is the variable, while Kenny is the value assigned to name

JavaScript Syntax

JavaScript syntax is the set of rules that guides JavaScript programs on how they are constructed. Expression is the combination of values, variables, and operators, which computes to a value.

// how to declare variables
         var x, y, z  

// how to assign variables
         x = 5; y = 7; 

// how to compute variables
         z = x + y;        

JavaScript Operators

Below are some examples of JavaScript Operators;

  Addition   (+)
  Subtraction  (-)
  Multiplication  (*)
  Exponential   (**)
  Division   (/)
  Modulus (division remainder)  (%)
  Increment   (++)
  Decrement    (--)
  Greater than  (>)
  Less than    (<)
  Greater than or equal to  (>=)
  Less than or equal to   (<=)

JavaScript Datatypes

JavaScript variables can hold many datatypes, which varies from number, strings, objects, boolean, e.t.c.

     // Number
     var width = 16;

     // String
    var name = "Grace"; 

     // Object              
     var y = {firstName:"Kenneth", age:20};  

     //Undefined
     var x;                                            

Booleans can only have two values, either true or false, and are often used in conditional statements.

       var t = 2;
       var u = 3;
       (t == u)  // returns false

JavaScript Comment

Comments are statements that are ignored by JavaScript interpreter(will not be executed). They are used to explain code, and makes it more readable. There are two ways to write comments in your code:

  • Single line comment //

Any text at the end of // will not be executed

// my first Javascript code
 var a = 2;   // 2 is assigned to var a
  • Multi-Line comment, starts with /* and ends with */

    Any text between /* and */will not be executed

          /* this is a multi-line
           comment, it will not
            be executed */
             var a = 2;
    

JavaScript Array

JavaScript arrays are used to store multiple data values in a single variable, they are simply collections of items

var x = [2, 4, 6, 8, 10];

var names = ["Joseph", "Jude", "James", "John"];

You can access an item in an array by referring to it's index number and the index of the first item is zero(0), that is

array indexes starts from 0

var fruits = ["Apple", "Mango", "Banana", "Orange", "Pineapple"];

   /*  index Apple is 0, 
     Mango is 1, 
     Banana is 2, 
     Orange is 3,,, e.t.c  */

JavaScript Function

A block of code that is designed to perform a particular task, which is executed when "something" invokes it (calls it) is called a Function.

   function myFunction(x, y) {
        return x + y
         }

Function is defined with the function keyword, following by a name, and the by parenthesis( ). ( ) operator invokes the function.

These are just the basic fundamentals in JavaScript, but are not limited to these. There are many resources (both free and paid) online, some are beginner-friendly while some are advanced. Find out the ones that works best for you and go for it.

The best way to learn/master JavaScript or any other programming language is to actually build projects. After learning the basics, put what you've learnt into practice. Be mindful of the projects you want to build tho, start with simple projects that are not too difficult. Start small and keep advancing to more difficult tasks, the more you practice the more easy it becomes.

Taking up/ building these projects will sharpen your skills and help you get a hold on JavaScript. There are many beginner-friendly projects that can help.

Further Reading;
80 views
E

An amazing introduction Ige Kehinde. Thanks for sharing.

1
I

Thanks

1