Java Script

Volkan Şengül

Yazılımcı'nın Seyir Defteri

@volkansengul

http://volkansengul.com

---

---

JavaScript Nedir?

-

Syntax

var x, y, msg;

x = 5;

y = x+10;

msg = 'Merhaba Dünya'

msg = "Merhaba Dünya"

msg = 'Merhaba' + ' '+ 'Dünya'; // satır yorumu

/* block yorum 
buraya gelebilir */

var firstName, firstname;

Veri Tipleri

// string
const message = 'Merhaba Dünya';

// number
const number  = 5;

// float
const floatNumber = 3.14;

// boolean 
const isTrue = true;

// Array
const myLit = [1,2,3,4,'elma'];

// Object
const myObject  = {firstName:'Volkan', lastName:'Şengül'};

// Undefined & Null
const firstName = null;
const surName;
let number = 5;

number.toString(); // string

number = '5';

console.log(number + 3); ???

number = parseInt(number);

parseFloat(number); // 5.0

Veri Tipi Dönüşümleri

Aritmetik Operatörler

Operatör Açıklama
+
-
*
/
%
++
--

Atama Operatörler

Operatör Açıklama
= değer ata
+= değeri ekleyerek ata
-= değeri çıkartarak ata
*= değeri çarparak ata
/= değeri bölerek ata
%= değerin modunu alarak ata

Karşılaştırma Operatörleri

Operatör Açıklama
== eşit
=== eşit değer & eşit veritipi
!= eşit değil
!== eşit değil ve veri tipi eşit değil
< küçük
> büyük
<= küçük  eşit
>= büyük eşit

Mantıksal Operatörler

Operatör Açıklama
&& ve
|| veya
! değil

Bitwise Operatörler

Operatör Açıklama Örnek
& AND 5&1 0101 & 0001 0001 1
| OR 5 | 1 0101 | 0001 0101 5
~ NOT ~ 5 ~ 0101 1010 10
^ XOR 5 ^ 1 0101 ^ 0001 0100 4
<< Zero fill left shift 5 << 1 0101 << 0001 1010 10
>> Signed right shift 5 >> 1 0101 >> 0001 0010 2
>>> Zero fill right shift 5 >>> 1 0101 >>> 0001 0010 2

Fonksiyonlar

function topla( sayi1, sayi2){
    return parseInt(sayi1) + parseInt(sayi2);
}

const topla = function(sayi1, sayi2){
    return parseInt(sayi1) + parseInt(sayi2);
}


function topla(sayi1, sayi2, ...digerleri){
    const araToplam = parseInt(sayi1) + parseInt(sayi2);
    let toplam = araToplam;
    for (let val of digerleri) {
        toplam += parseInt(val);
    }
    return toplam;
}

function topla(sayi1, sayi2){
    setTimeout( function(){
        toplamiGoster(parseInt(sayi1) + parseInt(sayi2));
    }, 3000);
}

function toplamGoster(sonuc){
    const sonucElm = document.getElementById('sonuc');
    sonucElm.innerHtml( sonuc );
}

Callback Fonksiyonlar


const topla = (sayi1, sayi2) => {
    return parseInt(sayi1) + parseInt(sayi2);
}

Arrow Function

Events

Event Açıklama
onchange
onclick
onmouseover
onmouseout
onkeydown
onkeyup
onload 
<button onclick="document.getElementById('demo').innerHTML = Date()">The time is?</button>
for( let i = 0; i<100; i++){
    console.log( i );
}

Döngüler

while ( i < 100 ){

    if ( i === 5 ) {
        break;
    }

    console.log( i );

    i += 1;
}
const number = 10;

if ( number > 9 ){
    console.log( 'OK' );
}

if ( number > 10 ) {
    console.log( 'OK' );
} else if ( number > 9 && number < 15 ){
    console.log( 'OK' );
} else {
    console.log( 'OK' );
}

Koşullu İfadeler

const number = 10;

switch number {
    case 5;
        console.log(' sayı 5 ');
        break;
    case 10;
        console.log(' sayı 5 ');
        break;
    default;
        console.log( 'sayı '+number );
        break;
}
const myList = ['elma', 'armut', 1, 5];

const myObj = { 
    'meyveler': ['elma', 'armut'],
    'sayilar': [1,5]
};


myList[0]; // elma

myList[3]; // 5

myObj.meyveler; // ['elma','armut'];

myObj.meyveler[0]; // elma

Array & Object <3

const myList = ['elma', 'armut', 1, 5];

const myObj = { 
    'meyveler': ['elma', 'armut'],
    'sayilar': [1,5]
};

myList.push('X'); // ['elma', 'armut', 1, 5, 'X']


myObj['meyveler']('X'); // ['elma', 'armut', 'X']
myList[0] = 'kivi'; // ['kivi', 'armut', 1, 5, 'X']

myList.shift(); // ['armut', 1, 5, 'X']

delete myList[3]; // ['armut', 1, 5]

myList.splice(0,1); //  [1, 5]

JS

By Volkan Şengül

Made with Slides.com

JS

  • 447

More from Volkan Şengül