diff --git a/1.0.0-variables.js b/1.0.0-variables.js new file mode 100644 index 0000000..57427bf --- /dev/null +++ b/1.0.0-variables.js @@ -0,0 +1,81 @@ +/* VAR: Global Variable */ + +var name = "Global Variable"; + +function Func() { + var name = "Local Variable"; + console.log(name); // Local Variable +} +console.log(name); // Global Variable + + +/* ==================================== */ + + +var name2 = "Global Variable"; +console.log(name2); // Global Variable + +function Func2() { + name2 = "Local Variable"; + console.log(name2); +} +Func2(); // Local Variable +console.log(name2); // Local Variable + + +/* ==================================== */ + + +/* CONST: Constant Variable */ + +const pi = 3; +console.log(pi); // 3 + +pi = 3.14; +console.log(pi); // ERROR: Uncaught TypeError: Assignment to constant variable. (Sabit değişken olduğu için değer atanamaz) + + +/* ==================================== */ + + +const pi2 = 3; +console.log(pi2); // 3 + +const pi2 = 3.14; +console.log(pi2); // ERROR: Uncaught SyntaxError: Identifier 'pi' has already been declared (Daha önce tanımlandı, dolayısıyla tekrar tanımlanamaz. ) + + +/* ==================================== */ + + +/* LET: Block-Scope Variable */ + + +let age = 15; +console.log(age); // 15 + +age = 20; +console.log(age); // 20 + + +/* ==================================== */ + + +let arr = 15; +console.log(age2); // 15 + +let age2 = 20; +console.log(age2); // ERROR: Uncaught SyntaxError: Identifier 'age' has already been declared (Daha önce tanımlandı, dolayısıyla tekrar tanımlanamaz. ) + + +/* ==================================== */ + + +for(let i = 0; i < 5; i++){ + console.log(i); + // 0, 1, 2, 3, 4 +} +console.log(i); +// i is not defined + + diff --git a/1.0.1-template_literal.js b/1.0.1-template_literal.js new file mode 100644 index 0000000..776a62e --- /dev/null +++ b/1.0.1-template_literal.js @@ -0,0 +1,35 @@ +/* Template Literal backtick( ` ) */ + +const name = "Ali"; +console.log(`Merhaba ${name}`); +// Merhaba Ali + +/* ==================================== */ + +const obj = { + name: "Ali " +}; +console.log(`Merhaba ${obj.name}`); +// Merhaba Ali + +/* ==================================== */ + +const getName = () => { return "Ali" } +console.log(`Merhaba ${getName()}`); +// Merhaba Ali + +/* ==================================== */ + +function selamla(str, nameArg) { // str: ["Merhaba ",""] + return `selamlar! hoşgeldin ${nameArg}`; +} +let name = "Ali"; +selamla`Merhaba ${name}`; +// selamlar! hoşgeldin Ali + +/* ==================================== */ + +var a = 5; +var b = 10; +console.log (`${a}+${b} toplam.:"${a+b}"`); +//5 + 10 toplamı..:"15" diff --git a/1.0.2-arrow_functions.js b/1.0.2-arrow_functions.js new file mode 100644 index 0000000..e6f4e78 --- /dev/null +++ b/1.0.2-arrow_functions.js @@ -0,0 +1,109 @@ +/* Arrow Functions */ + +/* ES5 */ +function hello() { + return "Hello World!"; +} + +/* ES6 */ +hello = () => "Hello World!" + + +/* ==================================== */ + + +/* ES5 */ +let sum = function (x, y) { + return x + y; +}; +console.log(sum(10, 20)); // 30 + +/* ES6 */ +let sum = (x, y) => x + y; +console.log(sum(10, 20)); // 30; +console.log(typeof sum); // function +console.log(hello instanceof Function); // true /* instanceof operatörü bir objenin belirli bir sınıfa ait olup olmadığını kontrol eder. */ + + +/* ==================================== */ + + +/* ES5 */ +let a = 4; +let b = 2; +function (){ + return a + b + 10; +} // 16 + +/* ES6 */ +let a = 4; +let b = 2; +() => a + b + 10; // 16 + + +/* ==================================== */ + + +/* ES5 */ +let numbers = [4,2,6]; +numbers.sort(function(a,b){ + return b - a; +}); +console.log(numbers); // [6,4,2] + +/* ES6 */ +let numbers = [4,2,6]; +numbers.sort((a,b) => b - a); +console.log(numbers); // [6,4,2] + + +/* ==================================== */ + + +/* ES5 */ +var arr = [1, 2, 3]; +var squares = arr.map(function (x) { return x * x }); // [1,4,9] + +/* ES6 */ +const arr = [1, 2, 3]; +const squares = arr.map(x => x * x); // [1,4,9] + + +/* ==================================== */ + + +/* ES5 */ +const kisiler = [{name: 'ali', age: 30}, {name: 'veli', age: 5}, {name: 'ayşe', age: 9}]; +const isimler = kisiler.map(function (kisi) { + return kisi.name +}); +console.log(isimler); // ["ali", "veli", "ayşe"] + +/* ES6 */ +const kisiler = [{name: 'ali', age: 30}, {name: 'veli', age: 5}, {name: 'ayşe', age: 9}]; +const isimler = kisiler.filter(kisi => kisi.name); +console.log(isimler); // ["ali", "veli", "ayşe"] + + +/* ==================================== */ + + +/* ES5 */ +function Component() { + var _this = this; + var button = document.getElementById('myButton'); + button.addEventListener('click', function () { + console.log('CLICK'); + _this.handleClick(); + }); +} +Component.prototype.handleClick = function () { }; + +/* ES6 */ +function Component() { + var button = document.getElementById('myButton'); + button.addEventListener('click', () => { + console.log('CLICK'); + this.handleClick(); + }); +} diff --git a/1.0.3-default_parameters.js b/1.0.3-default_parameters.js new file mode 100644 index 0000000..fe2fe9e --- /dev/null +++ b/1.0.3-default_parameters.js @@ -0,0 +1,24 @@ +/* Default Parameters */ + +const sum = (a = 10, b = 2) => a+b; +sum (2,2) // 4 +sum () // 12 +sum (3) // 5 + + +/* ==================================== */ + + +const arr = (x=1,y) => [x,y]; +arr() // [1, undefined] +arr(2) // [2, undefined] +arr(2,3) // [2, 3] + + +/* ==================================== */ + + +const arr = (x,y=1) => [x,y]; +arr() // [undefined,1] +arr(3) // [3,1] +arr(3,4) // [3,4] diff --git a/1.0.4-rest_spread_operators.js b/1.0.4-rest_spread_operators.js new file mode 100644 index 0000000..b6017e6 --- /dev/null +++ b/1.0.4-rest_spread_operators.js @@ -0,0 +1,76 @@ +/* REST Operator */ + +/* ES5 */ +function sum(a, b){ + return a + b; +} +console.log(sum(1, 2)); // 3 +console.log(sum(1, 2, 3, 4, 5)); // 3 + +/* ES6 */ +function sum(...input){ + let total = 0; + for (let i of input) total += i; + return total; +} +console.log(sum(1,2)); //3 +console.log(sum(1,2,3)); //6 +console.log(sum(1,2,3,4,5)); //15 + + +/* ==================================== */ + + +function sum(...numbers){ + let total=0; numbers.forEach(el=>total+=el);return total; +} +console.log(sum(2,4,6,5)) // 17 + + +/* ==================================== */ + + +function myFunc(a, b, ...moreArgs) { + console.log("a", a) // one + console.log("b", b) // two + console.log("moreArgs", moreArgs) // three four five six + console.log(moreArgs.length); // 4 +} + +myFunc("one", "two", "three", "four", "five", "six") + + +/* SPREAD Operator */ + +console.log(Math.max(3, 5, 1)); // 5 + +let arr = [3, 5, 1]; +console.log(Math.max(arr)); // NaN +console.log(Math.max(...arr)); // 5 + + +/* ==================================== */ + + +let arr1 = [1, -2, 3, 4]; +let arr2 = [8, 3, -8, 1]; +console.log(Math.max(...arr1, ...arr2)); // 8 +console.log(Math.max(1, ...arr1, 2, ...arr2, 25)); // 25 + + +/* ==================================== */ + + +let str = "Hello"; +console.log( [...str] ); // [H,e,l,l,o] + + +/* ==================================== */ + +/* ARRAY Copy */ + +let arr = [1, 2, 3]; +let arrCopy = [...arr]; +console.log(JSON.stringify(arr) === JSON.stringify(arrCopy)); // true +console.log(arr === arrCopy); // false + diff --git a/1.0.5-string_methods.js b/1.0.5-string_methods.js new file mode 100644 index 0000000..93697f4 --- /dev/null +++ b/1.0.5-string_methods.js @@ -0,0 +1,130 @@ +/* STRING Methods */ + +/* includes(string, pozisyon) */ +/* +Parametrenin String'de olup olmadığını kontrol eder. +Büyük/Küçük harfe duyarlıdır. +2. parametre olarak başlangıç değerini alır. +True/False değerini döndürür. +*/ + +const konu = 'ES6 String İşlemleri'; +console.log(konu.includes('ES6')) // true +console.log(konu.includes('es6')) // false +console.log(konu.includes('ES6',1)) // false /* Started with 0 */ + + +/* ==================================== */ + + +/* startsWith(string, pozisyon) */ +/* +String'in arama kelimesi ile başlayıp başlamadığını kontrol eder. +Büyük/Küçük harfe duyarlıdır. +2. parametre olarak başlangıç değerini alır. +True/False değerini döndürür. +*/ + +const konu = 'ES6 String İşlemleri'; +console.log(konu.startsWith('ES6')) // true +console.log(konu.startsWith('es6')) // false +console.log(konu.startsWith('ES6',1)) // false /* Started with 0 */ + + +/* ==================================== */ + + +/* endsWith(string, pozisyon) */ +/* +String'in arama kelimesi ile bitip bitmediğini kontrol eder. +Büyük/Küçük harfe duyarlıdır. +2. parametre olarak bitiş değerini alır. +True/False değerini döndürür. +*/ + +const konu = 'ES6 String İşlemleri'; +console.log(konu.endsWith('İşlemleri')) // true +console.log(konu.endsWith('İşlemleri',1)) // false /* Started with 0 */ + + +/* ==================================== */ + + +/* repeat(adet) */ +/* +String'e verilen parametre kadar tekrar eder +*/ + +const konu = 'ES6'; +console.log(konu.repeat(3)) // ES6ES6ES6 + + +/* ==================================== */ + + +/* slice(başlangıç, bitiş) */ +/* +String'de belirlenen parametre arasındaki sayı kadar karakterleri döndürür. +*/ + +const str = 'stringify'; +console.log(str.slice(2)); // ringify +console.log(str.slice(0, 5)); // strin +console.log(str.slice(0, 1)); // s +console.log(str.slice(-4, -1)); // 'gif' /* Sağdan 4. karakterden başla, sağdan 1. karakterde bitir */ + + +/* ==================================== */ + + +/* substring(başlangıç, bitiş) */ +/* +String'de belirlenen parametre arasındaki sayı kadar karakterleri döndürür. +"slice" ile hemen hemen aynıdır, sadece başlangıç değerinin son değerden daha büyük olmasına izin verir. +Negatif değere izin verilmez +Bitiş değeri verilmez ise, sona kadar karakterleri döndürür +*/ + +const str = 'stringify'; +console.log(str.substring(2)); // ringify +console.log(str.substring(2,6)); // ring +console.log(str.substring(6,2)); // ring + + +/* ==================================== */ + + +/* substr(başlangıç, adet) */ + +const str = 'stringify'; +console.log(str.substr(2)); // ringify +console.log(str.substr(2,4)); // 'ring', +console.log(str.substr(-4, 2)); // 'gi' + + +/* ==================================== */ + + +/* replace(string, new string) */ + +const konu = 'ES5 String İşlemleri'; +console.log(konu.replace('ES5',"ES6")) // ES6 String İşlemleri + + +/* ==================================== */ + + +/* split(karakter) */ + +const konu = 'ES6 String İşlemleri'; +console.log(konu.split(" ")) // ["ES6" ,"String", "İşlemleri"] + + +/* ==================================== */ + + +/* contact(str) */ +/* Çoklu string ekleme yapılabilir. Bunun için her bir string virgül(,) ile ayrılması yeterlidir */ + +const konu = 'ES6'; +console.log(konu.concat(" ","String İşlemleri")); // ES6 String İşlemleri diff --git a/1.0.6-for_of.js b/1.0.6-for_of.js new file mode 100644 index 0000000..c076ff2 --- /dev/null +++ b/1.0.6-for_of.js @@ -0,0 +1,58 @@ +/* for & forEach’ten for-of’a */ + +/* ES5 */ +var arr = ['a', 'b', 'c']; +for (var i=0; i num > 3); /* array dizisinde bulunan 3'ten büyük sayıları getir */ +console.log(numbers); // ekran çıktısı: [1, 2, 3, 4, 5, 6] +console.log(filtered); // ekran çıktısı: [4, 5, 6] + + +/* ==================================== */ + + +/* map() */ +/* Dizide değişiklik yapılarak yeni bir dizi oluşturulur. Dizi olarak geri döner */ + +const numbers = [1, 2, 3, 4, 5, 6]; +const oneAdded = numbers.map(num => num + 1); +console.log(numbers); // [1, 2, 3, 4, 5, 6] +console.log(oneAdded); // [2, 3, 4, 5, 6, 7] + + +/* ==================================== */ + + +/* recude(method, val=0) */ + +const numbers = [1, 2, 3, 4, 5]; +const islemYapanMetod = (toplam, simdikiDeger) => toplam + simdikiDeger; // 1 + 2 + 3 + 4 + 5 +console.log(numbers.reduce(islemYapanMetod)); // 15 + +const numbers = [1, 2, 3, 4, 5]; +const islemYapanMetod = (toplam, simdikiDeger) => toplam+ simdikiDeger; // 5 + 1 + 2 + 3 + 4 + 5 +console.log(array.reduce(islemYapanMetod, 5)); // 20 + + +/* ==================================== */ + + +/* some(method) */ +/* Dizide bulunan elemanlardan herhangi biri belirlenen kurala uyuyorsa TRUE, hiç biri uymuyorsa FALSE döndürür. */ + +const numbers1 = [1, 2, 3, 4, 5]; +const numbers2 = [12, 24, 31, 40, 50]; +const isLarge = (element, index, array) => element > 10; +numbers1.some(isLarge); // false +numbers2.some(isLarge); // true + + +/* ==================================== */ + + +/* every(method) */ +/* Dizide bulunan elemanlardan tamamı belirlenen kurala uyuyorsa TRUE, hiç biri uymuyorsa FALSE döndürür. */ + +const numbers1 = [1, 2, 3, 4, 5]; +const numbers2 = [12, 24, 31, 40, 50]; +const isLarge = (element, index, array) => element > 10; +numbers1.every(isLarge); // false +numbers2.every(isLarge); // true + + +/* ==================================== */ + + +/* sort(method) */ +/* Dizide bulunan elemanlardan tamamı belirlenen kurala uyuyorsa TRUE, hiç biri uymuyorsa FALSE döndürür. */ + +const numbers = [12,6,3,16,8]; +const toSmall = (a,b) => a-b; +const toLarge = (a,b) => b-a; +numbers.sort(toSmall); // [3,6,8,12,16] /* Küçükten büyüğe */ +numbers.sort(toLarge); // [3,6,8,12,16] /* Büyükten küçüğe */ + + +/* ==================================== */ + + +/* find(method) */ +/* Dizide Arama yapar. */ + +var users = [ + { + id: 1, + name: 'alpcan' + }, + { + id: 2, + name: 'hasan' + }, + { + id: 3, + name: 'burak' + } +] +users.find(x => x.name === 'burak'); // { id: 3, name: 'burak' } +users.find(x => x.name === 'burak').id; // 3 + + +/* ==================================== */ + + +/* Array.From() */ +/* belirli parametre ile dizi oluşturmayı sağlar. */ + +Array.from({ length: 10 }, (value,index) => index*2) // [0,2,4,6,8,10,12,14,16,18] + +let text = "birşey"; +Array.from(text); ["b","i","r","ş","e","y"] + + diff --git a/1.0.8-destruction-assignments.js b/1.0.8-destruction-assignments.js new file mode 100644 index 0000000..2ec2594 --- /dev/null +++ b/1.0.8-destruction-assignments.js @@ -0,0 +1,138 @@ +/* Destruction Assignments */ + +/* ES5 */ +var kisi = { + isim: 'Ahmet', + soyisim: 'Yılmaz' + }; +var isim = kisi.isim, +soyisim = kisi.soyisim; +console.log(isim); // 'Ahmet' +console.log(soyisim); // 'Yılmaz' + +/* ES6 */ +var kisi = { + isim: 'Ahmet', + soyisim: 'Yılmaz' + }; +var {isim, soyisim} = kisi; +console.log(isim); // 'Ahmet' +console.log(soyisim); // 'Yılmaz' + + +/* ==================================== */ + + +var kisi = { + isim: 'Ahmet', + soyisim: 'Yılmaz' + }, + isim = 'Ecma', + soyisim = 'Script'; +console.log(isim); // 'Ecma' +console.log(soyisim); // 'Script' +({isim, soyisim} = kisi); +console.log(isim); // 'Ahmet' +console.log(soyisim); // 'Yılmaz + + +/* ==================================== */ + + +/* Default Variable */ + +var kisi = { + isim: 'Ahmet', + soyisim: 'Yılmaz' + }; +var {isim, soyisim, yas = 24} = kisi; +console.log(isim); // 'Ahmet' +console.log(soyisim); // 'Yılmaz' +console.log(yas); // 24 + + +/* ==================================== */ + + +/* Default Variable */ + +const kisi = { + isim: 'Ahmet', + soyisim: 'Yılmaz' + }; +const {isim: ad, soyisim: soyad} = kisi; +console.log(ad); // 'Ahmet' +console.log(soyad); // 'Yılmaz' + + +/* ==================================== */ + + +/* Nested Variable */ + +const kisi = { + isim: 'Ahmet', + soyisim: 'Yılmaz', + yetenekler: { + kosu: { + mesafe: '10 km' + }, + yuruyus: { + mesafe: '20 km' + } + } + }; +var { yetenekler: {kosu} } = kisi; +console.log(kosu.mesafe); // '10 km' + + +/* ==================================== */ + + +/* Array Variable */ + +var renkler = ['white', 'gray', 'black']; +var [beyaz, ...diger] = renkler; +console.log(beyaz); // 'white' +console.log(diger.length); // 2 +console.log(diger[0]); // 'gray' +console.log(diger[1]); // 'blue' + + +/* ==================================== */ + + +/* Rest Array Variable */ + +var renkler = ['white', 'gray', 'black']; +var [...klonRenkler] = renkler; +console.log(klonRenkler); // "['white', 'gray', 'black']" + + +/* ==================================== */ + + +/* Functions */ + +var kisi= {adi: "Ahmet", yas:24, email:"crazyboy_01_92@hotmail.com"}; +function emailBilgisi({email}){ +return email; +} +console.log(emailBilgisi(kisi)); // crazyboy_01_92@hotmail.com +function adiVeYasGoster({adi,yas: yasi}){ +return `${adi}'in yaşı ${yasi}`; +} +console.log(adiVeYasGoster(kisi)); // Ahmet'in yaşı 24 + + +/* ==================================== */ + + +var arabaUret = function (marka, model, { vites, yakit, jant, parkSensoru }) { + // Burada arabayi yukaridaki seceneklerle ureten kod olacak +}; +arabaUret('audi', 'a3', { + vites: 'otomatik', + yakit: 'dizel', + jant: 'çelik' +}); diff --git a/1.0.9-object_properties.js b/1.0.9-object_properties.js new file mode 100644 index 0000000..e56ea24 --- /dev/null +++ b/1.0.9-object_properties.js @@ -0,0 +1,71 @@ +/* Object properties configuration */ + +let obj = { + get propName() { + // getter, the code executed on getting obj.propName + }, + + set propName(value) { + // setter, the code executed on setting obj.propName = value + } +}; + + +/* ==================================== */ + + +let user = { + name: "John", + surname: "Smith", + + get fullName() { + return `${this.name} ${this.surname}`; + } +}; + +console.log(user.fullName); // John Smith + + +/* ==================================== */ + + +let user = { + name: "John", + surname: "Smith", + + get fullName() { + return `${this.name} ${this.surname}`; + }, + + set fullName(value) { + [this.name, this.surname] = value.split(" "); + } +}; +// set fullName is executed with the given value. +user.fullName = "Alice Cooper"; + +console.log(user.name); // Alice +console.log(user.surname); // Cooper + + + +/* ==================================== */ + + +let user = { + name: "John", + surname: "Smith" +}; + +Object.defineProperty(user, 'fullName', { + get() { + return `${this.name} ${this.surname}`; + }, + + set(value) { + [this.name, this.surname] = value.split(" "); + } +}); + +console.log(user.fullName); // John Smith +for(let key in user) console.log(key); // name, surname diff --git a/2.0.0_class-basic-syntax.js b/2.0.0_class-basic-syntax.js new file mode 100644 index 0000000..0746992 --- /dev/null +++ b/2.0.0_class-basic-syntax.js @@ -0,0 +1,64 @@ +/* Class basic syntax */ + +class MyClass { + // class methods + constructor() { ... } + method1() { ... } + method2() { ... } + method3() { ... } + ... +} + + +/* ==================================== */ + + +class User { + constructor(name) { + this.name = name; + } + sayHi() { + console.log(this.name); + } +} +let user = new User("John"); +user.sayHi(); // John +console.log(typeof User); // function +console.log(User === User.prototype.constructor); // true + + +/* ==================================== */ + + +function makeClass(name) { + return class { + sayHi() { + console.log(name); + } + }; +} +let User = makeClass("Hello"); +new User().sayHi(); // Hello + + +/* ==================================== */ + + +class User { + constructor(name) { + this.name = name; + } + get name() { + return this._name; + } + set name(value) { + if (value.length < 4) { + console.log("Name is too short."); + return; + } + this._name = value; + } +} +let user = new User("John"); +console.log(user.name); // John +user = new User(""); // Name is too short. diff --git a/2.0.1_class-inheritance.js b/2.0.1_class-inheritance.js new file mode 100644 index 0000000..1cbb4da --- /dev/null +++ b/2.0.1_class-inheritance.js @@ -0,0 +1,75 @@ +/* Class inheritance */ + +class Animal { + constructor(name) { + this.speed = 0; + this.name = name; + } + run(speed) { + this.speed = speed; + console.log(`${this.name} runs with speed ${this.speed}.`); + } + stop() { + this.speed = 0; + console.log(`${this.name} stands still.`); + } +} +let animal = new Animal("My animal"); + +class Rabbit extends Animal { + hide() { + console.log(`${this.name} hides!`); + } +} +let rabbit = new Rabbit("White Rabbit"); +rabbit.run(5); // White Rabbit runs with speed 5. +rabbit.hide(); // White Rabbit hides! + + +/* ==================================== */ + + +class Animal { + constructor(name) { + this.name = name; + } + speak() { + console.log(`${this.name} makes a noise.`); + } +} + +class Dog extends Animal { + constructor(name, age) { + super(name); // super class constructor'ı çağrılır ve name parametresi pass edilir. + this.age = age; // super class ından sonra yeni parametre de tanımlanabilir. + } + speak() { + console.log(`${this.name} barks and age ${this.age}`); + } +} +let d = new Dog('Mitzie',6); +d.speak(); // Mitzie barks and age 6 + + +/* ==================================== */ + + +class Cat { + constructor(name) { + this.name = name; + } + speak() { + console.log(`${this.name} makes a noise.`); + } +} + +class Lion extends Cat { + speak() { + super.speak(); + console.log(`${this.name} roars.`); + } +} +let l = new Lion('Fuzzy'); +l.speak(); +// Fuzzy makes a noise. +// Fuzzy roars.