Ek

Prototip devralma

null ve undefined hariç her temel veri türünün bir prototype, düzgün şekilde işleme yöntemleri sağlayan ve karşılık gelen nesne sarmalayıcı değer katar. Bir temel öğede bir yöntem veya özellik arama çağrıldığında, JavaScript, arka planda ilk bileşeni sarmalar ve özellik aramasını sarmalayıcı nesnesinde gerçekleştirir.

Örneğin, bir dize değişmez değerinin kendi yöntemi yoktur, ancak Karşılık gelen String nesnesi sayesinde .toUpperCase() yöntemi sarmalayıcı:

"this is a string literal".toUpperCase();
> THIS IS A STRING LITERAL

Buna prototip devralma (özellik ve yöntemlerin devralınması) denir. oluşturabilirsiniz.

Number.prototype
> Number { 0 }
>  constructor: function Number()
>  toExponential: function toExponential()
>  toFixed: function toFixed()
>  toLocaleString: function toLocaleString()
>  toPrecision: function toPrecision()
>  toString: function toString()
>  valueOf: function valueOf()
>  <prototype>: Object { … }

Yalnızca tanımlamak yerine bu oluşturucuları kullanarak temel öğeler oluşturabilirsiniz değerlerine göre sıralayabilirsiniz. Örneğin, String oluşturucusu kullanıldığında dize nesnesi, bir dize sabit değeri değil: yalnızca dizemizi içermeyen bir nesne değeri ancak kurucunun devralınan tüm özellikleri ve yöntemleridir.

const myString = new String( "I'm a string." );

myString;
> String { "I'm a string." }

typeof myString;
> "object"

myString.valueOf();
> "I'm a string."

Çoğunlukla, sonuç olarak elde edilen nesneler, daha iyi performans göstermek için tanımlamanız gerekir. Örneğin, new Number oluşturucusu, tüm yöntemleri içeren bir nesneyle sonuçlanır ve özellikleri kullanmak için Number prototipini ayarlamak üzere bu nesneleri tamsayılarda vardığınız gibi kullanabilirsiniz:

const numberOne = new Number(1);
const numberTwo = new Number(2);

numberOne;
> Number { 1 }

typeof numberOne;
> "object"

numberTwo;
> Number { 2 }

typeof numberTwo;
> "object"

numberOne + numberTwo;
> 3

JavaScript'in yerleşik olarak bulunduğu için bu oluşturuculara prototip kalıtım ise hiçbir pratik fayda sağlamaz. Oluşturuluyor oluşturucuları kullanan temel öğeler de beklenmedik sonuçlara yol açabilir, çünkü sonuç basit bir değişmez değer değil, nesnedir:

let stringLiteral = "String literal."

typeof stringLiteral;
> "string"

let stringObject = new String( "String object." );

stringObject
> "object"

Bu, katı karşılaştırma operatörlerinin kullanımını karmaşık hale getirebilir:

const myStringLiteral = "My string";
const myStringObject = new String( "My string" );

myStringLiteral === "My string";
> true

myStringObject === "My string";
> false

Otomatik noktalı virgül ekleme (ASI)

JavaScript yorumcuları, bir komut dosyasını ayrıştırırken atlanan örnekleri düzeltmeye çalışmak için otomatik noktalı virgül ekleme (ASI) noktalı virgül. JavaScript ayrıştırıcı, izin verilmeyen bir jetonla karşılaşırsa olası söz dizimi hatasını düzeltmek için jetondan önce bir noktalı virgül eklemeye çalışır. aşağıdaki koşullardan biri veya daha fazlası geçerli olduğu sürece:

  • Bu jeton, önceki jetondan bir satır sonuyla ayrılır.
  • Jeton }.
  • Önceki jeton ) ve eklenen noktalı virgül son nokta olur do...while ifadesinin noktalı virgülü.

Daha fazla bilgi için ASI kurallarına bakın.

Örneğin, aşağıdaki ifadelerden sonra noktalı virgüllerin atlanması, söz dizimi hatası:

const myVariable = 2
myVariable + 3
> 5

Ancak ASI, aynı satırdaki birden fazla ifadeyi hesaba katamaz. Şu durumda: aynı satıra birden fazla ifade yazacağınızdan emin olun. Bunları noktalı virgüller:

const myVariable = 2 myVariable + 3
> Uncaught SyntaxError: unexpected token: identifier

const myVariable = 2; myVariable + 3;
> 5

ASI, oluşturulan bir tür söz dizimsel esneklik değil, hata düzeltme girişimidir. JavaScript'e aktarıldığından emin olun. Fazlalıklardan kaçınmanız için uygun yerlerde noktalı virgül kullanın. kod yazmanızı ister.

Yüksek güvenlik modu

JavaScript'in nasıl yazıldığını belirleyen standartlar zaman içinde çok daha Dilin ilk tasarımında düşünülen her şey. JavaScript'in beklenen davranışı, eski web sitelerinde hatalara neden olmamalıdır.

ES5, herhangi bir güncelleme olmadan JavaScript anlamları ile ilgili "katı modu"nu kullanıma sunarak mevcut uygulamaları kırma, iletişim kurmanın bir komut dosyasının tamamı veya bir programlama dili için daha kısıtlayıcı bir dil bağımsız işlev. Yüksek düzey modunu etkinleştirmek için düz dize değerini kullanın "use strict" ve ardından noktalı virgül gelir. işlev:

"use strict";
function myFunction() {
  "use strict";
}

Yüksek düzey modu, bazı "güvenli olmayan" durumları engeller eylemler veya desteği sonlandırılmış özellikler, yaygın "sessiz" ifadesinin yerine açıkça görünen hatalar olduğunu ve bunların çakışmalarını önleyen söz dizimleri içerir. Örneğin, ekip üyeleri değişken kapsam çerçevesinde tasarım kararları geliştiricilerin yanlışlıkla "kirliliğe" neden olma olasılığını global kapsamı bağlamdan bağımsız olarak bir değişken tanımlamak, var anahtar kelime:

(function() {
  mySloppyGlobal = true;
}());

mySloppyGlobal;
> true

Modern JavaScript çalışma zamanları, (bilerek veya isteyerek) bir web sitesini bozamaz. Bunun yerine, modern JavaScript, geliştiricilerin katı kurallı yüksek düzey modu varsayılan olarak yalnızca şu durumlarda etkinleştirin: eski uygulamaları bozmayacakları yeni dil özellikleri:

(function() {
    "use strict";
    mySloppyGlobal = true;
}());
> Uncaught ReferenceError: assignment to undeclared variable mySloppyGlobal

"use strict" öğesini dize değişmez değeri. Şablon değişmez değeri (use strict) çalışmaz. Herhangi bir tarihten önce "use strict" belirtilen bağlamda yürütülebilir bir kod yazmaktır. Aksi takdirde, çevirmen bunu yoksayar.

(function() {
    "use strict";
    let myVariable = "String.";
    console.log( myVariable );
    sloppyGlobal = true;
}());
> "String."
> Uncaught ReferenceError: assignment to undeclared variable sloppyGlobal

(function() {
    let myVariable = "String.";
    "use strict";
    console.log( myVariable );
    sloppyGlobal = true;
}());
> "String." // Because there was code prior to "use strict", this variable still pollutes the global scope

Referansa göre, değere göre

Bir nesnenin özellikleri dahil olmak üzere, işlev parametrelerini ve dizi, set veya harita, temel bir öğe içerebilir veya referans değeri kullanabilirsiniz.

Bir değişkenden diğerine temel bir değer atandığında, JavaScript motor, bu değerin bir kopyasını oluşturur ve bunu değişkene atar.

Bir yeni bir kopyasını oluşturmak yerine değişkene ait bir nesnenin bellekte depolanan konumuna dönüştürülür. Bu nedenle, bir değişkenin başvuruda bulunduğu bir nesne yalnızca değil, başvurulan nesneyi söz konusu değişkenin içerdiği bir değerdir. Örneğin, değişkenini nesne referansı içeren bir değişkenle değiştirin, daha sonra değişkenine değer eklendiğinde, özellik ve değeri eklenir. orijinal nesneye geri yükleyin:

const myObject = {};
const myObjectReference = myObject;

myObjectReference.myProperty = true;

myObject;
> Object { myProperty: true }

Bu, yalnızca nesneleri değiştirmek için değil, aynı zamanda katı kurallı performanslar için de kesin bir eşitlik sağlamak için her iki değişkeni de true olarak değerlendirmek için aynı nesneye başvuruda bulunun. Referans gösteremezler farklı nesneler (bu nesneler yapısal olarak aynı olsa bile):

const myObject = {};
const myReferencedObject = myObject;
const myNewObject = {};

myObject === myNewObject;
> false

myObject === myReferencedObject;
> true

Bellek ayırma

JavaScript otomatik bellek yönetimi kullanır. Bu da, belleğin geliştirme sürecinde açıkça tahsis edilmemeli veya tahsis edilmemelidir. Bu sırada JavaScript motorlarının ayrıntılarını veya hafıza yönetimi yaklaşımlarının belleğin nasıl ayrıldığını anlamak, bu modülün kapsamında referans değerlerle çalışma hakkında bilgi edineceksiniz.

İki "alan" vardır bellekte: "yığın" "yığın"tan oluşur. Yığın mağazalar ilkel değerler ve nesne referansları gibi statik veriler içerir. Çünkü Bu verileri saklamak için gereken sabit bir alan, komut dosyası yürütülür. Yığın, dinamik olarak ayrılmış alan gerektiren nesneleri depolar çünkü yürütme sırasında boyutları değişebilir. Bellek, bir işlem tarafından serbest bırakılır "çöp toplama” adı verilen Bu işlem, referansı olmayan nesneleri yer alır.

Ana iş parçacığı

JavaScript, temelde tek iş parçacıklı bir dildir ve "eşzamanlı" yürütme modelidir, yani yalnızca bir görev yürütebilir. oluşturabilirsiniz. Bu sıralı yürütme bağlamı, ana iş parçacığı olarak adlandırılır.

Ana iş parçacığı HTML ayrıştırma gibi diğer tarayıcı görevleri tarafından paylaşılır. sayfanın bölümlerini oluşturup yeniden oluşturma, CSS animasyonlarını çalıştırma ve e-posta yönlendirme gibi basit işlemlerden (ör. metin vurgulama) karmaşık (form öğeleriyle etkileşim gibi) Tarayıcı satıcıları bulundu ana iş parçacığı tarafından gerçekleştirilen ancak daha karmaşık olan görevleri optimize etmenin yollarını komut dosyaları, ana iş parçacığının kaynaklarının çok büyük bir kısmını kullanmaya devam edebilir ve sayfa performansı.

Bazı görevler Web Çalışanları adı verilen arka plan ileti dizileri, bazı kısıtlamalara tabidir:

  • Çalışma iş parçacıkları yalnızca bağımsız JavaScript dosyaları üzerinde işlem yapabilir.
  • Tarayıcı penceresine ve kullanıcı arayüzüne erişim önemli ölçüde azalır veya hiç yoktur.
  • Bunların, ana ileti dizisiyle iletişim kurma konusunda kısıtlı bilgi vardır.

Bu kısıtlamalar onları belirli bir noktaya odaklanan, yoğun kaynak gerektiren görevler için ana iş parçacığını işgal edebilir.

Çağrı yığını

"Yürütme bağlamlarını" yönetmek için kullanılan veri yapısı; çalıştırılan kod çağrı yığını adı verilen bir listedir (genellikle yalnızca "grup"). Bir komut dosyası ilk kez yürütüldüğünde, JavaScript yorumlayıcısı "global yürütme bağlamı" oluşturur çağrı yığınına gönderir ve deyimler yukarıdan aşağıya doğru tek tek yürütülen, tıklayın. Çevirmen, bir "işlev yürütme bağlamı" sağlar Arkadaş Bitkiler projesine yığının üstünde, genel yürütme bağlamını duraklatır ve işlevi yürütür daha yakından inceleyeceğiz.

Bir işlev her çağrıldığında, o çağrıya ait işlev yürütme bağlamı mevcut yürütme bağlamının hemen üzerinde, yığının en üstüne aktarıldı. Çağrı yığını "ilk gelen, ilk çıkar" prensibiyle çalışır yani en önemlisinin Yığındaki en yüksek olan son işlev çağrısı yürütülür ve devam eder sorun çözülene kadar bekleyin. Bu fonksiyon tamamlandığında çevirmen, işlevi kaldırır. bu işlev çağrısını içeren yürütme bağlamı, tekrar yığındaki en yüksek öğe haline gelir ve yürütmeye devam eder.

Bu yürütme bağlamları, yürütülmesi için gereken tüm değerleri yakalar. Onlar aynı zamanda da işlevini yerine getirir ve kullanıcının bağlamına göre İşlev bağlamında this anahtar kelimesi.

Etkinlik döngüsü ve geri çağırma sırası

Bu sıralı yürütme, geri çağırma içeren eşzamansız görevlerin sunucudan veri getirme, kullanıcı etkileşimine yanıt verme ve veya setTimeout ya da setInterval ile ayarlanmış zamanlayıcıların beklenmesi ya da beklenmedik bir şekilde geri çağırma işlevinin yürütme bağlamı olduğu andaki mevcut yürütme bağlamı emin olun. Bu sorunu çözmek için JavaScript, eşzamansız görevleri yönetir etkinliğe dayalı bir "eşzamanlılık modeli" kullanarak "etkinlik döngüsünden" ve "geri çağırma sırası" (bazen "ileti sırası" olarak da adlandırılır).

Ana iş parçacığında eşzamansız bir görev yürütüldüğünde geri çağırma, işlevin yürütme bağlamı, çağrı yığını. Olay döngüsü, bazen reactor, çağrı yığınının ve geri arama sırasının durumunu yoklar. Programda geri çağırma sırası ve etkinlik döngüsü, çağrı yığınının boş olduğunu belirler geri çağırma kuyruğundaki görevler, yüklenerek yürütüldü.