Takım Arkadaşlarınızın Sizi Seveceği 7 JavaScript Kod Uygulaması – JSManifest

Takım Arkadaşlarınızın Sizi Seveceği 7 JavaScript Kod Uygulaması – JSManifest

JavaScript, daha önce gördüğümüz hiçbir şeye benzemeyen, eğlenceli ama oldukça etkili bir programlama dilidir. JavaScript dilinin esnek doğası nedeniyle, biz uygulamalarımızın nasıl yapılandırılmasını istediğimiz konusunda özgürlük geliyor.

Günümüzde web uygulamaları oluşturmanın yaygın yolları genellikle React gibi popüler kitaplıklarla ilgilidir. Deneyimli geliştiriciler, birini diğeriyle karşılaştırırken projeniz için hangi aracı kullanacağınız konusunda ipuçları istediğinizde genellikle “sizin için en iyi olanı yapın” diyeceklerdir.

Ne yazık ki bu özgürlük, kendimizi kaptırabileceğimiz ve kod yazmaya alışabileceğimiz başka bir sorunu gündeme getirebilir. kendimiz için çalışan ve diğerleri değil.

İşte ne demek istediğime bir örnek:

if (!_TEST_ && store.env === 'test') {
  if (args._handledCode) {
    const errorCodes = getHandedCode(args._handledCode)
    args.finalResult?.code &&
      errorCodes[0] !== 'all' &&
      !(errorCodes.indexOf(args.finalResult?.code) !== -1) &&
      toast(`${args.finalResult?.code}:${args.finalResult?.error}`, {
        type: 'error',
      })
  }
}

Bu, bir sorunda hata ayıklarken anlamaya çalışmam gereken üretimdeki eski bir kod örneğidir. args yok eden bir nesnedir { apiBufferResult, reqOptions } ancak hangi veri türünden bahsedilmiyor _handledCode öyle mi yoksa olacak mı uygulamayı bir süreliğine kır Bu satırları kaldırırken. Sadece o kodu yazan geliştirici anlar Orada neler oluyor. Bu neden bir sorun, soruyorsun? Çünkü artık bu kodu el değmeden bırakıp bir sonraki geliştiricinin bu kodu yazan yazara ulaşamazsam nasıl olduğum gibi kafasının karışmasını beklemekten başka seçeneğimiz yok!

Bu gönderi, Takım Arkadaşlarınızın Sizi Seveceği 7 JavaScript Kod Uygulamasından fazlasını içerecek. Bu gönderideki ipuçları, şeylerin Ön Uç tarafına daha fazla odaklanan bir Takım Lideri Tam Yığın Mühendisi olarak fikirlerimden ve deneyimlerimden geliyor, bu yüzden sizi temin ederim ki bu ipuçları bir takım arkadaşı olarak daha değerli olmanıza yardımcı olabilir ve onlar iş.

1. İşlevlerinizi belgelemek

Bunu yeterince vurgulamıyorum! İşlevlerini belgeleme alışkanlığına sahip ekip arkadaşlarıyla çalışmayı kesinlikle seviyorum:


matchInArray({
	arr,
	value,
	key,
	key1,
}: {
	arr: {}[]
	value: any
	key: string
	key1: string
}) {
	!u.isArr(arr) && (arr = u.array(arr))
	for (let i = 0; i < arr.length; i++) {
		if (arr[i]?.[key] == value) return arr[i][key1]
	}
}

Burada dikkat edilmesi gereken birkaç şey var. İsim matchInArray Might biraz düşünme ve sağduyu ile yukarıdaki fazladan JSDoc yorumları olmadan geçmek için yeterli olun. Fakat hala emin değiliz. Yukarıda verilen yorumlar, bulduğumuz her türlü gizemi ortadan kaldırıyor. Girdi olarak ne bekleyeceğimizi biliyoruz ve tam görüş üzerinde şu anda ne işleniyor ve ne değil. Başkalarının yapmasına izin veriyorsun kodunuza sahip olun.

Hadi buna yorumlar olmadan bir göz atalım ve neden bu kodla ilgili bir sorunum olabileceğini açıklayacağım:

matchInArray({
	arr,
	value,
	key,
	key1,
}: {
	arr: {}[]
	value: any
	key: string
	key1: string
}) {
	!u.isArr(arr) && (arr = u.array(arr))
	for (let i = 0; i < arr.length; i++) {
		if (arr[i]?.[key] == value) return arr[i][key1]
	}
}

Tamam, en azından bu fonksiyonun dizide eşleşen bir değer bulmayı amaçladığını biliyorum. arr tuşlardan birini kullanın. Ama şunu okuyun: arr[i]?.[key] == value. Bir değerin ne olmasını bekleyebiliriz? arr[i]?.[key]? Başka bir dizi, bir nesne, bir sayı, A’dan Z’ye tam alfabe, herhangi bir şey olabilir.

Diyelim ki bu kodu yazan yazara ulaşılamıyor ve şimdi aynı gün içinde dizileri içeren yeni bir özellik geliştirmemiz gerekiyor. Gerçekleştirmemiz gereken bir görev, bir diziden eşleşen bir ürün kimliği numarası alan bir işleve sahip olmaktır.

tekrar kullanamadığımız için matchInArray çünkü kullanarak bir karşılaştırma yapıyor == (bunun anlamı "5" geri dönücek true numara için 5) ayrı bir fonksiyon oluşturmamız gerekiyor. Yeni görevimiz şu hedefe benzer olduğundan matchInArray başarmaya çalışırsa, yeni işlevimiz büyük olasılıkla benzer bir ada sahip olacaktır. Şimdi benzer görünen iki işlevimiz var. Kodumuzu anlamaya çalışan geliştiriciler, şimdi benzer bir görev için hangi işlevi kullanabilecekleri konusunda bir ikilemle karşı karşıya kalmaktadır.

Hikayeden çıkarılacak ders? Takım arkadaşlarınızın kayalık bir yüzeyde yürümekten kaçınmasına yardımcı olmaya çalışın. Bir sonraki adımı nereye atacakları konusunda endişelenmelerine gerek yok.

2. Aynı kod stilini takip edin

Takım arkadaşlarınız, aynı kodlama stilini izleyen kod değişikliklerini okuduklarında buna bayılacaklar. yükleme prettier bazen yeterli değildir, örneğin bu dizi için otomatik biçimlendirme yapmak daha güzeldir:

const dividedStyleKeys = [
  'position',
  'left',
  'top',
  'right',
  'bottom',
  'width',
  'height',
]

Depoda, hepsinin aynı satırda olmasına izin vermek için daha güzeli devre dışı bırakan kodu görmek yaygınsa, benzer bir şey yapmanız gerektiğine dair bir ipucu olmalıdır:


const dividedStyleKeys = ['position', 'left', 'top', 'right', 'bottom', 'width', 'height']

Bu, 9 satırlık kodu 2’ye düşürür.

3. Birim Testlerinin Oluşturulması

Kodunuz için birim testleri oluşturduğunuzda “resmi”lik oluşturuyorsunuz. Gizemi ortadan kaldırır, kodunuzu doğrular ve çevrenizdeki insanlara güven verir.

Bitmiş bir anlaşma. Kodunuzla ilgili her şeyi ve görevini yerine getirdiğini biliyoruz.

Daha az şüphe olduğunda daha üretken bir geliştirme deneyimi olur.

4. Etkili Sorular Sormak

İki tür soru vardır. Birincisi, sorduğunuz kişiye sessizce sinirlenecek türden.

İşte bir soru yapmaz bir sinir kıvılcımı:

“Bu kodla ilgili google’da bir cevap bulamadım, neden bu kısma ihtiyacımız var?”

Ve işte bir tane niyet:

“Bunun ne yapması gerekiyor ve neden bu kısma ihtiyacımız var?”

İkinci soru kaba, çünkü kendi başınıza çözmek için zaman ayırmadığınızı ve kendinizi güvenilir bir takım arkadaşı olmaktan alıkoyduğunuzu gösteriyor. Tembelliğiniz için başkasının zamanını alıyorsunuz ve yeterince umursamadığınızı gösteriyorsunuz.

Bir zamanlar bunun gibi tonlarca soru soran bir çalışanım vardı ve zamanın %90’ından fazlası (bu yüzdeyi abartmıyorum bile) google arama sonuçlarının ön sayfasında onun sorularına cevap buldum. Bu kişinin lisans diploması vardı ve harika görünen bir özgeçmişi vardı ama sonunda onun iş etiğine uymadı.

Beni yanlış anlama. Soru sorulmasını seviyoruz ama bir google arama sonucunda aramanın ilk 3 dakikasında bulunan türden soruları değil.

JavaScript’tir. bilgi var her yerde.

5. Akıcı Bir Şekilde Besteleme/Yazma İşlevleri

Fonksiyon kompozisyonunda daha iyi olmak zaman ve pratik gerektirdiğinden herkes fonksiyonları zarif bir şekilde oluşturamaz, bu yüzden bu konuda ayrıntılara girmeyeceğiz. Ancak yazma veya adlandırma işlevleri açısından, bir kitap gibi okunacak şekilde yazıldığında, bir takım arkadaşı olarak değeriniz üzerinde inanılmaz derecede etkilidir.

adlı harika bir kitapta bir bölüm var. Functional Light JS hakkında filter o bunu mükemmel bir şekilde açıklıyor.

Örneğin, bir filtre işlevi uygularken. Gerçek hayatta filtrelemeyi düşündüğümüzde, su filtreleme gibi kötü şeyleri filtrelemeyi düşünüyoruz.

Ancak programlamada bazı kavramlar tam tersi şekilde davranır.

6. Hataları Yakalamak

Bir Lider olarak, takım arkadaşlarım benim (veya onların) kodumda bir hatayı benden önce yakalayıp bu konuda konuşmadan bunu sevdiğimi anında onaylayabilirim. Bu, kullanıcıların yanlışlıkla hatayla karşılaşmasını önler ve hepimizin saçlarımızı çekmesi gereken bir hata daha azdır.

Böcekleri kendi başlarına yakalayan, bu konuda konuşan ve o böceğin uçmasına izin vermek için bir dakika daha harcamayan takım arkadaşlarına çok değer veririm.

7. Parametrelerinizi Sıralama

Çoğu zaman, fonksiyonlarınız aşağıdaki gibi olana kadar parametrelerinizin belirli bir sıra olmadan bildirilmesi önemli değildir:

Bunun gibi fonksiyonlarla çalışırken, parametreyi bulmak için yukarı ve aşağı zıplamamız gerekiyor. Gerekli olanların en baştan başladığı yerde sipariş vermek veya bazı vurgular yapmak gibi iyi olacağı bazı durumlar vardır (örneğin Başlık bir blog gönderisiyle veya başka bir şeyle ilgiliyse). Ancak iyi bir sebep yoksa, herkese bir iyilik yapmanızı ve onları sıralamanızı şiddetle tavsiye ederim, aksi takdirde 4. adımdaki kişi gibi olursunuz.

Çözüm

Ve bu yazının sonu burada bitiyor! Umarım bunu değerli bulmuşsunuzdur ve gelecekte daha fazlasını ararsınız!

Bir cevap yazın

E-posta hesabınız yayımlanmayacak.