Introduction to JavaScript Part I

Choose a study mode

Play Quiz
Study Flashcards
Spaced Repetition
Chat to Lesson

Podcast

Play an AI-generated podcast conversation about this lesson

Questions and Answers

What are the two ways to add JavaScript to Web pages?

  • Include the script in an external file with the `<script>` tag (correct)
  • Use the `<script>` tag (correct)
  • Use the `<javascript>` tag
  • Use the `<java>` tag

What is the purpose of the type attribute within the <script> tag?

text/javascript

What is the common method to write text to HTML output?

document.write()

The document.write() method should be used for production code.

<p>False (B)</p> Signup and view all the answers

What is the type of JavaScript that is interpreted on the fly?

<p>True (A)</p> Signup and view all the answers

JavaScript can be incorporated from an external file?

<p>True (A)</p> Signup and view all the answers

What does the window.alert() function do?

<p>Writes text into a pop-up window (B)</p> Signup and view all the answers

Is the console.log() function used to display data in debug mode in the browser?

<p>True (A)</p> Signup and view all the answers

Which of these keywords is used to declare a variable?

<p>All of the above (D)</p> Signup and view all the answers

What does the let keyword represent?

<p>A block-scoped variable declaration.</p> Signup and view all the answers

Javascript is case-sensitive?

<p>True (A)</p> Signup and view all the answers

What does each line end with in JavaScript code?

<p>A semicolon (A)</p> Signup and view all the answers

Is it possible to have multiple statements on a single line in Javascript?

<p>True (A)</p> Signup and view all the answers

What is the purpose of a block in JavaScript?

<p>To group statements together and define their scope.</p> Signup and view all the answers

Match the following JavaScript keywords/concepts with their descriptions:

<p><code>var</code> = Declares a variable that can be redeclared <code>let</code> = Declares a block-scoped variable. Cannot be redeclared <code>const</code> = Declares a block-scoped constant. Value cannot be changed after declaration <code>if</code> = Executes a block of code if a condition is true <code>switch</code> = Executes a code block based on different cases <code>for</code> = Iterates a block of code multiple times <code>function</code> = Defines a reusable block of code <code>return</code> = Exits a function and potentially returns a value <code>try</code> = Handles errors in a block of code <code>catch</code> = Captures errors thrown by the <code>try</code> block <code>finally</code> = Executes a block of code whether an error occurred or not</p> Signup and view all the answers

Variables declared using let cannot be redeclared.

<p>True (A)</p> Signup and view all the answers

Variables declared using let can be used outside of the block they were declared in.

<p>False (B)</p> Signup and view all the answers

What is the purpose of the const keyword in Javascript?

<p>To declare a constant variable. Its value cannot be changed after the declaration.</p> Signup and view all the answers

Match the JavaScript Operators with their description:

<p><code>+</code> = Addition <code>-</code> = Subtraction <code>*</code> = Multiplication <code>**</code> = Exponentiation (raise to the power of) <code>/</code> = Division <code>%</code> = Modulo (remainder of a division) <code>++</code> = Increment (add 1 to the variable) <code>--</code> = Decrement (subtract 1 from the variable)</p> Signup and view all the answers

What is the purpose of the =operator?

<p>Assignment</p> Signup and view all the answers

Match the JavaScript assignment operators with their equivalent expressions:

<p><code>+=</code> = x = x + y <code>-=</code> = x = x - y <code>*=</code> = x = x * y <code>/=</code> = x = x / y <code>%=</code> = x = x % y <code>**=</code> = x = x** y</p> Signup and view all the answers

What is the difference between the == operator and the === operator?

<p>The <code>==</code> operator checks for equality without considering the data type, while the <code>===</code> operator checks for both equality and data type.</p> Signup and view all the answers

JavaScript can only work with numbers?

<p>False (B)</p> Signup and view all the answers

Can you redeclare a variable declared using var?

<p>True (A)</p> Signup and view all the answers

What is the output of the following JavaScript code: let x = "5" + 2 + 3; console.log(x);

<p>&quot;523&quot;</p> Signup and view all the answers

What is the output of the following JavaScript code: let x = 2 + 3 + "5"; console.log(x);

<p>&quot;55&quot;</p> Signup and view all the answers

The output of a Javascript script will always appear in the HTML output?

<p>False (B)</p> Signup and view all the answers

Signup and view all the answers

Flashcards

What is JavaScript?

A client-side scripting language that runs in the user's browser, making web pages interactive.

JavaScript's origins

JavaScript was developed at Netscape in just ten days and was initially called LiveScript.

JavaScript is interpreted on-the-fly

JavaScript code is processed line by line as it's loaded into the browser, unlike server-side languages that run on the server.

JavaScript is client-side

JavaScript runs in the user's web browser, making it a client-side language, unlike server-side languages that run on the server.

Signup and view all the flashcards

Why use JavaScript?

A programming language used to create interactive and engaging web pages.

Signup and view all the flashcards

JavaScript is not Java

JavaScript is a scripting language that can be used to create interactive web pages, whereas Java is a general-purpose programming language used to develop various software applications.

Signup and view all the flashcards

Writing JavaScript code in HTML

Adding JavaScript code to a web page using the <script> tag.

Signup and view all the flashcards

Hello World JavaScript example

A simple JavaScript script that displays the text 'Hello, world!' in the web browser.

Signup and view all the flashcards

Comments in JavaScript

Using comments in JavaScript to explain code or temporarily disable portions of it.

Signup and view all the flashcards

Single-line comments in JavaScript

A single-line comment in JavaScript starts with two forward slashes (//) and extends until the end of the line.

Signup and view all the flashcards

Multiline comments in JavaScript

A multiline comment in JavaScript starts with /* and ends with */.

Signup and view all the flashcards

JavaScript Functions

JavaScript code that is executed when the corresponding HTML element is loaded. For example, when a button is clicked.

Signup and view all the flashcards

Writing into an HTML element

To change the content of an HTML element, JavaScript uses the innerHTML. For example, document.getElementById('p1').innerHTML = 'New Text!';.

Signup and view all the flashcards

Writing into the HTML output

JavaScript can be used to write directly into the HTML document using the document.write() function.

Signup and view all the flashcards

Writing into an alert box

JavaScript's window.alert() function is used to display a pop-up message, or alert, to the user.

Signup and view all the flashcards

Writing into the browser console

Used for displaying data and messages in the browser's console, which is a tool for debugging JavaScript code.

Signup and view all the flashcards

innerHTML Property

The innerHTML property allows JavaScript to set the HTML content of an element.

Signup and view all the flashcards

Using document.write()

The document.write() method is used to output text directly into the HTML document.

Signup and view all the flashcards

Important Notes About document.write()

The document.write() method should be avoided as it can delete the existing HTML content in the document.

Signup and view all the flashcards

JavaScript Statements

A series of instructions in a JavaScript program.

Signup and view all the flashcards

Multiple statements on one line

Multiple JavaScript statements on a single line can be separated by semicolons.

Signup and view all the flashcards

JavaScript ignores multiple spaces

JavaScript ignores extra spaces or tabs in your code.

Signup and view all the flashcards

Javascript Code Blocks

JavaScript code blocks are enclosed in curly braces {} and are used to group statements that are executed together.

Signup and view all the flashcards

Declaring JS Variables (var, let, const)

JavaScript variables can be declared using the var, let, or const keywords, with let and const being preferred for their block scoping features.

Signup and view all the flashcards

Declaring variables with let

JavaScript variables declared with let must be declared before they can be used.

Signup and view all the flashcards

Let - Block Scope

JavaScript variables declared with let have block scope, meaning their visibility is limited to the block of code where they are declared.

Signup and view all the flashcards

Javascript Operators

Mathematical operators used in JavaScript to perform calculations.

Signup and view all the flashcards

JavaScript Assignment Operators

Assignment operators are used to assign values to variables in JavaScript.

Signup and view all the flashcards

Study Notes

Introduction to JavaScript - Part I

  • JavaScript is a client-side scripting language.
  • It was developed in just 10 days in May 1995 by Netscape.
  • It was initially called LiveWire and then LiveScript.
  • It runs within the client software (the browser).
  • JavaScript is interpreted on the fly by the client, meaning each line is processed as soon as it's loaded into the browser.
  • Server-side languages, like PHP and Python, run on the web server.
  • JavaScript is significantly easier to learn compared to other programming languages.
  • It's a convenient way to create interactive web pages.

Topics

  • What is JavaScript?
  • Why JavaScript?
  • Including JavaScript in HTML (two methods):
    • Using the <script>...</script> tag directly within the HTML.
    • Using an external JavaScript file (with <script src="filename.js"></script>).
  • Hello World Example Script: Shows basic JavaScript code to display text on a web page.
  • JavaScript Comments (two types):
    • Single-line comments use //.
    • Multi-line comments use /* ... */.

Including JavaScript in HTML

  • Scripts can be placed in the <body>, or in the <head> section of an HTML page, or in both sections.

Hello World Example Script

  • The code document.write("<h1>Hello, world!</h1>"); displays "Hello, world!" in an h1 heading on the web page.

JavaScript Comments

  • Single-line comments start with //.
  • Multi-line comments start with /* and end with */.

JavaScript Functions

  • JavaScript functions perform specific tasks.
  • A function is a block of code that is designed to perform a particular task.
  • To create a function, use the function keyword.
  • Functions can be called by other parts of a program.
  • A function can have one or many parameters.
  • The document.getElementById("p1").innerHTML ="New Text !"; command displays the text "New Text" in a HTML element with the ID "p1".

Outputs in JavaScript

  • document.write(): Writes to the HTML page content, but be warned this can overwrite existing content.
  • window.alert(): Displays an alert box.
  • console.log(): Displays output in the browser's developer console (useful for debugging).

innerHTML Property

  • The innerHTML property is used to update the content of an HTML element.
  • This is done using JavaScript, without affecting the structure of the page.

Using document.write()

  • The document.write() method writes a string of text to a web page.
  • It should only be used when needed for testing.
  • Using document.write() after the content is loaded, will delete all existing content.

window.alert()

  • The window.alert() method displays an alert dialog box with the specified text on the screen.

console.log()

  • The console.log() method displays the specified data in the browser's developer tools' console.

window.print()

  • The window.print() method prints the current web page.

JavaScript Statements

  • A JavaScript program consists of a series of statements.
  • Statements are commands or instructions that tell the interpreter what to do.
  • A statement ends in a semicolon.

JavaScript Syntax

  • JavaScript syntax defines the structure and rules for JavaScript code.
  • A statement often includes variables.
  • Variables are temporary named storage locations to hold data, variables are defined using keywords like let or var.

Defining JS Variables

  • Javascript variables are declared with var, let, or const.
  • The var keyword was used historically.
  • let and const are newer, introduce block scope, and can not be redeclared.
  • JavaScript identifiers (variable names) are case-sensitive.
  • Several data types exist (strings, numbers, etc.) in JavaScript.

Let - Block Scope

  • Variables declared with let have block scope - they are only accessible within the block of code they are declared in.

JavaScript Operators

  • Arithmetic Operators: +, -, *, /, %, **
  • Assignment Operators: =, +=, -=, *=, /=, %=
  • Other Operators: ++, -- (increment, decrement)

Studying That Suits You

Use AI to generate personalized quizzes and flashcards to suit your learning preferences.

Quiz Team

Related Documents

04- JavaScript I PDF Lecture Notes

More Like This

JavaScript Basics and Client-Side Scripting Quiz
5 questions

JavaScript Basics and Client-Side Scripting Quiz

DivineCognition avatar
DivineCognition
JavaScript Basics Quiz
10 questions

JavaScript Basics Quiz

MagicalBlessing avatar
MagicalBlessing
JavaScript Overview and Basics
19 questions

JavaScript Overview and Basics

InstructiveNephrite4861 avatar
InstructiveNephrite4861
JavaScript Basics
108 questions

JavaScript Basics

RedPandaDestroyer avatar
RedPandaDestroyer
Use Quizgecko on...
Browser
Open
Browser
Browser