Introduction to JaVaScript
Server-Side and Client-side programming
The script element
Declaring Variables
JavaScript display possibilities
Using document.write()
Using innerHtlm
Using console.log()
Javascript programs
JavAScript statements
Javascript literals
Javascript variables
Assignment operators
Comparison and logical operators
Joining multiple words
Data Types
Javascript comments
Declaring a function
Calling a function
Functions with parameters
Thank you!
Category: programmingprogramming

Introduction to JaVaScript

1. Introduction to JaVaScript

Lecture 6.
Senior- Lecturer: Sarsenova Zhibek

2. JavaScript

is a simplified programming language
designed to beef up web pages with interactive
JavaScript is perfect for creating pop-up windows,
embedding animated effects, or modifying the
content that appears on your web page.

3. JavaScript

can display a personalized message to your
visitors(“Hello, Joe!”) or make title grow and
shrink perpetually
Gather information about date, your visitors
browser, or the content your visitor types into a
React to events that take place in a browser. For
example, you can add JavaScript code that runs
when a page finishes loading or when a visitor
clicks a picture.


is one of the 3 language all web
developers must learn:
HTML to define the content of web pages
CSS to specify the layout of web pages.

5. Server-Side and Client-side programming

applications rule the web world.
However, they’re difficult to program. Not
only do developers need to worry about
getting the program to generate HTML for a
browser, they also need to make sure the
program can run all kinds of complex code
and tap giant databases—and they need to do
it so that the site performs just as well when
millions of people view it as it does when
only one person visits it.

6. Client-side

applications, on the other hand, use
a completely different model. They embed
small, lightweight programs inside an ordinary
HTML page. When a browser downloads the
page, the browser itself runs the program
(assuming your security settings or compatibility
issues haven’t disabled the program). Client-side
programs are much less powerful than those on
the server side—they can’t reliably poll the huge
databases stored on web servers, for example,
and for security reasons they can’t directly
change most things on your computer. However,
they’re much simpler to create.

7. The script element

<body> section. Put script you want your
browser to run right away in the <body> section of
your HTML. The browser runs your script as soon as
it reaches the <script> element. If you put your
script at the beginning of the <body> section, your
browser process the script before it displays the
The <head> section. It runs immediately, before
the browser processes any part of the markup.

8. Example

9. Variables

containers that store important
information. Variables can store numbers, objects,
or pieces of text.

10. Declaring Variables

, followed by the name of the variable.
var myMessage
To store (=), copies the data on the right side of
the equal sign into the variable on the left.
myMessage = “Everybody loves variables”

11. Example

1. Creates a new variable named
currentDate. It fills the
currentDate variable with a new
Date object. New keyword is
crate an object .
2. creates a new variable named
message and fills it with the
beginning of a sentence that
announces the date.
3.This line adds information
created in line 2.currentDate
object comes with a built-in
function. toDateString(), that
converts the date information it
gets from your computer into a
piece of text suitable for display
in a browser.
4. uses document object, which
has a function named write(),
displays a piece of text on a web
page at the current location.
The final result is a page that
shows your welcome message.

12. JavaScript display possibilities

can "display"
data in different ways:
1. Writing into an alert
box, using window.alert().
2. Writing into the HTML
using document.write().
3. Writing into an HTML
element, using innerHTML.
4. Writing into the browser
using console.log().

13. Using document.write()

14. Using innerHtlm

id attribute defines the HTML element. The
innerHTML property defines the HTML content:

15. Using console.log()

your browser, you can use the console,log()
method to display data.
Activate the browser with F12, and select
“Console” in the menu.

16. Javascript programs

program instructions are called statements.
JavaScript is a programming language.
JavaScript statements are separated by semicolons.

17. JavAScript statements

statements are composed of:
Values, Operators, Expressions, Keywords and
JavaScript Values
Defines two types of values:
Fixed values and variable values
Fixed values are called literals.
Variable values called variables.

18. Javascript literals

are written with or without decimals:
are test, written within double or single
“Hello” or ‘Hello’

19. Javascript variables

are used to store data values
JavaScript uses the var keyword to declare
An equal sign is used to assign values to variables.
var a;
a= 8;

20. operators

operator (=) to assign values to
var a=5;
Var b = 8;
Arithmetic operators (+ - * /) to compute values:
The values can be of various types, such as
numbers and strings
“John”+ “ ”+ “Doe”

21. Assignment operators

22. Comparison and logical operators

23. Joining multiple words

programmers have used three ways of
joining multiple words into one variable name:
Hyphens: first-name, last-name, master-cars,
Underscore: first_name, last_name,
Camel Case: FirstName, LastName, MasterCard,
In JavaScript, camel case often starts with a
lowercase letter:
firstName, lastName, masterCard, interCity

24. Data Types

programming, text values are called text string.
String are written inside double or single quotes.
Numbers are without quote.
If you put a number in quotes, it will be treated as
a text string.
var a= “Hello", carName = “World”; //string
var price = 200; // number
var x={firstName: “John”, lastName: “Doe”} //

25. Javascript comments

are ignored, and will not be exacuted:
var a =5; //I will be executed
//var a = 7; I will not be executed
/* and */
JavaScript is case sensitive
All JavaScript identifiers are case sensitive:
The variables lastName and lastname, are two
different variables.
lastName= “Zhanerke”;
Lastname = “Serik” ;

26. function

is a series of code instructions you group
together and give a name. They can perform a
series of operations.
You need to create them only once, and you can
reuse them over and over again.

27. Function

function is a programming routine consisting of
one or more lines of code that performs a certain
alert () function requires one piece of information,
known as an argument in programmer-speak. In this
case, that piece of information is the text you want
the alert text box to display.
To display some information you put text inside
single apostrophe quotes (‘) or double quotation

28. Declaring a function

by deciding what your function is going to
do(like display an alert message) then choose a
suitable name for it.
Names can’t have any spaces or special characters.
Start with the word function
Parentheses is to send extra information to your

29. Calling a function

call the function, use the function name
followed by parentheses:

30. Example

31. Functions with parameters

code to be executed, by the function, is placed
inside curly brackets: {}
English     Русский Rules