Lesson 9: Introduction to JavaScript

avatar
Created by
lazy baby

Cards (29)

  • HTML - is the structure of your web page – the headers, the body text, any images you want to include.
  • CSS - controls how that page looks like customizing the fonts, background colors, etc.
  • JavaScript - adds behavior to web pages, allowing for dynamic updates and user interaction.
  • JavaScript - is a scripting language for creating dynamic web page content. It creates elements for improving website’s interaction with web pages, such as dropdown menus, animated graphics, and dynamic background colors.
  • The HTML script tag is used to embed data or executable client side scripting language in an HTML page.
  • Mostly, JavaScript or JavaScript based API code inside a <script></script> tag.
  • JavaScript code can be written inside HTML Script Tags or in a separate file with .js extension.
  • A <script> tag can also be used to include an external script file to an HTML web page by using the src attribute.
  • An HTML page can contain multiple <script> tags in the <head> or <body> tag.
  • Variables
    • In JavaScript, it is declared with or without the var keyword.
  • Character Set
    • JavaScript uses the unicode character set, so allows almost all characters, punctuations, and symbols.
  • Case Sensitive
    • JavaScript is a case-sensitive scripting language. So, name of functions, variables and keywords are case sensitive.
    • For example, myfunction and MyFunction are different, Name is not equal to nAme, etc.
  • In JavaScript, var, let, and const are all used for variable declarations, but they have some key differences in terms of scope and mutability.
  • var
    • Variables declared with this are function-scoped or globally-scoped. They are not block-scoped like let and const.
    • Declarations are hoisted to the top of their containing function or global scope.
    • Can be re-declared and updated within their scope.
  • let
    • Variables declared with this are block-scoped. They only exist within the block they are defined in, such as within loops or conditionals.
    • Are not hoisted to the top of their block.
    • Can be reassigned, but not re-declared within the same scope.
  • const
    • Variables declared with this are also block-scoped.
    • Must be initialized with a value and cannot be reassigned.
    • It does not mean the value is immutable. If the value is an object or array, its properties or elements can still be modified.
  • When to use var, let, and const:
    • Use var when you need to declare a variable with function scope or global scope, but be cautious because of hoisting.
    • Use let when you need block scope, especially within loops or conditionals, and when you expect the variable's value to change.
    • Use const when you want to declare a variable that won't be re assigned, providing you with some level of immutability. Use it especially for constants, or for values that you don't expect to change.
  • Semicolon
    • JavaScript statements are separated by a semicolon. However, it is not mandatory to end a statement with a semicolon, but it is recommended.
  • Whitespaces
    • JavaScript ignores multiple spaces and tabs. The following statements are the same.
  • Code Comments
    • A comment is single or multiple lines, which give some information about the current program. Comments are not for execution.
    • Write comment after double slashes // or write multiple lines of comments between /* and */.
  • String
    • A string is a text in JavaScript. The text content must be enclosed in double or single quotation marks.
  • Number
    • JavaScript allows you to work with any type of number like integer, float, hexadecimal, etc.
    • Number must NOT be wrapped in quotation marks.
  • Boolean
    • As in other languages, JavaScript also includes true and false as a Boolean value.
  • Keywords
    • Keywords are reserved words in JavaScript, which cannot be used as variable names or function names.
  • Objects
    • JavaScript objects are fundamental data structures used to store collections of key-value pairs.
    • Objects are variables too. But objects can contain many values.
  • Objects - containers or boxes where you can store different kinds of items. Each box has a label (key) and something inside it (value).
  • Arrays
    • JavaScript arrays are ordered collections of data that can hold multiple values.
    • Unlike variables, which can hold only one value at a time, arrays allow you to store multiple values in a single variable.
    • These values can be of any data type, including numbers, strings, booleans, objects, or even other arrays.
  • Function - Return
    • A JavaScript function is a block of code designed to perform a particular task.
    • A JavaScript function is executed when "something" invokes it (calls it).
    • A function is a block of reusable code that performs a specific task or calculates a value.
  • Function - Greet
    • Greet is the name of the function, and name is a parameter (or input) that the function expects.
    • Inside the function, we use console.log to print a greeting message to the console.
    • When we call the function greet("John"), the value "John" is passed as an argument to the function, and the message "Hello, John!" is printed.