JavaScript Introduction Lecture Notes

Overview

• Purpose: Answer four frequently asked questions about JavaScript.
  • What is JavaScript?
  • What can you do with it?
  • Where does JavaScript code run?
  • Difference between JavaScript and ECMAScript.

---

1. What is JavaScript?

• Definition: A popular programming language, widely used for web development.
• Growth: Fast-growing, used by major companies like Netflix, Walmart, and PayPal.
• Job Opportunities: Average salary in the U.S. is $72,000. Roles include:
  • Front-end Developer
  • Back-end Developer
  • Full Stack Developer

---

2. What can you do with JavaScript?

• Initially limited to interactive web pages.
• Current Capabilities:
  • Build web/mobile applications.
  • Real-time networking applications (e.g., chats, video streaming).
  • Command-line tools and games.

---

3. Where does JavaScript code run?

• Original Environment: Browsers (JavaScript engines like SpiderMonkey in Firefox and V8 in Chrome).
• Node.js: Introduced in 2009 by Ryan Dahl, allows JavaScript to run outside the browser (server-side).
  • Enables backend development.
• Runtime Environments: Browsers and Node provide execution environments for JavaScript.

---

4. Difference between JavaScript and ECMAScript

• ECMAScript: Specification that JavaScript conforms to.
• Standardization Organization: ECMA International.
• First Version Release: 1997; annual updates since 2015 (e.g., ES6).

---

Working with JavaScript

Basic Demo

• Open Chrome Developer Tools to write JavaScript code in the Console tab.
• Example Commands:
  • console.log('Hello World');
  • 2 + 2;
  • alert('Yo');

Setting Up Development Environment

• Code Editor: Visual Studio Code recommended. Download from Visual Studio Code.
• Node.js: Download from Node.js for managing packages and libraries.
• Initial Setup: Create a folder for the course code (e.g., js-basics).
• HTML Setup: Create index.html and add basic HTML boilerplate.
• Live Server: Install and use the Live Server extension in VS Code to serve applications.

---

Writing Your First JavaScript

1. Add a <script> element in the index.html file at the end of the body.
2. Best practice: Place scripts at the end to ensure the DOM is fully loaded.
3. Example JavaScript Code:

   console.log('Hello World');
   

---

Variables in JavaScript

• Definition: Used to store data temporarily in memory.
• Naming Rules:
  • Cannot use reserved keywords.
  • Must be meaningful.
  • Cannot start with a number.
  • Cannot contain spaces or hyphens.
  • Use camelCase for multi-word names.
• Declaring Variables:
  • Use let (for reassignable variables) or const (for constants).
• Example:

  let name = 'Marsh';
  const interestRate = 0.3;
  

---

Data Types in JavaScript

Primitives (Value Types):

• Types: Strings, Numbers, Booleans, Undefined, Null.
• Dynamic Nature: Variables can change types at runtime.
• Example:

  let age = 30; // Number
  age = 'thirty'; // Now a String
  

Reference Types:

• Objects, Arrays, Functions.
• Example of Object:

  let person = { name: 'Marsh', age: 30 };
  

---

Functions in JavaScript

• Definition: Set of statements that performs a task or calculates a value.
• Function Declaration:

  function greet(name) {
      console.log('Hello ' + name);
  }
  

• Parameters vs Arguments:
  • Parameters: Defined in function declaration.
  • Arguments: Values passed when calling the function.
• Return Values: Functions can return values using return keyword.

---

Conclusion

• Encouragement to enroll in the complete JavaScript course for more detailed learning.
• Course offers exercises, solutions, and a certificate of completion.