JavaScript Ok İşlevleri Sizi Daha İyi Bir Geliştirici Yapabilir

JavaScript Ok İşlevleri Sizi Daha İyi Bir Geliştirici Yapabilir

JavaScript ES6, web geliştirme dünyasına heyecan verici değişiklikler getirdi. JavaScript diline yapılan yeni eklemeler yeni olanaklar getirdi.





En popüler değişikliklerden biri, JavaScript'e ok işlevlerinin eklenmesiydi. Ok işlevleri, JavaScript işlev ifadeleri yazmanın yeni bir yoludur ve size uygulamanızda işlevler oluşturmanız için iki farklı yol sunar.



Geleneksel JavaScript işlevleri konusunda uzmansanız, ok işlevleri biraz ayarlama gerektirir. Bunların ne olduğuna, nasıl çalıştıklarına ve size nasıl fayda sağladığına bir göz atalım.





JavaScript Ok İşlevleri Nelerdir?

Ok işlevleri, önceden tanımlanmış işlev ifadeleri yazmanın yeni bir yoludur. JavaScript ES6 sürümüne dahil edildi . Biraz farklı kurallarla, kullandığınız JavaScript işlev ifadelerine benzerler.

Ok işlevleri her zaman anonim işlevlerdir, farklı kuralları vardır.



this

, ve geleneksel işlevlerden daha basit bir sözdizimine sahiptir.

google piksel 5 vs samsung s21

Bu işlevler yeni bir ok belirteci kullanır:



=>

Python'da daha önce çalıştıysanız, bu işlevler aşağıdakilere çok benzer: Python Lambda ifadeleri .

Bu işlevlerin sözdizimi, normal işlevlerden biraz daha temizdir. Akılda tutulması gereken birkaç yeni kural var:



  • function anahtar sözcüğü kaldırıldı
  • return anahtar sözcüğü isteğe bağlıdır
  • Kıvırcık parantez isteğe bağlıdır

Üzerinde durulması gereken pek çok küçük değişiklik var, o yüzden fonksiyon ifadelerinin temel bir karşılaştırmasıyla başlayalım.

Ok İşlevleri Nasıl Kullanılır

Ok fonksiyonlarının kullanımı kolaydır. Ok işlevlerini anlamak, geleneksel işlev ifadeleriyle yan yana karşılaştırıldığında daha kolaydır.

İşte iki sayı ekleyen bir fonksiyon ifadesi; ilk önce geleneksel işlev yöntemini kullanarak:

let addnum = function(num1,num2){
return num1 + num2;
};
addnum(1,2);
>>3

İki argüman alan ve toplamı döndüren oldukça basit bir fonksiyondur.

Ok işleviyle değiştirilen ifade:

let addnum = (num1,num2) => { return num1 + num2;};
addnum(1,2);
>>3

Bir ok işlevi kullanıldığında işlev sözdizimi oldukça farklıdır. function anahtar sözcüğü kaldırılır; ok simgesi JavaScript'in bir işlev yazdığınızı bilmesini sağlar.

Kıvrımlı parantezler ve return anahtar sözcüğü hala orada. Bunlar ok işlevleriyle isteğe bağlıdır. İşte aynı işlevin daha da basit bir örneği:

let addnum = (num1,num2) => num1 + num2;

return anahtar sözcüğü ve küme parantezleri artık yok. Geriye kalan, orijinal işlevin neredeyse yarısı kadar olan çok temiz tek satırlık bir işlevdir. Aynı sonucu çok daha az yazılı kodla alırsınız.

Ok işlevleri için daha fazlası var. daha derine inelim, böylece neler yapabileceklerini daha iyi hissedebilirsiniz.

Ok Fonksiyonu Özellikleri

Ok fonksiyonlarının birçok farklı kullanımı ve özelliği vardır.

önbellek bölümünü temizlemek ne işe yarar

Normal Fonksiyonlar

Ok işlevleri bir veya daha fazla bağımsız değişken kullanabilir. İki veya daha fazla argüman kullanıyorsanız, bunları parantez içine almalısınız. Yalnızca bir argümanınız varsa, parantez kullanmanıza gerek yoktur.

let square = x => x * x
square(2);
>>4

Ok işlevleri, bağımsız değişken olmadan kullanılabilir. İşlevinizde herhangi bir argüman kullanmıyorsanız, boş parantez kullanmanız gerekir.

let helloFunction = () => Console.log('Hello reader!');
helloFunction();
>>Hello reader!

Bunun gibi basit işlevler çok daha az kod kullanır. Bir kompleksin ne kadar kolay olduğunu hayal edin JavaScript slayt gösterisi gibi proje işlevleri yazmak için daha basit bir yolunuz olduğunda olur.

Bunu kullanarak

kavramı

this

JavaScript kullanmanın en zor kısmı olma eğilimindedir. Ok fonksiyonları

this

kullanımı daha kolay.

Ok işlevlerini kullandığınızda

this

çevreleyen fonksiyon tarafından tanımlanacaktır. Bu, iç içe işlevler oluşturduğunuzda ve ihtiyaç duyduğunuzda ortaya çıkan sorunlar yaratabilir.

this

ana işlevinize uygulamak için

İşte normal işlevlerle kullanmanız gereken geçici çözümü gösteren popüler bir örnek.

function Person() {
var that = this; //You have to assign 'this' to a new variable
that.age = 0;
setInterval(function growUp() {
that.age++;
}, 1000);
}

değerinin atanması

this

to a değişken, ana işlevinizin içindeki bir işlevi çağırdığınızda onu okunabilir hale getirir. Bu dağınık, işte ok işlevlerini kullanarak bunu yapmanın daha iyi bir yolu.

function Person(){
this.age = 0;
setInterval(() => {
this.age++; // Now you can use 'this' without a new variable declared
}, 1000);
}

İşlevler için harika olsalar da, bir nesnenin içinde yöntemler oluşturmak için kullanılmamalıdırlar. Ok işlevleri, doğru kapsamı kullanmaz

this

.

İşte bir ok işlevi kullanarak bir yöntem oluşturan basit bir nesne. Yöntem azaltmalı soslar çağrıldığında bir tarafından değişken. Bunun yerine, hiç çalışmıyor.

Windows 7 için en iyi multimedya oynatıcı
let pizza = {
toppings: 5,
removeToppings: () => {
this.toppings--;
}
}
//A pizza object with 5 toppings
>pizza
>>{toppings: 5, removeToppings: f}
pizza.removeToppings(); //The method will not do anything to the object
>pizza
>>{toppings: 5, removeToppings: f} //Still has 5 toppings

Dizilerle Çalışmak

Ok işlevlerini kullanarak dizi yöntemleriyle çalışmak için kullanılan kodu basitleştirebilirsiniz. diziler ve dizi yöntemleri JavaScript'in çok önemli parçalarıdır bu yüzden onları çok kullanacaksınız.

gibi bazı yararlı yöntemler vardır. harita Bir dizinin tüm öğelerinde bir işlevi çalıştıran ve yeni diziyi döndüren yöntem.

let myArray = [1,2,3,4];
myArray.map(function(element){
return element + 1;
});
>> [2,3,4,5]

Bu, dizideki her değere bir tane ekleyen oldukça basit bir işlevdir. Bir ok işlevi kullanarak aynı işlevi daha az kodla yazabilirsiniz.

let myArray = [1,2,3,4];
myArray.map(element => {
return element + 1;
});
>> [2,3,4,5]

Artık okumak çok daha kolay.

Nesne Değişmezleri Oluşturma

Ok işlevleri, JavaScript'te nesne değişmezleri oluşturmak için kullanılabilir. Normal işlevler onları oluşturabilir, ancak biraz daha uzundurlar.

let createObject = function createName(first,last) {
return {
first: first,
last: last
};
};

Aynı nesneyi daha az kod kullanarak bir ok işleviyle yapabilirsiniz. Ok gösterimini kullanarak fonksiyon gövdesini parantez içine almanız gerekecektir. İşte ok işlevleriyle geliştirilmiş sözdizimi.

let createArrowObject = (first,last) => ({first:first, last:last});

JavaScript Ok İşlevleri ve Ötesi

Artık JavaScript ok işlevlerinin bir geliştirici olarak hayatınızı kolaylaştırmasının farklı yollarını biliyorsunuz. Sözdizimini kısaltırlar, kullanarak size daha fazla kontrol sağlarlar.

this

, nesnelerin oluşturulmasını kolaylaştırır ve dizi yöntemleriyle çalışmanız için size yeni bir yol sunar.

JavaScript ES6'da diğer birçok özellikle birlikte ok işlevlerinin tanıtılması, JavaScript'in web geliştirmede ne kadar önemli hale geldiğini gösterir. Yine de yapabileceğiniz daha çok şey var.

JavaScript hakkında daha fazla bilgi edinmek ister misiniz? Bu JavaScript çerçevelerini öğrenin. Artı, bizim JavaScript hile sayfası hakkında değerli bilgiler ve daha fazla bilgi sağlar. JavaScript nasıl çalışır? sizi daha iyi bir geliştirici yapabilir.

Paylaş Paylaş Cıvıldamak E-posta 6 Sesli Alternatif: En İyi Ücretsiz veya Ucuz Sesli Kitap Uygulamaları

Sesli kitaplar için ödeme yapmaktan hoşlanmıyorsanız, onları ücretsiz ve yasal olarak dinlemenize izin veren bazı harika uygulamalar burada.

Sonrakini Oku İlgili konular
  • Programlama
  • JavaScript
Yazar hakkında Anthony Grant(40 Makale Yayımlandı)

Anthony Grant, Programlama ve Yazılımı kapsayan serbest çalışan bir yazardır. Programlama, Excel, yazılım ve teknoloji ile uğraşan bir Bilgisayar Bilimi uzmanıdır.

Anthony Grant'dan Daha Fazla

Haber bültenimize abone ol

Teknik ipuçları, incelemeler, ücretsiz e-kitaplar ve özel fırsatlar için bültenimize katılın!

Abone olmak için buraya tıklayın