JavaScript Variables and Data Types

In this notebook, we will explore different types of variables and data types used in JavaScript. JavaScript is a dynamically typed language, which means that variables do not need to be explicitly declared with a type. The type of the variable is determined by the value assigned to it.

Types of Variables in JavaScript:

  • var: Declares a variable, optionally initializing it to a value.
  • let: Declares a block-scoped local variable, optionally initializing it to a value.
  • const: Declares a block-scoped, read-only constant.

Data Types in JavaScript:

  • Primitive Data Types:
    • String
    • Number
    • Boolean
    • Null
    • Undefined
    • Symbol
  • Non-primitive Data Types:
    • Object
    • Array
    • Function

Naming convention in JavaScript

The convention in JavaScript is different in Python on its use of camelCase for variables, functions, and mehods; verus Python usage of snake_case.

  • camelCase is used for variables, functions, and methods.
  • PascalCase is used for class names and constructor functions.
  • UPPER_SNAKE_CASE is used for constants.

Strings in JavaScript

A string in JavaScript is used to represent textual data. Strings are created by enclosing characters within quotes (single or double quotes).

Example:

In this example, we will declare a string variable and print it to the console.

%%javascript
// 1. Strings
let name = "Arhaan";
console.log("String: ", name);
element.append("String: " + name + "<br>");

<IPython.core.display.Javascript object>

Numbers in JavaScript

JavaScript has only one type of number. Numbers can be written with or without decimals. They can be integers or floating-point numbers.

Example:

In this example, we will declare a number variable and print it to the console.

%%javascript
// 2. Numbers
let age = 15;
console.log("Number: ", age);
element.append("Number: " + age + "<br>");


<IPython.core.display.Javascript object>

Booleans in JavaScript

A boolean represents one of two values: true or false. Booleans are typically used for logical operations.

Example:

In this example, we will declare a boolean variable and print it to the console.

%%javascript
// 3. Booleans
let isStudent = true;
console.log("Boolean: ", isStudent);
element.append("Boolean: " + isStudent + "<br>");


<IPython.core.display.Javascript object>

Undefined in JavaScript

A variable in JavaScript that has been declared but not assigned a value has the value undefined.

Example:

In this example, we will declare an undefined variable and print its value.

%%javascript
// 4. Undefined
let undefinedVar;
console.log("Undefined: ", undefinedVar);
element.append("Undefined: " + undefinedVar + "<br>");


<IPython.core.display.Javascript object>

Null in JavaScript

The null value represents the intentional absence of any object value. It is often used to indicate that a variable should not contain any value.

Example:

In this example, we will declare a null variable and print its value.

%%javascript
// 5. Null
let nullVar = null;
console.log("Null: ", nullVar);
element.append("Null: " + nullVar + "<br>");


<IPython.core.display.Javascript object>

Arrays and Objects in JavaScript

Arrays:

Arrays are used to store multiple values in a single variable. Each value is called an element, and arrays can store values of any type.

Objects:

Objects are collections of key-value pairs where each key (also called a property) is associated with a value. Objects are the most important data type in JavaScript. They are also called JSON Objects and are similart to Python dictionaries.

Example:

In this example, we will declare an array and an object and print them to the console.

%%javascript
// 6. Arrays (Non-primitive)
let hobbies = ["Basketball", "Coding", "Data Analytics"];
console.log("Array: ", hobbies);
element.append("Array: " + hobbies.join(", ") + "<br>");

// 7. Objects (Non-primitive)
let student = {
  name: "Arhaan Memon",
  grade: 10,
  interests: hobbies
};
console.log("Object: ", student);
element.append("Object: " + JSON.stringify(student) + "<br>");


<IPython.core.display.Javascript object>

Traversing a Dictionary (Object) in JavaScript

In JavaScript, objects can be used as dictionaries, where keys map to values. To access the values of an object, we can use either dot notation or bracket notation.

Example:

In this example, we will declare an object (dictionary) and traverse its key-value pairs.

%%javascript
// Example of a JavaScript object (dictionary)
let studentInfo = {
  name: "Arhaan Memon",
  age: 15,
  grade: 10,
  interests: ["Basketball", "Coding", "Data Analytics"]
};


// Traversing the object using a for...in loop
for (let key in studentInfo) {
  console.log(key + ": " + studentInfo[key]); // Logs each key and its associated value
  element.append(key + ": " + studentInfo[key] + "<br>");
}


<IPython.core.display.Javascript object>