Modern JavaScript

Modern JavaScript, web geliştirme dünyasında son yıllarda ortaya çıkan ve hızla yaygınlaşan bir kavramdır. Bu kavram, JavaScript dili için son zamanlarda ortaya çıkan özellikler, araçlar ve kütüphanelerle ilgilidir.

Modern JavaScript konuları arasında öne çıkanlar şunlardır:

Arrow Function

JavaScript dili için yayınlanan ES6 sürümü ile birlikte, kodların yazılması ve okunması daha kolay hale gelmiştir. Bunlardan biri de arrow fonksiyonlarıdır. Arrow fonksiyonlar, kodların daha okunaklı ve anlaşılır olmasını sağlar.

Öncelikle, eski JavaScript sürümlerinde fonksiyonları tanımlarken kullandığımız "function" anahtar kelimesi, arrow fonksiyonlar ile "=>" şeklinde tanımlanır. Aşağıdaki örnekte, arrow fonksiyon ile "hello" yazdıran bir fonksiyon tanımlanmıştır:

const sayHello = () => {
  console.log("hello");
}

Bu kod, eski JavaScript sürümlerinde şöyle yazılabilirdi:

const sayHello = function() {
  console.log("hello");
}

Arrow fonksiyonlar, tek bir ifade içeren fonksiyonlar için daha da kısa yazılım sunar. Örneğin, yukarıdaki örnekte "console.log("hello");" ifadesi tek bir satırda yazılabilir. Bu durumda, fonksiyon tanımı şöyle olur:

const sayHello = () => console.log("hello");

Arrow fonksiyonlar, parametre alan fonksiyonlar için de kullanılabilir. Örneğin, aşağıdaki örnekte, "name" parametresi alan ve "Hello, [name]" yazdıran bir fonksiyon tanımlanmıştır:

const sayHello = (name) => {
  console.log(`Hello, ${name}`);
}

Bu kod, eski JavaScript sürümlerinde şöyle yazılabilirdi:

const sayHello = function(name) {
  console.log(`Hello, ${name}`);
}

Arrow fonksiyonlar, kodların okunması ve yazılması açısından daha anlaşılır ve kolay hale getirir. Ayrıca, this anahtar kelimesi için de kolay kullanım sağlar. Bu nedenle, modern JavaScript geliştirmelerinde sıklıkla kullanılmaktadır.

Array Methods

Modern JavaScript ile birlikte, birçok yeni ve kullanışlı array methodları ortaya çıkmıştır. Bu methodlar, array işlemlerini daha kolay ve hızlı hale getirir. Aşağıda, en yaygın kullanılan bazı array methodlarının örnekleri verilmektedir:

map() : Bu method, array içindeki her eleman için belirli bir işlem yapar. Örneğin, aşağıdaki örnekte, array içindeki sayıların karesini alan bir fonksiyon tanımlanmıştır:
```
const numbers = [1, 2, 3, 4, 5];
const squares = numbers.map(x => x * x);
console.log(squares); // [1, 4, 9, 16, 25]
```
filter() : Bu method, array içinde belirli kriterlere uyan elemanları seçer. Örneğin, aşağıdaki örnekte, array içindeki çift sayıları seçen bir fonksiyon tanımlanmıştır:
```
const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
const evenNumbers = numbers.filter(x => x % 2 === 0);
console.log(evenNumbers); // [2, 4, 6, 8, 10]
```
reduce() : Bu method, array içindeki elemanları tek bir değere dönüştürür. Örneğin, aşağıdaki örnekte, array içindeki sayıların toplamını alan bir fonksiyon tanımlanmıştır:
```
const numbers = [1, 2, 3, 4, 5];
const sum = numbers.reduce((acc, x) => acc + x, 0);
console.log(sum); // 15
```
find() : Bu method, array içinde ilk kriterlere uyan elemanı döndürür. Örneğin, aşağıdaki örnekte, array içinde ilk çift sayıyı döndüren bir fonksiyon tanımlanmıştır:
```
const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
const firstEvenNumber = numbers.find(x => x % 2 === 0);
console.log(firstEvenNumber); // 2
```
some() : Bu method, array içinde belirli bir kriterle uyan eleman var mı yok mu kontrol eder. Örneğin, aşağıdaki örnekte, array içinde 10'dan yüksek bir sayı var mı kontrol eden bir fonksiyon tanımlanmıştır:
```
const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
const isBigNumberExist = numbers.some(x => x > 10);
console.log(isBigNumberExist); // false
```
every() : Bu method, array içindeki tüm elemanların belirli bir kriterle uyup uymadığını kontrol eder. Örneğin, aşağıdaki örnekte, array içindeki tüm sayıların çift olup olmadığını kontrol eden bir fonksiyon tanımlanmıştır:
```
const numbers = [2, 4, 6, 8, 10];
const isAllEven = numbers.every(x => x % 2 === 0);
console.log(isAllEven); // true
```

Bu örnekler, modern JavaScript ile gelen array methodlarının nasıl kullanılabileceğini göstermektedir. Bu methodlar, array işlemlerini daha kolay ve hızlı hale getirir ve kodların daha okunaklı ve anlaşılır olmasını sağlar.

Spread operator

Spread operator, array veya object içindeki elemanların başka bir array veya object içine kopyalanmasını sağlar. Örneğin, aşağıdaki örnekte, bir array içindeki elemanlar başka bir array içine kopyalanmıştır:

const numbers1 = [1, 2, 3];
const numbers2 = [...numbers1, 4, 5, 6];
console.log(numbers2); // [1, 2, 3, 4, 5, 6]

Ayrıca, spread operator ile bir arrayin elemanlarını bir fonksiyona veya metoda parametre olarak geçirmek için kullanılabilir. Örneğin, aşağıdaki örnekte, bir array içindeki elemanlar bir fonksiyonun parametreleri olarak geçirilmiştir:

const numbers = [1, 2, 3];
const add = (x, y, z) => x + y + z;
console.log(add(...numbers)); // 6

Spread operator ile bir objectin içindeki key-value pair'larının başka bir object içine kopyalanmasını sağlar. Örneğin, aşağıdaki örnekte, bir object içindeki key-value pair'lar başka bir object içine kopyalanmıştır:

const obj1 = {name: "John", age: 30};
const obj2 = {...obj1, job: "Developer"};
console.log(obj2); // { name: "John", age: 30, job: "Developer" }

Spread operator ile bir objectin içindeki key-value pair'larının başka bir object içine kopyalanmasını sağlar. Örneğin, aşağıdaki örnekte, obj1 içindeki key-value pair'lar obj2 içine kopyalanmıştır. obj2 içinde aynı key'lere sahip key-value pair'ların üstüne yazılmıştır.

const obj1 = {name: "John", age: 30};
const obj2 = {name: "Mike", job: "Developer", ...obj1};
console.log(obj2); // { name: "John", job: "Developer", age: 30 }

Spread operator, array ve object manipülasyonlarını daha kolay hale getirir ve kodların daha okunaklı ve anlaşılır olmasını sağlar. Bu nedenle, modern JavaScript geliştirmelerinde sıklıkla kullanılmaktadır. Ayrıca spread operator, destructuring ile birlikte kullanıldığında daha da güçlü hale gelir. Örneğin, aşağıdaki örnekte, bir object içindeki belirli key-value pair'ların destructuring ile çıkarılması ve başka bir object içine kopyalanması işlemi gerçekleştirilmiştir:

const obj = {name: "John", age: 30, job: "Developer"};
const {name, age} = obj;
const newObj = {name, age, location: "New York"};
console.log(newObj); // { name: "John", age: 30, location: "New York" }

Bu örnekler, spread operatorun nasıl kullanılabileceğini ve array ve object manipülasyonlarını nasıl kolaylaştırdığını göstermektedir. Bu nedenle, modern JavaScript geliştirmelerinde sıklıkla kullanılmaktadır.

Destructuring

Modern JavaScript ile birlikte, destructuring özellikle object ve array içindeki verilerin çekilmesi ve kullanılması için çok kullanışlı bir araç haline gelmiştir.

Destructuring, object içindeki belirli key-value pair'ların çekilmesini ve değişkenlere atanmasını sağlar. Örneğin, aşağıdaki örnekte, bir object içindeki "name" ve "age" key'lerinin değerleri değişkenlere atanmıştır:

const obj = {name: "John", age: 30};
const {name, age} = obj;
console.log(name); // "John"
console.log(age); // 30

Ayrıca, destructuring ile object içindeki key'lere değişik isimler verebiliriz. Örneğin, aşağıdaki örnekte, obj içindeki "name" key'inin değeri "firstName" değişkenine atanmıştır.

const obj = {name: "John", age: 30};
const {name: firstName} = obj;
console.log(firstName); // "John"

Destructuring, array içindeki elemanların çekilmesini ve değişkenlere atanmasını sağlar. Örneğin, aşağıdaki örnekte, bir array içindeki ilk ve son elemanlar değişkenlere atanmıştır:

const numbers = [1, 2, 3, 4, 5];
const [first, second, ...rest] = numbers;
console.log(first); // 1
console.log(second); // 2
console.log(rest); // [3, 4, 5]

Destructuring, object ve array içindeki verilerin çekilmesini ve kullanılmasını kolaylaştırır ve kodların daha okunaklı ve anlaşılır olmasını sağlar. Bu nedenle, modern JavaScript geliştirmelerinde sıklıkla kullanılmaktadır.

Ayrıca destructuring ile spread operator birlikte kullanıldığında daha güçlü hale gelir. Örneğin, aşağıdaki örnekte, bir object içindeki belirli key-value pair'ların destructuring ile çıkarılması ve başka bir object içine kopyalanması işlemi gerçekleştirilmiştir:

const obj = {name: "John", age: 30, job: "Developer"};
const {name, age} = obj;
const newObj = {name, age, location: "New York", ...obj};
console.log(newObj); // { name: "John", age: 30, location: "New York", job: "Developer" }

Bu örnekte, obj içindeki "name" ve "age" key-value pair'ları destructuring ile çıkarılmış ve newObj içine kopyalanmıştır. Aynı zamanda spread operator kullanarak obj'nin geri kalan key-value pair'ları da newObj içine kopyalanmıştır. Bu şekilde, object içindeki verilerin çekilmesi ve kullanılması daha kolay hale gelir.

Destructuring ve spread operator, modern JavaScript geliştirmelerinde sıklıkla kullanılmaktadır ve kodların daha okunaklı ve anlaşılır olmasını sağlar. Bu yüzden, bu özelliklerin öğrenilmesi ve uygulanması önerilir.

Maps

Modern JavaScript ile birlikte, Map yapısı özellikle verilerin saklanması ve erişilmesi için çok kullanışlı bir araç haline gelmiştir. Map yapısı, key-value pair'ları saklar ve bu pair'ları hızlı bir şekilde erişebilir.

Map yapısını oluşturmak için new Map() kullanılır. Örneğin, aşağıdaki örnekte, bir Map yapısı oluşturulmuş ve key-value pair'ları eklenmiştir:

const map = new Map();
map.set("name", "John");
map.set("age", 30);
map.set("job", "Developer");

Map yapısındaki verileri erişmek için get() methodu kullanılır. Örneğin, aşağıdaki örnekte, "name" key'inin değeri erişilmiştir:

console.log(map.get("name")); // "John"

Map yapısındaki verileri silmek için delete() methodu kullanılır. Örneğin, aşağıdaki örnekte, "job" key'inin değeri silinmiştir:

map.delete("job");
console.log(map); // Map { 'name' => 'John', 'age' => 30 }

Map yapısındaki verileri iterate etmek için forEach() methodu kullanılır. Örneğin, aşağıdaki örnekte, map içindeki tüm key-value pair'lar yazdırılmıştır:

map.forEach((value, key) => console.log(`${key}: ${value}`));

Map yapısı, verilerin saklanması ve erişilmesi için daha kolay ve hızlı bir yol sunar. Ayrıca, Map yapısı ile key-value pair'ların değerleri değiştirilebilir ve silinebilir. Bu nedenle, modern JavaScript geliştirmelerinde sıklıkla kullanılmaktadır.

Sets

Modern JavaScript ile birlikte, Set yapısı özellikle unique değerlerin saklanması ve erişilmesi için çok kullanışlı bir araç haline gelmiştir. Set yapısı, unique değerleri saklar ve bu değerlere hızlı bir şekilde erişebilir.

Set yapısını oluşturmak için new Set() kullanılır. Örneğin, aşağıdaki örnekte, bir Set yapısı oluşturulmuş ve değerler eklenmiştir:

const set = new Set();
set.add(1);
set.add(2);
set.add(3);
set.add(3); // duplicate value will not be added

Set yapısındaki verileri erişmek için has() methodu kullanılır. Örneğin, aşağıdaki örnekte, 2 değerinin set içinde olup olmadığı kontrol edilmiştir:

console.log(set.has(2)); // true
console.log(set.has(4)); // false

Set yapısındaki verileri silmek için delete() methodu kullanılır. Örneğin, aşağıdaki örnekte, 2 değeri silinmiştir:

set.delete(2);
console.log(set); // Set { 1, 3 }

Set yapısındaki verileri iterate etmek için forEach() methodu kullanılır. Örneğin, aşağıdaki örnekte, set içindeki tüm değerler yazdırılmıştır:

set.forEach(value => console.log(value));

Set yapısı, unique değerlerin saklanması ve erişilmesi için daha kolay ve hızlı bir yol sunar. Ayrıca, Set yapısı ile değerlerin kontrolü ve silinmesi daha kolay hale gelir.

Class

Modern JavaScript ile birlikte, Class yapısı özellikle object-oriented programlama konseptlerinin uygulanması için çok kullanışlı bir araç haline gelmiştir. Class yapısı, object'lerin oluşturulması, inheritance ve polymorphism gibi temel OOP konseptlerini destekler.

Class yapısını oluşturmak için class anahtar kelimesi kullanılır. Örneğin, aşağıdaki örnekte, "Person" sınıfı oluşturulmuş ve "name" ve "age" değişkenleri tanımlanmıştır:

class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }
}

Class yapısından object'ler oluşturmak için new anahtar kelimesi kullanılır. Örneğin, aşağıdaki örnekte, "Person" sınıfından "john" isimli bir object oluşturulmuştur:

const john = new Person("John", 30);
console.log(john.name); // "John"
console.log(john.age); // 30

Class yapısı içinde methodlar tanımlanabilir. Örneğin, aşağıdaki örnekte, "Person" sınıfına "greet" methodu eklenmiştir:

class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }
  greet() {
    console.log(`Hello, my name is ${this.name}`);
  }
}
const john = new Person("John", 30);
john.greet(); // "Hello, my name is John"

Class yapısı, object-oriented programlama konseptlerinin uygulanmasını kolaylaştırır. Ayrıca, inheritance ve polymorphism gibi temel OOP konseptlerini destekler. Bu nedenle, modern JavaScript geliştirmelerinde sıklıkla kullanılmaktadır.

Modern JavaScript, sürekli gelişen ve evrim geçiren bir dildir. Bu saydıklarımız şu an için kullanılan özelliklerdir.