JavaScript temelleri. Başlangıç ​​Seviyesinden İleri Seviyeye 2. Bölüm JavaScript kursu

Bu, sizi başlangıç ​​seviyesinden ileri seviyeye götürecek JavaScript blog yazısı serisinin ikinci bölümüdür. Bu dizinin sonunda JavaScript'te kodlamaya başlamak için bilmeniz gereken tüm temel bilgileri öğreneceksiniz. Lafı fazla uzatmadan ikinci derse başlayalım.

JavaScript temelleri – içindekiler tablosu:

1. JavaScript temelleri
2. Satır satır yürütme
3. Talimatları bitirmenin iki yolu
4. Yorumlar

Bu blog yazımızda ilk blog yazımızdan kaldığımız yerden devam edeceğiz. Bu aşamada Google Chrome tarayıcınızı ve daha spesifik olarak JavaScript konsolunuzu açık tutmalısınız. Herhangi bir nedenle onları kapattıysanız, tekrar açmak için iyi bir zaman olacaktır. JavaScrip temellerini öğrenmeye başlayalım

Mac kullanıyorsanız, konsolu açmak için klavye kısayolu, Chrome'u açtıktan sonra “option + command + J” tuşlarına basmaktır. Bir Windows cihazı kullanıyorsanız, Chrome'u açtıktan sonra JavaScript Konsolunu açmak için “Control + Shift + J” klavye kısayolunu kullanabilirsiniz. Veya en üstteki menüye gidip Görünüm -> Geliştirici -> JavaScript Konsolu'na da gidebilirsiniz.

JavaScript temelleri

JavaScript, diğer tüm programlama dilleri gibi, bilgisayarlarla iletişim kurmak için kullandığınız bir dildir. Doğal bir dilin dilbilgisi ve düzgün cümleler oluşturmak için bilinen sözcükleri olduğu gibi, programlama dillerinin de bilgisayarla etkili bir şekilde iletişim kurmak için uymanız gereken belirli kuralları vardır.

Örneğin, önceki öğreticide kullandığımız "alert" anahtar sözcüğü gibi belirli kelimeler, kodumuzu çalıştıran JavaScript motoru için belirli şeyler ifade eder, hemen ardından parantez içine koydukları belirli kelimelerle kullanıcıya bir uyarı gösterme anlamı vardır. . Bizim durumumuzda “Merhaba Dünya!” Yazdık. bu yüzden “Merhaba Dünya!” diyen bir uyarı aldık.

JavaScript'te, bilgisayarla doğru kelimeleri ve dilbilgisini kullanarak etkili bir şekilde iletişim kurabilmemiz için bilmemiz gereken başka ayrılmış anahtar kelimeler de vardır. Ayrıca doğal dilde sahip olduğumuz gramer gibi programlama dillerinde de bir gramer vardır. Bu dilbilgisine programlama dillerinde genellikle "sözdizimi" denir ve JavaScript de bunun bir istisnası değildir. Bu nedenle, JavaScript'in temellerini öğrenmeye başladığımızda, JavaScript'te sahip olduğumuz ana anahtar kelimeleri ve dilbilgisini anlamak iyi bir fikirdir. JavaScript hakkında bilmemiz gereken bazı temel şeylere bakalım.

Satır satır yürütme

JavaScript temelleri söz konusu olduğunda, bilmeniz gereken ilk şeylerden biri, yazdığınız kodun yukarıdan aşağıya satır satır yürütüleceğidir. Bu kod yürütme tarzına ayrıca JavaScript'in "yorumlanmış bir programlama dili" olduğu da belirtilmektedir.

Aksine bazı programlama dilleri “derlenmiş programlama dilleri”dir. Derlenmiş dillere bazı örnekler: C, C++, C#, Swift, Java vb. Temel fark, derlenmiş programlama dillerinde yazdığınız tüm kodların “derlenmesi” ve bilgisayar tarafından tek parça halinde çalıştırılmasıdır. Bu nedenle, programınızda nerede hata yaptığınızı tespit etmek daha zor olabileceğinden, derlenmiş bir programlama dili öğrenmeye başlamak daha zor olabilir.

Yorumlanan programlama dillerine bazı örnekler JavaScript, Python, Bash ve Matlab olabilir. Yorumlanmış programlama dillerinde, örneğin noktalı virgülü unutmak veya kodunuzdaki parantezleri eşleştirmemek gibi, hangi satırda hata yaptığınızı görmenin doğal avantajına sahipsiniz. Bu özelliğe sahip olmak bazı uygulamalarda çok farklı olabilir, ancak internet bağlantısı yavaş olan bir web sitesini yüklemeye çalıştığımızda, JavaScript'in her satırının olabildiğince hızlı yürütülmesini tercih edersiniz.

Talimatları bitirmenin iki yolu

Günün sonunda bir bilgisayar programı, bilgisayara verilen bir dizi talimattır. Ama bir program nerede biter, bir sonraki talimat nerede başlar? Bu soruna farklı yaklaşımlar var. JavaScript, noktalı virgül ve parantez olmak üzere iki ana şey kullanır.

Yazdığımız talimatın türüne bağlı olarak, genellikle bir talimat setini sonlandırmak veya paketlemek için birini kullanacağız. Farklı işlevler ve veri türleri için farklı parantez türleri kullanacağız. Örneğin, uyarıda(“Merhaba, Dünya”); daha önce çalıştırdığımız kod, merhaba dünya yazısını çevreleyen parantezler bilgisayara uyarının ne söylemesi gerektiğini söyler ve talimatın sonundaki noktalı virgül bilgisayara bu talimatın burada bittiğini, bir sonraki talimata geçebileceğinizi söyler. Bu, noktayı “.” kullanma şeklimize çok benzer. Cümleleri İngilizce bitirmek için.

Yorumlar

Koda yorum eklemek, programlamanın önemli bir parçasıdır. Yazarken hangi kodu yazdığınızı anlamak kolay olabilir, ancak kodun karmaşıklığına bağlı olarak, altı ay sonra koda geri döndüğünüzde çok az fikriniz olabilir.

Yorum eklemek, yalnızca gelecekteki siz için kodunuzu anlamayı çok daha kolay hale getirmekle kalmaz, aynı zamanda birlikte çalıştığınız herkesin kodu anlamasını da çok kolaylaştırır. Sorunları daha küçük parçalara bölerek çözmek genellikle çok daha kolay olduğundan, birlikte çalıştığınız sorunla ilgili anlayışınızı daha iyi geliştirmenize de yardımcı olabilir. Kodunuzun yorum yapılan kısımları yorumlayıcı tarafından yok sayılır ve yürütülmez.

Yorum eklemenin iki yolu vardır: JavaScipt. İlki, aşağıdaki gibi iki eğik çizgiyle basit bir "tek satır" yorumu eklemektir:

// this is a comment

Bu şekilde, iki eğik çizgiden sonra ne yazarsanız yazın, eğik çizgileri koyduğunuz belirli satırda yok sayılır. Aşağıdaki gibi yorumlarla kaplı birden çok satıra sahip olmak için bunu birçok kez tekrarlayabilirsiniz:

// this is a comment.
// this is another comment.
// you can keep commenting like this.

Yorumları kullanmamızın bir başka nedeni de, kodla deneme yapmak için bir kod parçasını yorumlamaktır. Örneğin, aynı işlevi birden çok şekilde yazabilir ve bireysel performanslarını veya sonuçlarını karşılaştırmak için aynı kodun bir sürümünü yorumlamak isteyebilirsiniz. Bunu da bir örnekle görelim.

Devam edin ve aşağıdaki kodu kopyalayıp Chrome'da açtığınız JavaScript konsolunuza yapıştırın.

// greet user
alert("Hello, User!");
alert("Hi, User!");

Tüm kodu kendiniz yazmak için fazladan pratik yapmak istiyorsanız, bunu da yapabilirsiniz. Konsolda birden fazla kod satırı yazmak hakkında bilmeniz gereken bir şey, bir sonraki satıra çalıştırmadan geçmek için “shift + enter” tuşlarına basarak bunu yapabilirsiniz. Aksi takdirde tek satır kod yazdıktan sonra sadece enter'a basarsanız o kod satırını çalıştıracaktır. Bu örnekte, bu büyük bir sorun değil ve aslında onu satır satır yürütmek de güzel, çünkü bu tarzda da çalışabilecek basit bir örneğimiz var.

Kodu kopyalayıp yapıştırdıktan veya kodu kendiniz yazdıktan sonra devam edin ve kodu çalıştırmak için “enter” tuşuna basın. Sonuç size iki ayrı uyarı vermelidir. Ayrıca uyarıları kapatmak için “Tamam”a tıklayabilirsiniz, bu durumda hiçbir şey yapmazlar çünkü bu basit bir uyarıdır ve görüntülemek istediğimiz mesajı gösterdikten sonra hiçbir şeyi tetiklemez.

Kodu bu şekilde çalıştırdığımızda aynı işlevi iki kez çalıştırmış oluyoruz. Ancak aynı anda yalnızca bir uygulama görmek istiyorsanız ne yapmalısınız? Bu durumda ne yapacağınızı tam olarak biliyorsunuz çünkü bunun hakkında zaten konuştuk. Devam edin ve kodu yapıştırdıktan veya yazdıktan sonra satırlardan birini yorumlayın, böylece yalnızca "Merhaba, Kullanıcı!" idam edilir.

Meydan okumayı tamamladığınızda veya meydan okuma sırasında takılırsanız, aşağıdaki meydan okumanın çözüm kodunu görebilirsiniz. Çözüme bir göz atmadan önce, her zaman kendiniz denemenizi şiddetle tavsiye ederim, çünkü gerçekten pratik yaptığınızda en iyisini öğreneceksiniz. Eğer meydan okumayı başarıyla tamamladıysanız, aşağıdaki gibi bir ekrana bakıyor olmalısınız:

Bir kod satırını yorumladığınızda, önceki yorum satırıyla aynı renge dönüştüğünü unutmayın. Buradaki renk farkı aslında bilgisayarda bir fark yaratmıyor ama kod yazarken oldukça işimize yarayan bir özellik. Bu şekilde, yanlışlıkla bir kod satırını yorumlarsanız, renkler açıkça ortaya çıkacağından çok daha kolaydır.

Kodu yorumlamanın başka bir yolu, eğik çizgi ve yıldız karakterinin kullanılmasıdır. Bu şekilde kodumuzda tek satır veya çok satırlı yorumlar oluşturabiliriz.

/* a single line comment */
/* the commenting starts when we put a forward slash and an asterisk
and the commented areas ends
when we close of the comment with an asterisk and the forward slash
like this */

Artık JavaScript'in temellerini biliyorsunuz. Bir sonraki öğreticide, JavaScript'teki temel veri türleri ile birlikte "değişkenler" adı verilen programlamada son derece yaygın bir kavram göreceğiz.

Yazar: Robert Whitney

BT departmanlarına koçluk yapan JavaScript uzmanı ve eğitmeni. Ana hedefi, başkalarına kodlama yaparken nasıl etkili bir şekilde işbirliği yapacaklarını öğreterek ekip üretkenliğini yükseltmektir.

Tüm gönderileri görüntüle

10 blog gönderisinde Başlangıç ​​Düzeyinden İleri Düzeye JavaScript Kursu:

1. JavaScript'te kodlamaya nasıl başlanır?
2. JavaScript temelleri
3. JavaScript'te değişkenler ve farklı veri türleri
4. Snippet'ler ve kontrol yapıları
5. Döngüler ve döngüler için
6. Java dizisi
7. JavaScript işlevleri
8. JavaScript nesneleri
9. JavaScript yöntemleri ve daha fazlası
10. JavaScript kursunun özeti