js etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster
js etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster

11 Eylül 2017 Pazartesi

JavaScript Var / Let / Const


Merhaba, bu yazımızda JavaScriptde var, let , const farkını inceleyeceğiz. ES6'dan önce değişkenlerimizi var ile tanımlıyorduk. ES6 ile birlikte let ve const kavramları geldi.

Özetle var ile önceden bir değişken tanımladıktan sonra aynı isimle birdaha değişken tanımlarsak JavaScriptde hata almıyoruz. 

Örneğin;

var ad="Oguzhan";
var ad="Cevik";

Aynı şekilde bir değişkeni const ile tanımlayıp sonra o değişkene yeni bir değer verdiğimizde hata alırız.

Örneğin;

const ad = "Oguzhan";
ad = "Cevik"; // TypeError: Assignment to constant variable.

Son olarak let ile tanımladığımızda bir değişkeni sonradan başka bir değer girilmesine izin veririz.

Örneğin;

let ad = "Oguzhan";
ad = "Cevik";

8 Eylül 2017 Cuma

JavaScript Canvas Click Event



Merhaba, daha önceki yazımda JavaScript'de Canvası görmüştürk. Bu yazımda ise canvas üzerindeki eventlardan bir tanesini inceleyeceğiz. Canvas üzerinde click eventi olduğunda canvas üzerine daireler çizdireceğim.


Örneğin;


<!DOCTYPE html>
<html>
<body>
<canvas id="canvas1" width="600" height="600" style="border:1px solid;">
Bu browser canvası desteklemiyor!
</canvas>
<script>
var canvas1=document.getElementById("canvas1");
var cizim=canvas1.getContext("2d");
canvas1.addEventListener('click',function(e){
cizim.beginPath();
cizim.arc(e.x,e.y,50,0,2*Math.PI);
cizim.stroke();
}
);
</script>
</body>
</html>


Ekran Çıktısı;

7 Eylül 2017 Perşembe

JavaScript Canvas


Merhaba, bu yazımızda JavaScript'de Canvas oluşturmayı göreceğiz. Canvas'lar sayfamızda çizim alanları oluşturmamıza yarar.

Örneğin;

<!DOCTYPE html>
<html>
<body>
<canvas id="canvas1" width="600" height="600" style="border:1px solid;">
Bu browser canvası desteklemiyor!
</canvas>
<script>
var canvas1=document.getElementById("canvas1");
var cizim=canvas1.getContext("2d");

6 Eylül 2017 Çarşamba

Html JavaScript Button


Merhabalar bu yazımda sizlere html sayfadaki bir butona tıklanma olayı olduğunda ekrana merhaba basan kodu yazacağız.

Kod:
< html>
< head>
< meta charset=UTF-8>
< /head>
< body>
< button onclick'document.getElementById("mesaj").innerHTML="merhaba";'> Tıkla < /button>
< p id="mesaj">< /p>
< /body>
< /html>

Ekran Çıktısı:
Hello JavaScript
Merhaba Dünya

5 Eylül 2017 Salı

Html içinde JavaScript


Merhabalar bu yazımda sizlere html formatındaki dosya içine JavaScript kodlarını nasıl gömülür onu göstereceğim. JavaScript ilk çıkarken client side taraflı çıkmıştır. Bu yüzden html içine yazılabilir. Daha sonra frameworklerin artmasıyla sunucu tabanlı framework yazılmışdır. Örneğin; Node.Js

Kod:
< html>
< head>
< meta charset=UTF-8>
< /head>
< body>
< script>
document.write("Hello JavaScript");
< /script>
< br>
Merhaba Dünya
< /body>
< /html>

Ekran Çıktısı:
Hello JavaScript
Merhaba Dünya

4 Eylül 2017 Pazartesi

JavaScript Constructor


Merhaba, bu yazımızda JavaScript dilinde bulunan Construcor ifadesinden bahsedeceğiz.Kısaca bir method çalışırken yapıcı olarak çalışacak ilk komut dizeleri.

Örneğin;


function createEmployeeObject(firsName,lastName){
this.firstName=firstName;
this.lastName=lastName;
}

var emp1=new createEmployeeObject("Oguzhan","Cevik");

3 Eylül 2017 Pazar

JavaScript setTimeout



Merhaba, bu yazımda sizlere JavaScript dilinde bulunan setTimeout fonksiyonundan bahsedeceğim. Bu fonksiyon herhangi bir işlemi asenkronize bir şekilde execute edildikten kaç saniye sonra çalıştırmamıza yarar.



Örneğin;


var a=10;

var fn=function{
console.log(a);
};

setTimeout(fn,6000);
console.log("Bitti");

Ekran;

Bitti
10


Özetle bu kodu çalıştırdığımızda ekrana Bitti yazdıktan altı saniye sonra ekrana 10 değerini yazdıracaktır.

2 Eylül 2017 Cumartesi

JavaScript Functions



Merhaba bu yazımızda JavaScript dilinde Functions (Fonksiyonları) göreceğiz. Hepimizin bildiği gibi diğer yüksek seviyeli dillerdede var olan içinde bir takım işlemler yaptığımız yapılardır.



Örneğin;

function sayHello(){
console.log("Hello");
}
sayHello();

Ekran Çıktısı;
Hello

parametrede alabilir.

Örneğin;
function sayHello(name){
console.log("Hello "+name);
}
sayHello("Oguzhan");

Ekran Çıktısı;
Hello Oguzhan

1 Eylül 2017 Cuma

JavaScript Deleting Properties


Merhaba, bu yazımızda JavaScript'de Deleting Properties (özellikleri silme) kavramından bahsedeceğiz. Burada bir değişkeni yada bir obje içerisindeki değişkeni silmeye yarar.

Öncelikle person adında bir objemiz olduğunu düşünelim.

var person = {

'firstname':'Oguzhan',
'lastname':'Cevik',
'age':21

};


daha sonra bu objemizden yaşı silelim.

delete persone.age;


bu komutu yazdıktan sonra objemiz aşağıdaki gibi olacaktır.

var person = {

'firstname':'Oguzhan',
'lastname':'Cevik'

};

31 Ağustos 2017 Perşembe

JavaScript Nested Object



Merhaba bu yazımızda nested object kavramını inceleyeceğiz. Nested object kısaca bir objenin içerisinde bir obje daha tanımlanmasıdır.


Örneğin;


var myobj={
"prop":"Hello",
"objProp":{
"innerProp":"Inner Property"
}
};
console.log(myobj.objProp.innerProp);

Ekran:
Inner Property

30 Ağustos 2017 Çarşamba

JavaScript Object Türü


Merhaba, bu yazımızda JavaScipt dilinde Object tipini inceleyeceğiz. Object içinde değişkenler,metodlar,fonksiyonlar barındırır.

Örneğin;

var myObj{};
console.log(myObj);
myObj.prop=15;
myObj.prop2="Hello";
console.log(myObj);
console.log("Number:"+myObj.prop+" String:"+myObj.prop2);

var obj2={
"prop1":"Oguzhan",
"prop2":21,
"prop3":true
};
console.log("Ad:"+obj2.prop1+"Yaş:"+obj2.prop2+"Değer:"+obj2.prop3);


Ekran Çıktısı:

Object{}
Object{prop:"Hello",prop2:15}
Number:15 String:Hello
Ad:Oğuzhan Yaş:21 Değer:true

29 Ağustos 2017 Salı

JavaScript Type Coercion ve Equal


Merhaba, bu yazımızda JavaScript'de Type Coercion (Tip Zorlaması) ve Equal (Eşitlik) konusunu ele alacağız.

Örneğin;

123 + "4" = "1234" olur.

JavaScript dilinde sayısal bir veriyle string bir verinin birleşmesi string verisi elde edilir.

Örneğin;

var a=10;
var b="10";

if(a==b){
console.log("iki değer eşittir");
}

ekran
iki değer eşittir

28 Ağustos 2017 Pazartesi

JavaScript typeof Komutu


Merhabalar, bu yazımızda JavaScript dilinde bulunan typeof komutunu inceleyeceğiz.

Bu komut ile bir değişkenin tipini öğrenebilmekteyiz.

typeof< value > yada typeof< variable >

Kod:
var a;
console.log(typeof a);
a=10;
console.log(typeof a);
a="Oguzhan";
console.log(typeof a);
a=true;
console.log(typeof a);
a=null;
console.log(typeof a);

Ekran Çıktısı:
undefined
number
string
boolean
object


Önemli bir nokta ise burada JavaScript dilinin eskiden beri gelen bir bug'ı olması. Çünkü null değerininin tipini object olarak döndürmesidir. Bu hata dilin eski yapısından beri geldiğinden dolayı hala devam etmektedir.

27 Ağustos 2017 Pazar

JavaScript Declaration ve Definition Arasındaki Fark



Merhaba, bu yazımda kısaca JavaScript dilinde Declaration ve Definition arasındaki farkdan bahsedeceğim. 

Örneğin;

var value; //burada declaration (deklare) yapıyoruz.

value=65; //burada ise definition (tanımlama) yapıyoruz.