JavaScript sunumu

JavaScript

c+++

oak

hotjava

jscript

livescript

ECMAScript

JavaScript

Dnyann en ok kullanlan programlama dili

234 milyon web sitesi

JavaScript

Dnyann en ok kullanlamayan programlama dili

Gmail(AJAX) gelinceye kadar sadece grsel eler iin kullanyorduk

JavaScript

ECMA-262

http://www.ecma-international.org/publications/standards/ecma-262.htm

ECMAScript

Sz dizimi C

Regexp Perl

Fonksiyonel Programlama Scheme (glmeler...)

Prototype temelli kaltm Self

Kullanm alanlar

Web : Markup ile 'etkileim'i salamak

Sunucu tarafnda : mod_js, nodejs (spidermonkey, v8)

Herhangi bir uygulama : ScriptEngine

Markup iinde kullanm

nline kullanm
document.write('Yalan dnya!');

Neet Erta

Harici kullanm

Veri tipleri

Objeler'undefined' harici her ey bir obje, fonksiyonlar bilekey/value elerinden oluur. Key'ler string, value'lar ise herhangi baka bir 'obje'

var x = obje.get;
obje.set = value;
delete obje.property;

Veri tipleri

Rakam Tek bir rakam tipi var 64 bit float (double)var x = 0.1 + 0.20.30000000000000004

http://www.w3schools.com/jsref/jsref_obj_number.asp

Veri tipleri

Array (Listeler)Aslnda bir array deildir.Bir objeden tek fark, key olarak rakam almasdr. Ya da aslnda bu da bir fark deildir.var x = new Array();
x[0] = neset;
x[0]; // neset
x['foobar'] = ertas;
x['foobar']; // ertas

http://www.w3schools.com/jsref/jsref_obj_array.asp

Veri tipleri

String (Metin ilemleri)

Karakter kodlamas : UTF-16

fooBar.toUpperCase(); //FOOBAR

http://www.w3schools.com/jsref/jsref_obj_string.asp

Veri tipleri

Boolean

var foobar = new Boolean(true);foobar.toString();

false.toString();

http://www.w3schools.com/jsref/jsref_obj_boolean.asp

Veri tipleri

Date (Tarih ilemleri)

var currentTimestamp = new Date().getTime(); //1279780366831

http://www.w3schools.com/jsref/jsref_obj_date.asp

Veri tipleri

Math (Matematiksel ilemler)

var max = Math.max(3,1,7,10); //10

http://www.w3schools.com/jsref/jsref_obj_math.asp

Veri tipleri

Regex (Dzenli ifadeler)

var isNeset = /neset/.test("Neset ertas"); //falsevar isNeset = /neset/i.test("Neset ertas"); //true

"Neset Ertas".replace(/s/g,""); //Neet Erta

http://www.w3schools.com/jsref/jsref_obj_regexp.asp

Veri tipleri

Browser objects ( Document Object Model) - window
- navigator
- screen
- history
- location

Veri tipleri

DOM (Document object model)

var allLinksOnPage = document.links;
var titleOfPage = document.title;
var allImagesOnPage = document.images;

http://www.w3schools.com/jsref/dom_obj_document.asp

falsy

false

null

undefined

""

0

NaN

false

0

Koul operatrleri

switch( myValue) {
case 1 : foo = hodo; break;

}

if ( foo == hodo ) {
myValue = bodo;
}
else if ( foo == dodo ) {
myValue = nono;
}
else {
alert('Everything is something happened!');
}

Dngler

for (i = 0; i < max; i++ ) {};

while ( x != y ) {};

do { } while ( x!=y);

for (key in object) { value = object[key); };

continue / break

Scope

{
var foo = bar;
}alert(foo);

Block scope'lar yoktur, fonksiyon scope'lar vardr

(function(){
var foo = bar;
})alert(foo);

Exception'lar

try {
throw {name:"FooError", message:"What can I do, sometimes"};
}
catch(error) {
alert(error.message);
}

Fonksiyonlar

function foo(){alert('bar');

}

var foo = function(){alert('bar');

}

foo(); // ikisi de ayn ekilde arlabilir

Fonksiyonlar

function foo(){return bir;

}

alert( foo() ); // iki

function foo(){return iki;

}

var foo = function(){return bir;

}

alert( foo() ); // bir

var foo = function(){return iki;

}

lambda

Parametre olarak fonksiyonlar

return deeri olarak fonksiyonlar

anonim fonksiyonlar

Snflar

function ClassName(){
this.publicVar = "foo";
var privateVar = "bar";
this.publicFunction = function() {
var valueOfPrivateVar = getPrivateVar();
alert(valueOfPrivateVar);
};

var getPrivateVar = function() {
return privateVar;
};
}

var myObj = new ClassName();myObj.publicFunction();

Snflar

var myObj= {
"publicVar" : "foo",
"publicFunction" : function() {
alert(this.publicVar);
}
};

myObj.publicVar;myObj.publicFunction();

Snflar

var myObj = function() {
var privateVar = "foo";
return {
publicMethod : function() {
alert(privateVar);
}
};
}();

myObj.privateVar;myObj.publicMethod();

Snflar

var MyClass = function(param1) {
var privateVar = "this is object for";
this.publicVar = privateVar + " > " + param1;
}myObj = new MyClass("first");
myOtherObj = new MyClass("second");MyClass.prototype.alertPrivateVar = function() {
alert(this.publicVar);
}
myOtherObj.alertPrivateVar = function() {
alert('this is overridden');
}myObj.alertPrivateVar();myOtherObj.alertPrivateVar();

this

foo.bar() iin foo

foobar() iin global (browser iin 'window')

arguments

foobar(param1,param2,param2) {
alert(argc + arguments.length; //

param1 = arguments[0];

}

arguments

var foobar = function(name, surname, age) { this.name = name; this.surname = surname; this.age = age;}

var foobar = function(obj) { this.name = obj.name || "default name"; this.surname = obj.surname; this.age = obj.age;}

Inheritence

function BaseUser(name, surname) {
var name = name;
var surname = surname;
this.getNameSurname = function() {
alert( name + " " + surname);
};
};

function AdminUser(name, surname, rank){
BaseUser.apply(this,arguments);
var rank = rank;
this.getRank = function() {
alert(rank);
};
}

user = new BaseUser("Recep", "Blblses");
user.getNameSurname();
user.getRank(); // TypeError not a function

admin = new AdminUser("Resul","Balay","cCc");
admin.getNameSurname();
admin.getRank();

Eventlar

Kt
click

Eventlar

Biraz daha iyilinkElement = document.getElementById('link');
function alertFoo() {
alert('foo');
}

linkElement.onclick = alertFoo;

Event'lar

Tavsiye edilenlinkElement = document.getElementById('link');
function alertFoo() {
alert('foo');
}if (linkElement.addEventListener){
linkElement.addEventListener('click', alertFoo, false);
}
else if (linkElement.attachEvent){ //explorer
linkElement.attachEvent('onclick', alertFoo);
}

XHR (XmlHttpRequest)

var xmlHttp = null;
try {
xmlHttp = new XMLHttpRequest(); // Mozilla, Opera, Safari, IE >= 7
} catch(e) {
try { // ie6
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch(e) {
try { //ie5
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch(e) {
xmlHttp = null;
}
}
}if (xmlHttp) {
xmlHttp.open('GET', 'something.xml', true);
xmlHttp.onreadystatechange = function () {
if (xmlHttp.readyState == 4) {
alert(xmlHttp.responseText);
}
};
xmlHttp.send(null);
}

JSONP (Json with padding)

Farkl domainlere istek yapabilmek istediinizde

function methodName(params) {
console.log(params);
}

Baksanz iyi olur

http://www.w3schools.com/js/default.asp

http://azer.googlecode.com/files/ileri_seviye_javascript.pdf

http://ejohn.org/

Javascript : The Good Partshttp://www.amazon.com/JavaScript-Good-Parts-Douglas-Crockford/dp/0596517742

Pro Javascript Techniqueshttp://www.amazon.com/Pro-JavaScript-Techniques-John-Resig/dp/1590597273

letiim

Osman Yksel

yuxel |ET| sonsuzdongu {DAT} comhttp://yuxel.net

Muokkaa otsikon tekstimuotoa napsauttamalla

Muokkaa jsennyksen tekstimuotoa napsauttamallaToinen jsennystasoKolmas jsennystasoNeljs jsennystasoViides jsennystasoKuudes jsennystasoSeitsems jsennystasoKahdeksas jsennystasoYhdekss jsennystaso

Technology

JavaScript sunumu