Bu eğitimde, örnekler yardımıyla JavaScript ES6 hakkında bilgi edineceksiniz.
JavaScript ES6 ( ECMAScript 2015 veya ECMAScript 6 olarak da bilinir ), 2015 yılında piyasaya sürülen JavaScript'in daha yeni sürümüdür.
ECMAScript, JavaScript programlama dilinin kullandığı standarttır. ECMAScript, JavaScript programlama dilinin nasıl çalışması gerektiğine dair spesifikasyon sağlar.
Bu eğitim, ES6'da hızlı bir şekilde başlayabilmeniz için ES6'nın yaygın olarak kullanılan özelliklerinin kısa bir özetini sağlar.
JavaScript izni
JavaScript let, değişkenleri bildirmek için kullanılır. Önceden, değişkenler varanahtar kelime kullanılarak bildiriliyordu .
Arasındaki farkla ilgili daha fazla bilgi edinmek letve varJavaScript var vs izin ziyaret edin.
Kullanılarak bildirilen değişkenler letşunlardır blok-kapsamlı . Bu, yalnızca belirli bir blok içinde erişilebilir oldukları anlamına gelir. Örneğin,
// variable declared using let let name = 'Sara'; ( // can be accessed only inside let name = 'Peter'; console.log(name); // Peter ) console.log(name); // Sara
JavaScript sabiti
constİfadesi JavaScript sabitleri bildirmek için kullanılır. Örneğin,
// name declared with const cannot be changed const name = 'Sara';
Bir kez bildirildikten sonra, bir constdeğişkenin değerini değiştiremezsiniz .
JavaScript Ok Fonksiyonu
In ES6 sürümü, işlevin ifadeler oluşturmak için işlevler ok kullanabilirsiniz. Örneğin,
Bu işlev
// function expression let x = function(x, y) ( return x * y; )
olarak yazılabilir
// function expression using arrow function let x = (x, y) => x * y;
Ok işlevleri hakkında daha fazla bilgi edinmek için JavaScript Ok İşlevini ziyaret edin.
JavaScript Sınıfları
JavaScript sınıfı, bir nesne oluşturmak için kullanılır. Sınıf, bir yapıcı işleve benzer. Örneğin,
class Person ( constructor(name) ( this.name = name; ) )
Anahtar kelime class, bir sınıf oluşturmak için kullanılır. Özellikler bir yapıcı işlevinde atanır.
Artık bir nesne oluşturabilirsiniz. Örneğin,
class Person ( constructor(name) ( this.name = name; ) ) const person1 = new Person('John'); console.log(person1.name); // John
Sınıflar hakkında daha fazla bilgi edinmek için JavaScript Derslerini ziyaret edin.
Varsayılan Parametre Değerleri
ES6 versiyonunda, varsayılan değerleri fonksiyon parametrelerinde geçirebilirsiniz. Örneğin,
function sum(x, y = 5) ( // take sum // the value of y is 5 if not passed console.log(x + y); ) sum(5); // 10 sum(5, 15); // 20
Yukarıdaki örnekte, parametreyi için iletmezseniz, varsayılan olarak 5y alır . Varsayılan parametreler hakkında daha fazla bilgi edinmek için JavaScript İşlev Varsayılan Parametreleri sayfasını ziyaret edin.
JavaScript Şablon Değişkenleri
Şablon değişmezi, değişkenleri bir dizeye dahil etmeyi kolaylaştırdı. Örneğin, yapmanız gerekmeden önce:
const first_name = "Jack"; const last_name = "Sparrow"; console.log('Hello ' + first_name + ' ' + last_name);
Bu, şablon değişmezi kullanılarak şu şekilde gerçekleştirilebilir:
const first_name = "Jack"; const last_name = "Sparrow"; console.log(`Hello $(first_name) $(last_name)`);
Şablon değişmezleri hakkında daha fazla bilgi edinmek için JavaScript Şablon Değişkeni sayfasını ziyaret edin.
JavaScript Destructuring
Yıkıcı sözdizimi, yeni bir değişkene değer atamayı kolaylaştırır. Örneğin,
// before you would do something like this const person = ( name: 'Sara', age: 25, gender: 'female' ) let name = person.name; let age = person.age; let gender = person.gender; console.log(name); // Sara console.log(age); // 25 console.log(gender); // female
ES6 Destructuring sözdizimini kullanarak yukarıdaki kod şu şekilde yazılabilir:
const person = ( name: 'Sara', age: 25, gender: 'female' ) let ( name, age, gender ) = person; console.log(name); // Sara console.log(age); // 25 console.log(gender); // female
İmha etme hakkında daha fazla bilgi edinmek için JavaScript Destructuring'i ziyaret edin.
JavaScript içe ve dışa aktarma
Bir işlevi veya programı dışa aktarabilir ve içeri aktararak başka bir programda kullanabilirsiniz. Bu, yeniden kullanılabilir bileşenlerin yapılmasına yardımcı olur. Örneğin, contact.js ve home.js adlı iki JavaScript dosyanız varsa.
Contact.js dosyasında, şunları yapabilirsiniz dışacontact() fonksiyonu:
// export export default function contact(name, age) ( console.log(`The name is $(name). And age is $(age).`); )
Daha sonra contact()işlevi başka bir dosyada kullanmak istediğinizde, işlevi kolayca içe aktarabilirsiniz. Örneğin, home.js dosyasında:
import contact from './contact.js'; contact('Sara', 25); // The name is Sara. And age is 25
JavaScript Sözleri
Sözler, zaman uyumsuz görevleri yerine getirmek için kullanılır. Örneğin,
// returns a promise let countValue = new Promise(function (resolve, reject) ( reject('Promise rejected'); )); // executes when promise is resolved successfully countValue.then( function successValue(result) ( console.log(result); // Promise resolved ), )
Sözler hakkında daha fazla bilgi edinmek için JavaScript Promises'i ziyaret edin.
JavaScript Rest Parametresi ve Yayılma Operatörü
Bir dizi olarak sınırsız sayıda bağımsız değişkeni temsil etmek için rest parametresini kullanabilirsiniz . Örneğin,
function show(a, b,… args) ( console.log(a); // one console.log(b); // two console.log(args); // ("three", "four", "five", "six") ) show('one', 'two', 'three', 'four', 'five', 'six')
… Sözdizimini kullanarak kalan bağımsız değişkenleri iletirsiniz . Bu nedenle, ad rest parametresi .
Öğeleri tek bir diziye kopyalamak için yayılma sözdizimini … kullanırsınız. Örneğin,
let arr1 = ('one', 'two'); let arr2 = (… arr1, 'three', 'four', 'five'); console.log(arr2); // ("one", "two", "three", "four", "five")
Hem rest parametresi hem de yayılma operatörü aynı sözdizimini kullanır. Ancak, yayılma operatörü dizilerle (yinelenebilir değerler) kullanılır.
Yayılma operatörü hakkında daha fazla bilgi edinmek için JavaScript Yayılma Operatörü'nü ziyaret edin.
