INTRODUCTION TO JAVASCRIPT

coordinatedcapableΛογισμικό & κατασκευή λογ/κού

4 Νοε 2013 (πριν από 3 χρόνια και 7 μήνες)

75 εμφανίσεις

INTRODUCTION TO
JAVASCRIPT

JAVASCRIPT


JavaScript is used in millions of Web
pages to improve the design, validate
forms, detect browsers, create
cookies, and much more.


JavaScript is the most popular
scripting language on the internet, and
works in all major browsers, such as
Internet Explorer, Mozilla, Firefox,
Netscape, Opera.

WHAT IS JAVASCRIPT?


JavaScript was designed to add interactivity to HTML
pages


JavaScript is a scripting language (a scripting
language is a lightweight programming language)


A JavaScript consists of lines of executable computer
code


A JavaScript is usually embedded directly into HTML
pages


JavaScript is an interpreted language (means that
scripts execute without preliminary compilation)


Everyone can use JavaScript without purchasing a
license

Are Java and JavaScript the Same?


NO!


Java and JavaScript are two completely
different languages in both concept and
design!


Java (developed by Sun Microsystems) is a
powerful and much more complex
programming language
-

in the same
category as C and C++.

How to Put a JavaScript Into an
HTML Page?

<html>

<body>

<script type="text/javascript">

document.write("Hello World!")

</script>

</body>

</html>

Ending Statements With a
Semicolon?


With traditional programming languages,
like C++ and Java, each code statement
has to end with a semicolon (;).


Many programmers continue this habit
when writing JavaScript, but in general,
semicolons are
optional
! However,
semicolons are required if you want to put
more than one statement on a single line.

JavaScript Variables


Variables are used to store data.


A variable is a "container" for information you
want to store. A variable's value can change
during the script. You can refer to a variable by
name to see its value or to change its value.


Rules for variable names:


Variable names are case sensitive


They must begin with a letter or the underscore
character


strname


STRNAME (not same)

JavaScript Operators

Arithmetic Operators

(İşleçler, iki ya da daha fazla değer
üzerinde işlem yapılmasını
sağlar. JavaScript içinde
aritmetik ve hesaplama işleçleri
olmak üzere iki tür işleç
kullanılır
)


Operator

Description

Example

Result

+

Addition

x=2

4

y=2

x+y

-

Subtraction

x=5

3

y=2

x
-
y

*

Multiplication

x=5

20

y=4

x*y

/

Division

15/5

3

5/2

2,5

%

Modulus (division
remainder)

5%2

1

10%8

2

10%2

0

++

Increment

x=5

x=6

x++

--

Decrement

x=5

x=4

x
--

JavaScript Operators


2

Assignment Operators

(Atama deyimi (=), bir değişkene
bir değerin atanmasını sağlar.
Değişkenlere türlerine ve
tanımlamalarına uygun olan
herhangi bir değer atanabilir.)

Operator

Example

Is The Same As

=

x=y

x=y

+=

x+=y

x=x+y

-
=

x
-
=y

x=x
-
y

*=

x*=y

x=x*y

/=

x/=y

x=x/y

%=

x%=y

x=x%y

JavaScript Operators
-

3

Comparison Operators

(Karşılaştırma işleci, iki ya da daha
çok değeri birbiriyle
karşılaştırarak True ya da False
olarak mantıksal bir değer
döndürür.)


Operator

Description

Example

==

is equal to

5==8 returns false

===

is equal to (checks for
both value and
type)

x=5

y="5"



x==y returns true

x===y returns
false

!=

is not equal

5!=8 returns true

>

is greater than

5>8 returns false

<

is less than

5<8 returns true

>=

is greater than or equal
to

5>=8 returns false

<=

is less than or equal to

5<=8 returns true

JavaScript Operators
-

4

Logical Operators

(İkili işleçler birden çok
karşılaştırma işlemini tek bir
koşul ifadesi olarak birleştirirler.)


Operator

Description

Example

&&

and

x=6

y=3



(x < 10 && y > 1)
returns true

||

or

x=6

y=3



(x==5 || y==5)
returns false

!

not

x=6

y=3



!(x==y) returns
true

JavaScript Basic Examples

<script>

document.write("Hello World!")

</script>


format text with HTML code
-

heading


<script>

alert("Hello World!")

</script>

Example

<script>

x=“Hello World!”

document.write(x)

</script>


<script>

x=“İsminizi Yazın….”

document.write(“Merhaba” +x)

</script>


use line break html code

JavaScript Popup Boxes


Alert Box


An alert box is often used if you want to make
sure information comes through to the user.


When an alert box pops up, the user will have
to click "OK" to proceed.

<script>

alert("Hello World!")

</script>

JavaScript Popup Boxes
-

2


Confirm Box


A confirm box is often used if you want the user
to verify or accept something.


When a confirm box pops up, the user will have
to click either "OK" or "Cancel" to proceed.


If the user clicks "OK", the box returns true. If
the user clicks "Cancel", the box returns false.

JavaScript Popup Boxes
-

3


Prompt Box


A prompt box is often used if you want the user
to input a value before entering a page.


When a prompt box pops up, the user will have
to click either "OK" or "Cancel" to proceed after
entering an input value.


If the user clicks "OK“, the box returns the input
value. If the user clicks "Cancel“, the box
returns null.

Prompt Box Example

<script>

x=prompt (“Adınızı Yazınız”, “ ”)

document.write(“Merhaba <br>”,+x)

</script>

JS Examples
-
1

Y=20x+12 ve x=3 ise, sonucu açılan
pencerede gösteren kod nasıl yazılmalıdır?

<script>

x=3

y=20*x+12

alert(y)

</script>

Examples
-
2

<script>

s1=12

s2=28

toplam=s1+s2

document.write("Sayıların toplamı: "+toplam)

</script>

Examples
-
3

<script>

s1=12

s2=28

toplam=s1+s2

fark=s1
-
s2

carp=s1*s2

bol=s1/s2

document.write("<br>Değişkenlerdeki sayılarla ilgili aritmetik işlemler...<br>")

document.write("<br>Sayıların toplamı: "+toplam)

document.write("<br>Sayıların farkı: "+fark)

document.write("<br>Sayıların çarpımı: "+carp)

document.write("<br>1.sayının 2.sayıya bölümü: "+bol)

alert("Hesaplamalar sona erdi!")

</script >

s1=12, s2=28

Bu değişkenlere ait sayıların toplamlarını, farklarını, çarpımlarını ve bölümlerini ayrı
satırlarda gösteren ve son olarak ekrana “Hesaplamalar sona erdi” yazısını çıkaran
js kodunu oluşturunuz.

Conditional Statements


Very often when you write code, you want to perform different actions
for different decisions. You can use conditional statements in your
code to do this.


In JavaScript we have the following conditional statements:


if statement

-

use this statement if you want to execute some code
only if a specified condition is true


if...else statement

-

use this statement if you want to execute some
code if the condition is true and another code if the condition is false


if...else if....else statement

-

use this statement if you want to
select one of many blocks of code to be executed


switch statement

-

use this statement if you want to select one of
many blocks of code to be executed


Conditional Statements
-

2

if (
condition
)

{

code to be executed if condition is true

}




if (
condition
)

{

code to be executed if condition is true

}

else

{

code to be executed if condition is not true

}

Conditional Statements Examples

<script>

x=3

if(x<0)

{

alert (“negatif”)

}

else

{

alert (“pozitif”)

}

</script>

Conditional Statements Examples
-

2

<script>

c=confirm(“Kitap Okuyor musunuz?”)

if(c)

{

alert (“tebrikler walla”)

}

else

{

alert (“ayıp ettiniz ama”)

}

</script>

Conditional Statements Examples
-

3

<script>

p=prompt("Ankara'nın plaka numarası nedir?", " ")

if(p=="06")

{

alert("Doğru")

}

else

{

alert("Yanlış")

}

</script>