React JS Mülakat Soruları (2022)

Yayınlanan: 2021-09-18

Bir telefon görüşmesinden sonra, nitelikleriniz ve becerileriniz hakkında tipik sorular içeren bir ön görüşme ile yüzleşmek zorunda kalacaksınız. Açık uçlu soruların genel hazırlıklarının yanı sıra teknik soruları nasıl cevaplayacağınızı da bilmelisiniz.

Sorulara özgüven ve karizma ile cevap verseniz bile teknik soruları cevaplarken doğru olmalısınız. Mülakata gelmeden önce hazırlamanız için birkaç teknik soru derledik.

Bunları, bir React JS görüşmesi sırasında bekleyebileceğiniz soru türlerinin örnekleri olarak düşünün.

İçindekiler

S.1) Gerçek DOM ile Sanal DOM arasındaki farkı açıklayın?

Cevap: Sanal DOM daha hızlı güncellenir, ancak HTML'yi doğrudan güncelleyemez. Öğeler güncellenirse JSX'i güncelleyebilir. Belleği boşa harcamak istemiyorsanız mükemmel bir seçenektir ve ayrıca işlenmesi kolaydır.

Öte yandan, Gerçek DOM güncellemeleri daha yavaştır, ancak doğrudan HTML'yi güncelleyebilirler. Ancak, öğe güncellemelerinden oluşturulan DOM'lerin işlenmesi pahalı olduğu için maliyet etkin değildirler. Buna ek olarak, Real DOM ayrıca çok fazla depolama alanı gerektirir.

S.2) 'React'i nasıl tanımlarsınız?

Cevap: Erişim, yeniden kullanılabilir UI bileşenleri oluşturmaya yardımcı olan bileşen tabanlı bir yaklaşımı izleyen Facebook tarafından geliştirilmiştir. Karmaşık mobil kullanıcı arayüzü ve etkileşimli web oluşturmak için kullanılan bir ön uç JavaScrip kitaplığıdır. React, 2015 yılında açık kaynaklıydı ve bugün geniş bir topluluk desteğine sahip.

S.3) React kullanmanın başlıca avantajlarını bize anlatır mısınız?

Cevap: React, bir uygulamanın performansının verimliliğini artırır, ayrıca onu hem istemci hem de sunucu tarafında kullanabilirsiniz. React'te yazılan kodlar JSX sayesinde okunabilir ve UI testleri yazmak sorunsuz hale gelir. React, Angular ve Meteor gibi diğer çerçevelerle kolaylıkla entegre edilebilir.

S.4) React'in üç ana özelliği nedir?

Cevap: React, gerçek DOM yerine Sanal DOM kullanır. Sunucu tarafı oluşturmayı kullanırken veri bağlama veya tek yönlü akışı takip eder,

S.5) React için herhangi bir sınırlama olduğunu düşünüyor musunuz?

Cevap: Evet, başlangıç ​​seviyesindeki bir programcının kavramasının zor olduğunu düşünüyorum ve JSX ve satır içi şablonlama nedeniyle kodlama son derece zor olabilir. Ayrıca, kapsamlı bir çerçeve olduğundan, React'e aşina olmak zaman alır.

S.6) Sanal DOM'yi ve çalışmasını açıklayın.

Cevap: Sanal DOM, gerçek DOM'nin bir kopyasıdır ve hafif bir JavaScript nesnesidir. Tüm öznitelikleri, içerikleri ve öğeleri, özellikleriyle birlikte nesneler olarak listeleyen bir düğüm ağacıdır. React'teki render işlevi, bileşenlerinden bir düğüm ağacı oluşturur. Bir kullanıcı veya sistem birden fazla eylem gerçekleştirdiğinde, veri modelinin mutasyonuna yanıt vermek için ağacı güncellemeye devam eder.

Sanal DOM'nin çalışması üç adımı takip eder:

  1. İlk olarak, verilerde küçük değişiklikler olsa bile tüm kullanıcı arayüzü Sanal DOM temsilinde işlenir.
  2. Bu, hesaplanan yeni ve önceki DOM'nin temsili arasında bir fark yaratır.
  3. Gerçek DOM, yalnızca hesaplamalar bittikten sonra değiştirilen şeylerle güncellenir.

S.7) Bize JSX hakkında bildiklerinizi anlatır mısınız?

Cevap: JSX, javascript'in anlamlılığından yararlanmak için React'in HTML benzeri şablon sözdizimi ile birlikte kullandığı bir dosyadır. Herhangi bir HTML dosyasını kavramayı kolaylaştıran JavaScript SML için bir kısayoldur. JSX, uygulamaların verimliliğini ve performansını artırmak için kullanılır.

S.8) React ve Angular arasındaki farkı açıklayın.

Cevap: React ve Angular arasında, birincisinin yalnızca MVC görünümünü alırken ikincisinin tam MVC görünümünü aldığı mimari gibi birkaç büyük fark vardır. Oluşturma söz konusu olduğunda, Angular'ın istemci tarafı oluşturma özelliği vardır ve React, sunucu tarafı oluşturma ile birlikte çalışır. React, sanal DOM ve tek yönlü veri bağlama kullanır, Angular, İki yönlü veri bağlama ile gerçek DOM kullanır. Angular'daki hata ayıklama, çalışma zamanı hata ayıklamadır, React ise derleme zamanı hata ayıklamasına sahiptir. Son olarak, Google Angular'ı yarattı, oysa React'i oluşturma kredisi Facebook'a gitti.

S.9) Props ile ne demek istiyoruz?

Cevap: Proplar, değişmez veya saf tutulması gereken salt okunur bileşenlerdir ve 'Properties in React'in kısaltmasıdır. Bir uygulamada, tek yönlü veri akışının korunmasına yardımcı olan üst bileşenden alt bileşene gönderilirler. Aksesuarlar ayrıca dinamik olarak oluşturulan verilerin oluşturulmasına da yardımcı olur.

S.10) React'te durumlar nelerdir ve bunları nasıl kullanıyorsunuz?

Cevap: Durumlar, React bileşenlerinin ruhudur, veri kaynağı oldukları için basitleştirilmeleri gerekir. Durumların, bileşenlerin davranışını ve işlemesini belirleyen nesneler olduğu söylenebilir. Durumda değişiklikler yapılabilir, çünkü bunlar değişkendir ve etkileşimli ve dinamik bileşenler oluşturmada etkilidir.

S.11) Durumlar ve aksesuarlar arasındaki temel farklar nelerdir?

Cevap: Props içindeki ana bileşen, bir durumda olamazken değeri değiştirebilir. Ancak, devletin bileşenlerinde değişiklikler var, ancak sahne ile durum böyle değil. Ana bileşene benzer şekilde, alt bileşende de herhangi bir değişiklik yoktur, ancak bunlar props'ta gözlemlenebilir.

S.12) Hal ve sahne arasındaki benzerlikler nelerdir?

Cevap: Devlet ile aksesuarlar arasında temel olarak üç benzerlik vardır.

  1. Her ikisi de ana bileşenden başlangıç ​​değerini alır.
  2. Her iki durumda da bileşenlerin içinde varsayılan değerler belirleyebilirsiniz.
  3. Alt bileşende, başlangıç ​​değerini kolaylıkla ayarlayabilirsiniz.

S.13) Durum bilgisi olan bileşenler nelerdir?

Cevap: Bileşenlerin hafızasındaki durum değişikliği durum bilgisi olan bileşen tarafından saklanır, ayrıca durumu değiştirme ve bir durumda mevcut olan tüm değişikliklerin farkında olma yetkisine sahiptirler. Durum bilgisi olmayan bileşenler, gerekli durum değişikliği hakkında onları bilgilendirdikten sonra sahne öğelerini gönderir.

S.14) Durum bilgisi olmayan bileşenlerden ne anlamalıyız?

Cevap: Bileşenlerin dahili durumu, vatansız bileşenler tarafından hesaplanır ve durum değiştirme yetkisine sahip değildir. Şimdiki, geçmiş ve gelecekteki durum değişikliklerinin bilgisinden yoksundurlar. Son olarak, durum bilgisi olan bileşenler onlara geri arama işlevleri olarak kabul ettikleri aksesuarlar gönderir.

S.15) Sentetik olayları açıklayın.

Cevap: Tarayıcının yerel olayının etrafında tarayıcılar arası sarmalayıcı gibi davranan nesneler sentetik olaylar olarak bilinir. Temel işlevleri, birden çok tarayıcının davranışını birleştirerek bir API oluşturmaktır. Bu, farklı tarayıcılardaki olaylarda tutarlı özellikler sağlar.

S.16) Referanslar nelerdir ve bunları ne zaman kullanmalısınız?

Ans: Ref, React'teki Referanslar anlamına gelir ve belirli bir tepki bileşeninin veya öğesinin referansını saklayan bir niteliktir. Bileşenlerdeki oluşturma yapılandırma işlevi bu referansları döndürür. Önemli bileşenlere yöntemler eklemeye ve DOM ölçümleri almaya yardımcı olurlar. Ayrıca odağı yönetmek, medya oynatmayı veya metni seçmek için referansları kullanabiliriz. Ayrıca, üçüncü taraf DOM kitaplıklarıyla entegrasyona ve zorunlu animasyonları tetiklemeye de yardımcı olurlar.

S.17) Kontrol edilen bileşenler nelerdir?

Cevap: Kontrol bileşenleri durumlarını koruyamaz ve ana bileşen verileri kontrol eder. Ayrıca, aksesuarlar yardımıyla mevcut değerleri elde ederler ve değişiklikleri bildirmek için geri aramaları kullanırlar.

S.18) Kontrol edilmeyen bileşenler hakkında ne biliyorsunuz?

Cevap: Kontrol edilmeyen bileşenler durumlarını korur. Burada DOM, kontrollü bileşenlerin aksine verileri kontrol eder. Ayrıca mevcut değerlerini elde etmek için referansları kullanırlar.

S.19) Redux'un avantajlarını belirtin.

Cevap: Redux aşağıdaki avantajları sunar –

  • Organizasyon : Redux'ta ekip çalışması daha kolay hale gelir çünkü kodun organizasyonu hakkında özeldir ve onu daha tutarlı hale getirir.
  • Test edilmesi kolay : Kod bağımsız ve test edilebilir çünkü izole, küçük ve saf fonksiyonlara sahiptir.
  • Topluluk : Redux, birden fazla uygulama oluştururken kitaplığı geliştirmeye devam eden büyük ve yetenekli bir topluluğun yedeğine sahiptir.
  • Geliştirici araçları : Geliştiricilerin, durum değişikliklerinden eyleme kadar bir uygulamadaki her şeyi izlemesi kolaydır.
  • Sunucu tarafı oluşturma : Redux'da, mağazayı yalnızca istemci tarafına göndermeniz gerekir, bu da uygulamanın performansı yükseldiğinden daha iyi bir kullanıcı deneyimi sağlar.
  • Sürdürülebilirlik : Kodun katı bir yapısı ve öngörülebilir bir sonucu vardır, bu da bakımını kolaylaştırır.
  • Sonuçlarda öngörülebilirlik : Yalnızca bir mağaza kaynağı olduğundan, mevcut durum eyleminin uygulamanın bölümleriyle eşitlenmesi konusunda herhangi bir karışıklık yoktur.

Çözüm

Kalıcı ve kendini adamışsanız, React Js'yi öğrenmek karmaşık değildir. Programlama dilinizi baştan sona öğrendikten sonra, herhangi bir röportajı kolaylıkla çözebilirsiniz. Dili şimdi keşfediyorsanız veya bilginizi derinleştirmek istiyorsanız, Liverpool John Moore Üniversitesi'nden Bilgisayar Bilimleri Yüksek Lisansımıza göz atın. Bu 19 aylık kurs, React, Java, JavaScript, Spring, Hyperledger ve Ethereum gibi en trend araçlardan bazılarını içerir.

Bu kursu tamamladıktan sonra, React hakkında derin bir anlayış kazanacaksınız. Sadece bu değil, Yazılım Geliştirici/Mühendis, Tam Yığın Geliştirici, Blok Zinciri Geliştirici, Bulut Uzmanı/Mimar, Siber Güvenlik Mühendisi, Veri Mühendisi ve DevOps Mühendisi gibi yüksek ücretli roller almaya hak kazanacaksınız.

React öğrenmenin faydaları nelerdir?

Piyasada React JS geliştiricilerine büyük talep var ve bu da iyi bir ücret sağlıyor. Buna ek olarak, geliştiriciler ekipler halinde çalıştığı ve daha az kaynak kullandığı için React JS zamandan ve paradan tasarruf etmenize yardımcı olur.

React'i öğrenmek zor mu?

React'i öğrenmesi nispeten kolaydır, ancak bu kütüphaneyi öğrenmeden önce JS'yi bilmelisiniz. Ancak, React öğrenmeye başlamak için yalnızca temel JavaScript bilgisi gereklidir.

React JS geliştiricileri için temel becerilerden bazıları nelerdir?

React JS geliştiricileri, HTML ve CSS, JavaScript temelleri, JSX, Git, Redux, Node ve NPM hakkında iyi bir anlayışa sahip olmalıdır.