“Var FOO = FOO || {} ”(Bu değişkene bir değişken veya boş bir nesne atayın) Javascript'teki anlamı nedir?

Çevrimiçi bir kaynak koduna baktığımda, birkaç kaynak dosyanın en üstünde buna rastladım.

var FOO = FOO || {};
FOO.Bar = …;

Ama ne olduğu hakkında hiçbir fikrim || {}yok.

{}Eşit olduğunu biliyorum new Object()ve ||"eğer zaten varsa değerini kullan, yeni nesneyi kullan" gibi bir şey için olduğunu düşünüyorum .

Bunu neden bir kaynak dosyanın en üstünde görüyorum?

Niyetine ilişkin tahmininiz || {}oldukça yakın.

Dosyaların en üstünde görüldüğünde bu belirli model, bir ad alanı , yani fonksiyonların ve değişkenlerin genel nesneyi gereksiz yere kirletmeden oluşturulabileceği adlandırılmış bir nesne yaratmak için kullanılır .

Nedeni neden o kullanılan yüzden olduğunu dosyaları iki tane (veya daha fazla) ise:

var MY_NAMESPACE = MY_NAMESPACE || {};
MY_NAMESPACE.func1 = {
}

ve

var MY_NAMESPACE = MY_NAMESPACE || {};
MY_NAMESPACE.func2 = {
}

her ikisi de aynı ad alanını paylaşır, bu durumda iki dosyanın hangi sırada yüklendiği önemli değildir, yine de nesne içinde doğru şekilde tanımlanır func1ve func2tanımlanırsınız MY_NAMESPACE.

Yüklenen ilk dosya ilk nesneyi oluşturacakMY_NAMESPACE ve daha sonra yüklenen herhangi bir dosya nesneyi büyütecektir .

Yararlı bir şekilde, bu aynı ad alanını paylaşan komut dosyalarının eşzamansız yüklenmesine de izin vererek sayfa yükleme sürelerini iyileştirebilir. Eğer <script>etiketler var deferayrıntının hangi onlar böylece bu sorun da bu düzeltmeleri yukarıda açıklanan, yorumlanabilir olacak sipariş bilemez ayarlayın.

var AEROTWIST = AEROTWIST || {};

Temel olarak bu satır, AEROTWISTdeğişkeni değişkenin değerine AEROTWISTayarla veya boş bir nesneye ayarla diyor.

Çift boru ||bir VEYA ifadesidir ve OR'nin ikinci kısmı yalnızca ilk kısım yanlış döndürürse yürütülür.

Bu nedenle, AEROTWISThalihazırda bir değere sahipse, bu değer olarak tutulacak, ancak daha önce ayarlanmadıysa, boş bir nesne olarak ayarlanacaktır.

temelde şunu söylemekle aynı:

if(!AEROTWIST) {var AEROTWIST={};}

Umarım yardımcı olur.

|| için başka bir yaygın kullanım tanımlanmamış bir işlev parametresi için varsayılan bir değer ayarlamaktır ayrıca:

function display(a) {
  a = a || 'default'; // here we set the default value of a to be 'default'
  console.log(a);
}

// we call display without providing a parameter
display(); // this will log 'default'
display('test'); // this will log 'test' to the console

Diğer programlamadaki eşdeğeri genellikle şöyledir:

function display(a = 'default') {
  // ...
}

Kapsayan iki ana bölüm var var FOO = FOO || {};.

# 1 Geçersiz kılmaları önleme

Kodunuzun birden fazla dosyaya bölündüğünü ve iş arkadaşlarınızın da adlı bir Nesne üzerinde çalıştığını hayal edin FOO. Daha sonra birisinin önceden tanımladığı FOOve ona işlevsellik atadığı duruma yol açabilir (bir skateboardişlev gibi ). Zaten var olup olmadığını kontrol etmeseydiniz, onu geçersiz kılarsınız.

Sorunlu durum:

// Definition of co-worker "Bart" in "bart.js"
var FOO = {};

FOO.skateboard = function() {
  alert('I like skateboarding!');
};

// Definition of co-worker "Homer" in "homer.js"
var FOO = {};

FOO.donut = function() {
  alert('I like donuts!');
};

Bu durumda, skateboardJavaScript dosyasını HTML'nize homer.jssonradan bart.jsyüklerseniz, Homer yeni bir FOOnesne tanımladığından (ve böylece Bart'tan mevcut olanı geçersiz kıldığından), böylece yalnızca donutişlevi bildiğinden işlev kaybolacaktır .

Bu nedenle var FOO = FOO || {};, "FOO, FOO'ya (zaten mevcutsa) veya yeni bir boş nesneye (FOO zaten mevcut değilse) atanacak" anlamına gelecektir.

Çözüm:

var FOO = FOO || {};

// Definition of co-worker Bart in bart.js
FOO.skateboard = function() {
  alert('I like skateboarding!');
};

// Definition of co-worker Homer in homer.js
var FOO = FOO || {};

FOO.donut = function() {
  alert('I like donuts!');
};

Bart ve Homer şimdi varlığını kontrol Çünkü FOOonların yöntemlerini tanımlamak için önce yükleyebilir bart.jsve homer.js(onlar farklı adlar varsa) birbirlerinin yöntemlerini geçersiz olmadan herhangi bir sırada. Böylece her zaman FOOyöntemlere sahip bir nesne alacaksınızskateboard ve donut(Yaşasın!)

# 2 Yeni bir nesne tanımlama

İlk örneği okuduysanız, o zaman şimdiden || {} .

Çünkü eğer yoksa FOO nesne OR durumu aktif hale gelir ve yeni bir nesne oluşturur, böylece ona işlevler atayabilirsiniz. Sevmek:

var FOO = {};

FOO.skateboard = function() {
  alert('I like skateboarding!');
};

AEROTWIST'de değer yoksa veya boş veya tanımsız ise, yeni AEROTWIST'e atanan değer {} (boş bir nesne) olacaktır.

||Operatör iki değeri alır:

a || b

Eğer a doğruysa , geri dönecektir a. Aksi takdirde geri dönecekb .

Falsy değerlerdir null, undefined, 0, "", NaNvefalse . Doğru değerler her şeydir.

Yani aayarlanmadıysa (öyle mi undefined) geri dönecektir b.

IE'nin bazı sürümlerinde bu kodun beklendiği gibi çalışmayacağına dikkat edin. Çünkü var, değişken yeniden tanımlandı ve bu yüzden atanmış - Ben doğru konuyu hatırlayacak olursak - her zaman yeni bir nesne var bitireceğiz. Bu sorunu çözmelidir:

var AEROTWIST;
AEROTWIST = AEROTWIST || {};