Hepimizin bildiği gibi, JavaScript hızla değişiyor. Yeni ES2020 ile, kontrol etmek isteyebileceğiniz birçok harika özellik sunulmuştur. Dürüst olmak gerekirse, birçok farklı şekilde kod yazabilirsiniz. Aynı hedefe ulaşabilirler, ancak bazıları daha kısa ve çok daha nettir. Kodunuzu daha temiz ve anlaşılır hale getirmek için bazı küçük püf noktaları kullanabilirsiniz. İşte bir gün size kesinlikle yardımcı olacak JavaScript geliştiricileri için faydalı püf noktalarının bir listesi.

Metot Parametre Doğrulaması

JavaScript, parametreleriniz için varsayılan değerler belirlemenize izin verir. Bunu kullanarak, yöntem parametrelerinizi doğrulamak için düzgün bir hile uygulayabiliriz.

const isRequired = () => {throw new Error('parametre gerekli')};

const print = (num = isRequired()) => {console.log(`yazdırılan ${num}`)};

print(2); // yazdırılan 2

print() // hata: parametre gerekli

print(null) // boş yazdırma

JSON Kodunu Biçimlendir

Şimdiye kadar JSON.stringify ile fazlasıyla haşır neşir olmuşsunuzdur. Peki çıktınızı stringify kullanarak biçimlendirebileceğinizi biliyor musunuz? Aslında oldukça basit.

Stringify yöntemi üç girdi alır. value/değer, replacer/değiştirici ve space/boşluk. Son ikisi isteğe bağlı parametrelerdir. Bu yüzden daha önce kullanmamış olmanı normal. JSON'umuzu girintilemek için boşluk parametresini kullanmalıyız.

console.log(JSON.stringify({name:"Yasin",Age:32},null,'\t'));

>>> 
{
 "name": "Yasin",
 "Age": 32
}

Bir Diziden Benzersiz Değerler Al

Bir diziden benzersiz değerler elde etmek, tekrarlayan değerleri filtrelemek için filter yöntemini kullanmamız gerekiyordu. Ancak yeni Set native nesnesiyle işler gerçekten fazlasıyla kolaylaştı.

let uniqueArray = [... new Set ([1, 2, 3, 3,3, "okul", "okul", 'top', false, false, true, true])];

>>> [1, 2, 3, "okul", "top", false, true]

Dizilerden 'Yanlış' Değerleri Kaldır

Bir diziden hatalı değerleri kaldırmak isteyebileceğiniz durumlar olabilir. Yanlış değerler, JavaScript'te FALSE olarak belirtilen değerlerdir. JavaScript'te 6 yanlış değer vardır ve bunlar,

undefined
empty
NaN
0
"" (Boş dize)
false

Bu hatalı değerleri filtrelemenin en kolay yolu aşağıdaki işlevi kullanmaktır.

myArray
    .filter(Boolean);

Array'de bazı değişiklikler yapmak ve ardından yeni Array'i filtrelemek istiyorsanız, bunun gibi bir şey deneyebilirsiniz. Orijinal myArray'in değişmediğini unutmayın.

myArray
    .map(item => {
        // Değişikliklerinizi yapın ve yeni öğeyi return edin
    })
    .filter(Boolean);

Birden Fazla Object'i/Nesneyi Birleştir

İki veya daha fazla sınıfı birleştirme ihtiyacım olan birkaç durumum oldu ve bu benim temel yaklaşımımdı.

const uye = { 
 adi: 'Yasin ERSOY', 
 cinsiyet: 'Erkek' 
 };
const meslek = { 
 primary: 'Yazılımcı', 
 secondary: 'Web Yazılım' 
 };
const yetenekler = { 
 kodlama: 'Harika', 
 yuzme: 'Ortalama', 
 uyuma: 'Profesyonel' 
 };
const summary = {...uye, ...meslek, ...yetenekler};

Sayı Dizilerini Sırala

JavaScript dizileri yerleşik bir sıralama yöntemiyle birlikte gelir. Bu sıralama yöntemi, dizi öğelerini dizelere dönüştürür ve varsayılan olarak üzerinde sözlüksel bir sıralama gerçekleştirir. Bu, sayı dizilerini sıralarken sorunlara neden olabilir. Dolayısıyla, bu sorunun üstesinden gelmek için basit bir çözüm burada.

[0,10,4,9,123,54,1]. sort((a, b) => a-b);

>>> [0, 1, 4, 9, 10, 54, 123]

Sayı dizisindeki iki öğeyi sıralama yöntemiyle karşılaştırmak için bir işlev sağlıyorsunuz. Bu işlev, doğru çıktıyı almamıza yardımcı olur.

Sağ Tıklamayı Devre Dışı Bırak

Kullanıcılarınızın web sayfanıza sağ tıklamalarını durdurmak isteyebilirsiniz. Bu çok nadir olmakla birlikte, bu özelliğe ihtiyaç duyacağınız birkaç durum olabilir.

<body oncontextmenu="return false">

     <div> </div>

</body>

Bu basit pasaj, kullanıcılarınız için sağ tıklamayı devre dışı bırakır.

Bir Dizideki Son Öğeyi Al

Array/Dizin'in sonundaki öğeyi/öğeleri almak istiyorsanız, slice yöntemini negatif tamsayılarla kullanabilirsiniz.

let dizi = [0, 1, 2, 3, 4, 5, 6, 7]

console.log (dizi.slice(-1));

>>> [7]

console.log (dizi.slice(-2));

>>> [6, 7]

console.log (dizi.slice(-3));

>>> [5, 6, 7]

Promise Tamamlanana Kadar Bekle

Promise.all metodunu süreçlerimizi paralel olarak yürütmek için kullanabiliriz

Not: Promise'ler, tek çekirdekli bir CPU'da eşzamanlı olarak çalışacak ve çok çekirdekli CPU'da paralel olarak çalışacaktır. Ana görevi, kendisine verilen tüm süreçler çözülene kadar beklemektir.

const PromiseArray = [
    Promise.resolve(100),
    Promise.reject(null),
    Promise.resolve("başarılı"),
    Promise.reject(new Error('hatalı'))];
Promise.all(PromiseArray)
  .then(data => console.log('bütün süreçler işlendi. süreç sonucu:', data))
  .catch(err => console.log('hata mevcut:', err))

Unutulmaması gereken önemli bir nokta Promise.all, yöntemin vaatlerden biri reddettiğinde bir hata atmasıdır. Bu, kodunuzun tüm sözleriniz tamamlanana kadar beklemeyeceği anlamına gelir.

Reddedilmiş veya çözülmüş olsun olmasın, tüm sözlerinizin tamamlanmasını beklemek isterseniz, Promise.allSettled metodunu kullanabilirsiniz. Bu yöntem, ES2020'nin nihai sürümündedir.

const PromiseArray = [
    Promise.resolve(100),
    Promise.reject(null),
    Promise.resolve("başarılı"),
    Promise.reject(new Error('hatalı'))];
Promise.allSettled(PromiseArray).then(res =>{
console.log(res);
}).catch(err => console.log(err));

>>>
//[
//{status: "fulfilled", value: 100},
//{status: "rejected", reason: null},
//{status: "fulfilled", value: "başarılı"},
//{status: "rejected", reason: Error: hatalı ...}
//]

Ekim 7, 2020