JavaScript:Data Types,Functions,Variables,Return,Function Calling,Arguments

JavaScript is a programming language used to make websites interactive and dynamic. It runs in your web browser and can respond to actions like clicks, mouse movements, or keyboard inputs.

🔑 Basic Concepts
Feature What It Does
Dynamic Content Change text, images, or styles without reloading the page
Interactivity Respond to clicks, form input, etc.
Animations Create slideshows, fade-ins, etc.
APIs Connect to servers, maps, or games

🧠 Example

Here's a simple JavaScript code that shows an alert when a button is clicked:

Click Me!

function showMessage() { alert("Hello from JavaScript!"); }

When you click the button, a popup message appears.

🧰 Where JavaScript is Used

Websites (buttons, menus, animations)

Web apps (e.g., Gmail, Twitter)

Mobile apps (with tools like React Native)

Server-side (with Node.js)

Want to try some JavaScript yourself or get a simple project to build?
🔢 JavaScript Data Types

In JavaScript, data types define the kind of value a variable can hold. There are two main categories:

🧱 1. Primitive Data Types

These are the most basic types of data:

Data Type	Description	Example
String	Text	"Hello world"
Number	Any number (integer or decimal)	42, 3.14
Boolean	True or false	true, false
Undefined	A variable declared but not assigned	let x;
Null	Intentionally no value	let y = null;
Symbol	Unique value (used for object keys)	Symbol('id')
BigInt	Very large integers	12345678901234567890n

📦 2. Non-Primitive (Reference) Data Types

These can store collections of values or more complex structures:

Data Type	Description	Example
Object	A collection of key-value pairs	{ name: "Alice", age: 25 }
Array	Ordered list of values	[1, 2, 3, 4]
Function	Reusable block of code	function greet() { ... }

🧪 Example in Code:

javascript
let name = "John"; // String
let age = 30; // Number
let isStudent = true; // Boolean
let address; // Undefined
let salary = null; // Null
let bigNum = 9007199254740991n; // BigInt
let person = { name: "John", age: 30 }; // Object
let scores = [90, 80, 70]; // Array

🧮 JavaScript Variables

Variables in JavaScript are used to store data that you can use and manipulate later in your code.

---

📦 How to Declare Variables

JavaScript has three main keywords to declare variables:

Keyword	Use Case	Can Reassign?	Scope
var	Old way (rarely used now)	✅ Yes	Function scope
let	Modern, flexible	✅ Yes	Block scope
const	Constant (won’t change)	❌ No	Block scope

---

🔤 Example:

let name = "Alice";     // String
const age = 25;         // Number
var isStudent = true;   // Boolean

name = "Bob";           // ✅ OK
// age = 26;            ❌ Error: can't reassign a const

---

🧠 Rules for Variable Names

✅ Valid:

• firstName
• age2
• _total
• $price

❌ Invalid:

• 2name (can't start with a number)
• let (can't use reserved keywords)

---

🔄 Dynamic Typing

JavaScript variables are dynamically typed, which means the type can change:

let value = 10;     // Number
value = "ten";      // Now it's a String

🔧 JavaScript Functions

Functions in JavaScript are blocks of code designed to perform a specific task. You can define a function once and reuse it anywhere in your program.

---

🧱 Why Use Functions?

• Organize code into reusable chunks
• Improve readability
• Avoid repeating code (DRY: Don't Repeat Yourself)

---

🧠 Function Syntax

✅ 1. Function Declaration

function greet() {
  console.log("Hello!");
}

greet();  // Output: Hello!

✅ 2. Function with Parameters

function greetUser(name) {
  console.log("Hello, " + name + "!");
}

greetUser("Alice");  // Output: Hello, Alice!

✅ 3. Function that Returns a Value

function add(a, b) {
  return a + b;
}

let result = add(5, 3);  // result is 8

---

🧪 Types of Functions

Type	Description	Example
Named Function	Regular function with a name	function sayHi() {}
Anonymous Function	Function without a name	let greet = function() {}
Arrow Function	Shorter syntax introduced in ES6	let sum = (a, b) => a + b;
Callback Function	Passed as an argument to another function	setTimeout(() => alert("Hi!"), 1000);

---

🧬 Example: Arrow Function

const multiply = (x, y) => x * y;
console.log(multiply(4, 5));  // Output: 20

---

🧩 Summary

• Use function keyword or => (arrow syntax)
• Can take parameters and return values
• Can be reused multiple times

---

🔁 return in JavaScript

The **return** statement is used in functions to send a value back to where the function was called. It ends the function immediately and returns a result.

---

✅ Basic Syntax:

function add(a, b) {
  return a + b;
}
let result = add(3, 4);  // result = 7

---

⚠️ Key Points:

• return exits the function.
• Code after return will not run.
• If you don’t use return, the function returns undefined by default.

---

❌ No Return Example:

function sayHello(name) {
  console.log("Hello, " + name);
}

let result = sayHello("Alice"); // Output: Hello, Alice
console.log(result);            // Output: undefined

---

🧠 With Return Example:

function fullName(first, last) {
  return first + " " + last;
}

let name = fullName("John", "Doe");
console.log(name);  // Output: John Doe

---

✅ Why Use return?

• To get output from a function
• To use that output in calculations or decisions
• To make code modular and reusable

---

📞 Function Calling in JavaScript

Function calling means using the function you’ve defined by executing it with its name (and arguments if needed).

---

✅ How to Call a Function

Just use the function name followed by parentheses ():

function greet() {
  console.log("Hello!");
}

// Calling the function
greet();  // Output: Hello!

---

🧠 Calling a Function with Arguments

function greetUser(name) {
  console.log("Hi, " + name + "!");
}

greetUser("Alice");  // Output: Hi, Alice!
greetUser("Bob");    // Output: Hi, Bob!

---

🔁 Calling a Function that Returns a Value

function square(num) {
  return num * num;
}

let result = square(5);     // result = 25
console.log(result);        // Output: 25

---

🎯 Function Can Be Called Multiple Times

function sayHi() {
  console.log("Hi there!");
}

sayHi();
sayHi();
sayHi();
// Output (3 times): Hi there!

---

🔄 Summary

Term	Example
Define function	function greet() {}
Call function	greet();
With arguments	add(5, 3);
Store return value	let sum = add(5, 3);

---

🧾 Arguments in JavaScript

In JavaScript, arguments are the values you pass to a function when you call it. These values get assigned to the function’s parameters.

---

✅ Example: Passing Arguments

function greet(name) {
  console.log("Hello, " + name + "!");
}

greet("Alice");  // Output: Hello, Alice!
greet("Bob");    // Output: Hello, Bob!

Here:

• name is the parameter (in the function definition).
• "Alice" and "Bob" are arguments (in the function call).

---

🔢 Multiple Arguments

function add(a, b) {
  return a + b;
}

console.log(add(2, 3)); // Output: 5
console.log(add(10, 7)); // Output: 17

---

📦 Default Parameters

You can give default values to parameters:

function greet(name = "Guest") {
  console.log("Hello, " + name);
}

greet();         // Output: Hello, Guest
greet("Anna");   // Output: Hello, Anna

---

🧰 The arguments Object (Advanced)

Inside a function, you can access all passed arguments using the arguments object (even if not listed as parameters):

function showAll() {
  for (let i = 0; i < arguments.length; i++) {
    console.log(arguments[i]);
  }
}

showAll("apple", "banana", "cherry");
// Output:
// apple
// banana
// cherry

Note: arguments works in regular functions, not in arrow functions.

---

🧠 Summary

Term	Meaning
Parameter	Placeholder name in function definition
Argument	Actual value passed when calling a function
Default	A preset value used if no argument is passed
arguments	Special object for all passed values

---