29 En Sık Sorulan AngularJS Mülakat Soruları ve Cevapları [Yeni Başlayanlar ve Deneyimliler İçin]

AngularJS, modern teknoloji sahnesindeki en popüler web çerçevelerinden biridir. AngularJS başlangıçta bir Google projesi olmasına rağmen, daha sonra açık kaynaklı bir çerçeve haline geldi. AngularJS, öncelikle tek sayfalı uygulamalar olmak üzere web uygulamaları oluşturmak ve dinamik hale getirmek için kullanılan, istemci tarafı JavaScript Model-View-Controller çerçevesidir.

AngularJS tamamen HTML ve JavaScript'e dayalı olduğundan, şablon dili olarak HTML kullanmanıza izin verir. Yalnızca statik HTML'yi dinamik HTML'ye dönüştürmekle kalmaz, aynı zamanda yerleşik nitelikler ekleyerek HTML'nin yeteneklerini genişletmeye yardımcı olur. AngularJS, HTML'nin JavaScript kullanarak özel nitelikler oluşturma yeteneğini de genişletir. AngularJS'lerin en iyi yanı, veri bağlama ve bağımlılık ekleme özelliklerinin gereksiz kod yazma ihtiyacını ortadan kaldırmaya yardımcı olmasıdır.

AngularJS'nin popülaritesi o kadar yaygınlaştı ki, endüstride AngularJS becerilerine olan talep hızla artıyor. Ancak, AngularJS becerileri gerektiren bir işe girmek istiyorsanız, önce AngularJS görüşmesini kırmalısınız. AngularJS mülakatında başarılı olmanıza yardımcı olmak için kapsamlı bir AngularJS mülakat soruları ve cevapları listesi oluşturduk.

İşte gidiyor!

En İyi AngularJS Mülakat Soruları ve Cevapları

1. AngularJS nedir? AngularJS'nin temel özellikleri nelerdir?

AngularJS, Google tarafından geliştirilen bir JavaScript çerçevesidir. Dinamik ve genişletilebilir web uygulamaları oluşturmak için kullanılır. Şablon dili olarak HTML ile MVC (Model View Controller) modeline dayanmaktadır. Girişte bahsettiğimiz gibi, AngularJS düz JavaScript ve HTML üzerinde çalışır, bu da onu kullanmak için diğer harici bağımlılıklara güvenmeniz gerekmediği anlamına gelir. AngularJS, JavaScript nesnelerini HTML UI öğeleriyle bağlamaya yardımcı olur.

AngularJS'nin temel özellikleri şunlardır:

• Şablon
• Kapsam
• kontrolör
• Hizmetler
• modeli
• Görünüm
• Bağlanma verileri
• filtreler

Şunlar hakkında daha fazla bilgi edinin: Angular 7.0 – Avatarındaki yenilikler neler?

2. AngularJS'de Kapsamı tanımlayın.

AngularJS'de Scope, uygulama denetleyicisi ile görünüm arasında bir bağlantı görevi gören bir uygulama modelidir. Kapsam, ifadeleri izlemek ve olayları yaymak için tasarlanmıştır. Genellikle kapsamlar, bir uygulamanın DOM (Belge Nesne Modeli) yapısını kopyalayan hiyerarşik bir yapıda düzenlenir. İfadeleri izleyebilir ve olayları yayabilir.

3. AngularJS'de Veri Bağlamayı tanımlayın.

AngularJS'de veri bağlama, model ve görünüm bileşenleri arasındaki verilerin otomatik olarak senkronize edildiği süreci ifade eder. Veri bağlama, görünüm/şablon ve bileşen arasında veri gönderme veya çekme endişesi olmadan etkileşimli uygulamaları tanımlama sürecini basitleştirmeye yardımcı olur. Dört veri bağlama formu vardır:

• Olay bağlama
• Özellik bağlama
• dize enterpolasyonu
• İki yönlü veri bağlama

4. Açısal İfadeyi Tanımlayın. Angular ifadeleri ile JavaScript ifadeleri arasındaki fark nedir?

Açısal ifadeler, bağlamaya yerleştirilen kod parçacıklarıdır (JavaScript'in stiline çok benzer), şöyle:

{{ açısal }}

Açısal ifadeler, uygulama verilerini HTML'ye bağlamaya yardımcı olur.

JavaScript ifadeleri ile Angular ifadeleri arasındaki temel fark şunlardır:

• JavaScript ifadeleri global bir pencereye göre değerlendirilirken, Angular ifadeleri bir kapsam nesnesine göre değerlendirilir.
• Angular ifadelerin değerlendirilmesi boş ve tanımsızları affeder, ancak JavaScript'te tanımsız özellikler genellikle TypeError veya ReferenceError üretir.
• JavaScript'ten farklı olarak, Angular ifadeler döngülerin, koşulların veya istisnaların kullanımına izin vermez.
• AngularJS filtreleri desteklerken, JavaScript desteklemez.

5. AngularJS uygulamalarının geliştirilmesi için kullanılan yaygın IDE'leri adlandırın.

AngularJS için en sık kullanılan IDE'ler (Entegre Geliştirme Ortamı):

• Eclipse – Bu, Java/JavaScript Geliştiricilerinin favori IDE'lerinden biridir. AngularJS eklentilerini destekler.
• Visual Studio – Bu, web uygulamalarını kolay ve hızlı bir şekilde geliştirmek için tasarlanmış bir Microsoft IDE'dir.
• WebStorm – Bu, şüphesiz modern JavaScript geliştirme için en güçlü IDE'lerden biridir. Angular CLI kullanarak bağımlılıkların kolay entegrasyonunu sağlar.
• Aptana – Bu, Eclipse'in açık kaynaklı, özelleştirilmiş bir sürümüdür. Web geliştirme için gereken en son araçlar ve web standartları ile yüklü olarak gelir.
• Sublime Text – Bu, HTML, CSS ve JavaScript için şiddetle tavsiye edilen bir IDE'dir. Doğal olarak, AngularJS ile uyumludur.

Ayrıca kontrol edin: Bir Sonraki Mobil Uygulama Geliştirmeniz İçin AngularJS Doğru Seçim mi?

6. AngularJS'deki Yönergeler nelerdir?

AngularJS'deki yönergeler, "ng" ön ekine sahip genişletilmiş HTML özelliklerinden başka bir şey değildir. AngularJS'nin üç temel yönergesi vardır:

• ng-app – Bu yönergenin amacı, bir Angular uygulamasının kök öğesi olarak düşünülmesi gereken HTML öğesini işaretlemektir. Angular, özel nitelikler için omurga durumunu uygularken, bunları uygulayan ilgili yönergeler için camelCase filtresini kullanır.
• ng-model – Bu yönerge, HTML kontrollerinin (input, select, textarea) değerlerini uygulama verilerine bağlamaya yardımcı olur. Bir ng modelinde, yalnızca görünüme yansıyan Kapsam değil, görünümdeki değişiklikler bile Kapsama yansıtılır.
• ng-bind – Bu yönerge, kalıcı uygulama verilerini HTML görünümüne bağlamak için kullanılır.

7. AngularJS rotalarının amacı nedir?

AngularJS rotalarını kullanmak, bir Angular uygulamasında farklı içerik için farklı URL'ler oluşturmanıza olanak tanır. Bunu yaparak, URL'leri belirli içeriklerine yer imlerine ekleyebilirsiniz ve yer imi eklenen bu tür her bir URL'ye AngularJS'de bir yol adı verilir.

8. AngularJS'de String Interpolation'ı tanımlayın.

AngularJS'de dize enterpolasyonu, bileşen verilerini görüntülemek için {{ }} ayraçları içinde şablon ifadeleri kullanan benzersiz bir sözdizimine atıfta bulunur. Dize enterpolasyonuna genellikle "Bıyık Sözdizimi" denir. Bu sözdizimini kullanırken, önce çift kaşlı ayraç içine JavaScript ifadelerini (yürütülmesi gereken) eklemeniz ve ardından ilgili çıktıyı bir HTML koduna gömmeniz gerekir.

9. AngularJS “Özet Döngüsü”nü tanımlayın.

Özet döngüsü, esas olarak AngularJS'de veri bağlama sürecini ifade eder. Bu süreçte, kapsam model değerlerinin eski ve yeni versiyonları karşılaştırılmış ve karşılaştırılmıştır. Özet döngüsü otomatik olarak tetiklense de, işlemi manuel olarak başlatmak için “$apply()” öğesini de kullanabilirsiniz.

10. Tek Yönlü Ciltleme ile İki Yönlü Ciltleme arasındaki fark nedir?

Tek yönlü bağlama, HTML şablonunu veya görünümünü otomatik olarak güncellemeden modeldeki verileri görüntülemek için bağlamak için kullanılır. Dolayısıyla, bu yaklaşımda, HTML şablonunu güncellemek için özel bir kod yazmalısınız; bu, veriler modelden görünüme her bağlandığında görünümü daha da güncelleyecektir.

Bunun aksine, iki yönlü ciltleme, herhangi bir özel kod yazmanıza gerek kalmadan HTML şablonunu otomatik olarak güncelleyerek, modelden gelen verileri görüntülemeye ve tam tersi şekilde bağlar.

11. Bağlama İşlevini Tanımlayın. Bağlama İşlevlerinin türlerini adlandırın.

Bir bağlantı, canlı bir görüntü oluşturmak için direktifleri bir kapsamla birleştirir. Bağlantı işlevi, DOM dinleyicilerini kaydetmek ve DOM'yi güncellemek için kullanılır. Bu işlev, şablon klonlandıktan hemen sonra yürütülür.

İki tür bağlantı işlevi vardır:

• Ön bağlama işlevi – Bu işlev, alt öğeler bağlanmadan önce yürütülür ve genellikle DOM dönüşümü için güvenli bir yaklaşım değildir.
• Bağlantı sonrası işlevi – Bu işlev, alt öğeler bağlandıktan sonra yürütülür.

12. AngularJS'de Enjektör Nedir?

Enjektör, AngularJS'de bir servis bulucudur. Enjektörün birincil amacı, sağlayıcılar, çağırma yöntemleri, yükleme modülleri ve örnekleme türleri tarafından tanımlanan nesne örneklerini almaktır. Her Angular uygulaması, nesne örneklerini adlarına göre aramaya yardımcı olan bir enjektör içerir.

13. ng-modelinin CSS sınıflarına eklediği farklı stil formlarını adlandırın.

Bir ng-modeli, aşağıdaki stil formlarını CSS sınıflarına ekler:

• ng- geçerli
• ng- geçersiz
• ng-bozulmamış
• ng-kirli

14. Bağımlılık Enjeksiyonu tanımlayın. Bir nesne veya işlev bağımlılıklarına nasıl erişebilir?

Bağımlılık ekleme (DI), kodun bağımlılıklarını nasıl alabileceğini belirleyen bir yazılım tasarım modelidir. Bileşenlerin bir bileşen içinde sabit kodlamak yerine bağımlılıklarına erişmesine izin verir. Bir uygulamaya bir modül yüklendiğinde yapılandırılması gereken öğeleri almak için “config” işlemi DI kullanır.

Bir nesne veya işlev, bağımlılıklarına aşağıdaki yollarla erişebilir:

• Yeni bir operatör kullanılarak bir bağımlılık oluşturulabilir.
• Genel bir değişkene atıfta bulunarak bir bağımlılık aranabilir.

15. AngularJS'de bağımlılık olarak enjekte edilebilecek bileşenleri adlandırın.

AngularJS'de aşağıdaki bileşenleri bağımlılık olarak birbirine enjekte edebilirsiniz:

• Değer
• Hizmet
• Fabrika
• Devamlı
• Sağlayıcı

Bu sorunun yanıtlarını da bulun: Neden tam yığın geliştirici olunur?

16. HTML'nin derleme sürecinde yer alan adımlar nelerdir?

HTML'nin derleme süreci aşağıdaki adımları içerir:

• İlk olarak, HTML, standart tarayıcı API'si kullanılarak DOM'a ayrıştırılır.
• Sonraki adımda, DOM derlemesini gerçekleştirmek için $compile() yöntemine yapılan çağrı kullanılır. Yöntem, yönergeleri eşleştirmek için DOM'yi geçer.
• Son adım, önceki adımdan döndürülen bağlama işlevini çağırarak şablonu bir kapsamla bağlamayı içerir.

17. AngularJS'de Hizmet Nedir?

Hizmetler, belirli görevleri gerçekleştirmek için tasarlanmış JavaScript işlevleridir. Örneğin, $https: işlevi, sunucu verilerini almak için AJAX çağrısı yapmak için kullanılırken, yönlendirme bilgilerini tanımlamak için $route işlevi kullanılır. Belirli görevleri yerine getirebilecek bu tür daha birçok hizmet vardır.

18. AngularJS'de Direktifi tanımlayın. Farklı Direktif türlerini adlandırın.

AngularJS'de yönerge, derleme işlemi sırasında belirli HTML yapılarıyla karşılaşıldığında tetiklenen bir davranış veya işlevdir. Yönergeler, DOM öğeleri üzerindeki işaretlerdir (öğeler, nitelikler, CSS vb. gibi). Bunları, yeni, özel widget'lar gibi davranan özel HTML etiketleri oluşturmak için de kullanabilirsiniz.

Dört temel direktif türü şunlardır:

• Öğe yönergeleri
• Nitelik direktifleri
• Yorum yönergeleri
• CSS sınıf yönergeleri

19. AngularJS'de Annotation ve Decorator arasında ayrım yapın.

Angular'da, ek açıklamalar, bir "açıklama" dizisi oluşturmak için Reflect Metadata kitaplığını kullanan sınıfın tek meta veri kümesidir. Dekoratörler ise bir uygulamanın orijinal kaynak kodunu değiştirmeden bir sınıfın dekorasyonunu veya modifikasyonunu ayırmak için kullanılan tasarım kalıplarıdır.

20. Denetleyicileri tanımlayın.

Denetleyiciler, belirli bir kapsama bağlı JavaScript işlevleridir. Birincil amaçları, HTML kullanıcı arayüzüne veri ve mantık sağlamaktır. Verilerin sunucudan HTML kullanıcı arayüzüne nasıl aktığını kontrol eden AngularJS çerçevesindeki ana aktörlerdir. Ayrıca, denetleyiciler, veriler üzerinde çalışmak ve güncellenmiş model tabanlı verileri görüntülemek için hangi görünümün güncellenmesi gerektiğini belirlemek için işlevler de taşır.

21. AngularJS'de günlükler nasıl tutulur?

Günlükleri korumak için AngularJS'de $log hizmeti kullanılır. $log hizmetinin birincil amacı, aşağıda belirtilen yöntemlerle hata ayıklamaya ve sorun gidermeye yardımcı olmaktır:

• log() – Konsolda bir log mesajı yazmak için kullanılır.
• info()- Bir bilgi mesajı yazmak için kullanılır.
• warn()- Bir uyarı mesajı yazmak için kullanılır.
• error()- Hata mesajı yazmak için kullanılır.
• debug()- Hata ayıklama mesajı yazmak için kullanılır.

22. AngularJS'de $rootscope tanımlayın. Kapsamdan farkı nedir?

AngularJS'de hem $rootscope hem de $scope, genellikle denetleyiciden görüntülemek üzere veri paylaşmak için kullanılan nesnelerdir. Ancak, ikisi oldukça farklıdır. $rootscope ve $scope arasındaki temel fark, birincisinin tüm kontrolörlerde global olarak mevcut olmasına rağmen, $scope'un yalnızca onu oluşturan kontrolörlerde ve alt kontrolörlerinde mevcut olmasıdır.

23. AngularJS'nin desteklediği bazı tarayıcıları adlandırın.

AngularJS tarafından desteklenen tarayıcılardan bazıları şunlardır:

• Mozilla Firefox
• Google Chrome
• Mikrosft Kenar
• IE Mobil
• Safari (iOS)
• 10,11

24. Angular 1.x'te HTML5 modunu nasıl etkinleştirebilirsiniz?

Angular 1.x'te HTML5 modunu etkinleştirmek için aşağıda verilen kodu çalıştırmalısınız:

angular.module('uygulamam', [ ])

.config(function($routeProvider, $locationProvider) {

$routeProvider

.ne zaman('/', {

templateUrl : 'partials/home.html',

denetleyici : mainController

})

// HTML5 Geçmiş API'sini kullanın

$locationProvider.html5Mode(true);

});

25. AngularJS'de yerleşik doğrulayıcıları adlandırın.

AngularJS, girişleri doğrulamak için tüm standart HTML5 özelliklerini destekler. AngularJS'deki yerleşik doğrulayıcılardan bazıları şunlardır:

• Min.
• Maks.
• Gerekli
• Type=”numara” VEYA type="e-posta”

26. AngularJS kullanarak AJAX araması nasıl yapılır?

Sunucudan veri okumak için bir AJAX araması yapmak için AngularJS'deki $https: hizmetini kullanabilirsiniz. AngularJS, verilerin JSON biçiminde olmasını gerektirir. Sunucu, istenen kayıtları almak için bir veritabanı çağrısı oluşturur. Veriler hazır olduğunda, sunucudan verileri almak için $https: hizmeti şu şekilde kullanılabilir:

function StudentController($scope,$https:) {

var url = “veri.txt”;

$https:.get(url).success( function(yanıt) {

$scope.students = yanıt;

});

}

27. AngularJS'de İçselleştirme Nedir?

AngularJS'de uluslararasılaştırma, bir web sitesinde yerel ayara özgü bilgileri göstermek için kullanılan yöntemi ifade eder. Örneğin, Amerika Birleşik Devletleri'nde İngilizce, Fransa'da Danca dilinde içerik gösteren bir web sitesi, bulunduğu yere göre içselleştirilmelidir.

AngularJS, üç tür filtre için yerleşik uluslararasılaştırma desteği sunar:

• Tarih
• sayılar
• Para birimi

28. AngularJS önyükleme işleminin adımlarını açıklayın.

Bir tarayıcıya bir sayfa yüklediğinizde, AngularJS önyükleme işlemi başlar. İlgili adımlar aşağıdaki gibidir:

• HTML belge dosyası tarayıcı tarafından yüklenir ve değerlendirilir. Ardından AngularJS JavaScript dosyası yüklenir ve global bir nesne oluşturulur.
• Bir sonraki adımda, denetleyici işlevlerini kaydetmekten sorumlu JavaScript dosyası yürütülür.
• AngularJS, AngularJS uygulamalarını ve görünümlerini bulmak için HTML'yi tarar. Bir görünüm bulmada başarılı olduğunda, o belirli görünümü ilgili denetleyici işlevine bağlar.
• Son olarak, AngularJS, denetleyici işlevlerini yürütür ve denetleyici tarafından doldurulan modelden gelen verilerle görünümleri işler ve sayfa, kullanıcı tarafından görüntülenmeye hazırdır.

29. AngularJS'de filtreler hangi amaca hizmet eder?

Filtreler, bir ifadenin değerini biçimlendirmek için kullanılır ve aynısını kullanıcıya gösterir. AngularJS'de şablonlara, yönergelere, denetleyicilere ve hizmetlere filtreler eklenir. Ayrıca özel filtreler de oluşturabilirsiniz. Filtreleri kullanarak verileri, veri değeri yalnızca belirli bir kriteri karşıladığında görüntülenecek şekilde düzenleyebilirsiniz. Filtreler, “|” kullanılarak Angular ifadelerine eklenir. karakter ve ardından bir filtre

Çözüm

İşte AngularJS ile buzları kırmanıza yardımcı olacak en sık sorulan 29 AngularJS mülakat sorusu ve yanıtı .

AngularJS, tam yığın geliştirme hakkında daha fazla bilgi edinmek istiyorsanız, upGrad & IIIT-B'nin çalışan profesyoneller için tasarlanmış ve 500+ saatlik zorlu eğitim, 9+ proje ve atamalar, IIIT-B Mezun statüsü, pratik uygulamalı bitirme projeleri ve en iyi firmalarla iş yardımı.

Mutlu öğrenme!