JavaScript'te çift veya tek tırnak ne zaman kullanılır?


1968

console.log("double"); vs console.log('single');

Dizeleri işlerken tek tırnak kullanarak daha fazla JavaScript kitaplığı görüyorum. Birini diğerinin üzerinde kullanmanın nedenleri nelerdir? Onların birbirinin yerine kullanılabileceğini düşündüm.


125
hangisini okumak daha kolay? alert ("Oyun zamanı"); veya uyarı ('Bu oyun zamanı');
Ryan Miller

591
Peki ya Ryan? alert("It's \"game\" time.");veya alert('It\'s "game" time.');?
Francisc

37
Eğer tek tırnaklar her zaman kullanılırsa ve ara sıra tek tırnak içerdiği zaman zaman çift tırnak varsa, o zaman çok daha az kaydırma düğmesi yazmak zorunda kalacağız ve sol küçük parmağımız bize nimetler verecektir. Ancak evet, @ arne'nin dediği gibi JSON için çift tırnak kullanılmalıdır.
IsmailS

9
Avrupa klavyesinde olduğunuzda tek tırnak yapmak daha kolaydır (çift tırnak Shift + 2'dir, bu da tek bir tuşa sağ pembemsinizle rahatça dokunmak kadar tatlı değildir).
Arne

38
@Arne "Avrupa klavyesi" diye bir şey yoktur. Örneğin, Almanca klavye her iki tırnak için de kaydırma gerektirir. (Ancak tek tırnak işaretleri daha kolaydır.)
ANeves

Yanıtlar:


1222

Farklı kütüphanelerde single vs double kullanımının en olası nedeni programcı tercihi ve / veya API tutarlılığıdır. Tutarlı olmaktan başka, dizeye en uygun olanı kullanın.

Diğer alıntı türünü değişmez olarak kullanma:

alert('Say "Hello"');
alert("Say 'Hello'");

Bu karmaşık olabilir:

alert("It's \"game\" time.");
alert('It\'s "game" time.');

ES6'da yeni olan başka bir seçenek, karakteri kullanan Şablon değişmezleridirback-tick :

alert(`Use "double" and 'single' quotes in the same string`);
alert(`Escape the \` back-tick character and the \${ dollar-brace sequence in a string`);

Şablon değişmezleri aşağıdakiler için temiz bir sözdizimi sunar: değişken enterpolasyon, çok satırlı dizeler ve daha fazlası.

JSON'un sistem gereksinimlerine bağlı olarak dikkate alınması gereken çift tırnak işareti kullanmak için resmen belirtildiğini unutmayın .


84
Tüm kod kurallarına dikkat edilmesi gereken önemli bir nokta - Bir kez tanımlayın ve ona uyun. IOW, başka bir yerde çift tırnak ve tek tırnak kullanmayın.
Cerebrus

170
@Cerebrus - Bence bu esneklik sorun değil. Tabii ki tercih ettiğiniz bir stil seçin, ancak bir dizede kaçan tırnak işaretlerini kaydetmek için stilden kopmanız gerekiyorsa. Bununla iyi olurdum.
Martin Clarke

5
Bu konuda tutarlı olmak için herhangi bir neden olduğunu düşünmüyorum. İkisinden birinin avantajı yok ve okunabilirliğin 'bir yerde, hem de başka bir yerde kullanıp kullanmadığınızı gerçekten etkilediğini düşünmüyorum.
cdmckay

2
@Olly Hicks, ilginç test !! Tek tırnaklar aslında Chrome 13'te (OSX) çift tırnaklardan birkaç kat daha hızlıdır. İlginç ...
Ricket

12
Biraz konu dışı, ancak insanlar doğru tipografi kullansaydı, kaçmakla ilgili bu tartışmaların çoğu eski olurdu: alert('It’s “game” time')vs. alert("It’s “game” time")- önemli değil. Yalnızca tek veya çift asal işareti (nadir) durumlarda kaçmak gerekir ', "aslında uygundur.
jotaen

617

JSON ile uğraşıyorsanız, kesinlikle konuşursak, JSON dizelerinin çift tırnak içine alınması gerekir. Elbette, birçok kütüphane tek tırnakları da destekliyor, ancak tek bir dize alıntısının aslında JSON standartlarına göre olmadığını fark etmeden önce projelerimden birinde büyük sorunlar yaşadım.


5
ASP.NET hizmetini (Web Hizmeti, Sayfa Yöntemi veya MVC) çağıran jQuery.ajax ile çalışırken bu çok önemlidir.
Schmuli

100
Özellik adları içinde JSON dizeleri çift tırnak olmalıdır, ancak bir bütün olarak bir JSON dize tek tırnaklı olabilir: var jsonString = '{"key1":"value1"}';(ı tavsiye manuel olarak JSON bina değildir.)
nnnnnn

51
Eğer yapabiliyorsanız JSON'u elle yazmamalısınız .stringify().
Camilo Martin

23
Buradaki her zaman çift tırnak kullanmak için en iyi argüman budur. JSON çift tırnak içine alınmalıdır. Diğer cevaplar çoğunlukla "tutarlı" olma tavsiyesinde bulunur, yani dilin herhangi bir parçası gerçekçi bir şekilde çift tırnak işareti uygulayabilirse, sürekli olarak bu çift tırnak işareti kullanılmalıdır.
Qaribou konumundan Josh

18
Bu, hemen hemen tüm diğer dillerin (Java, C, C ++, ...) dizeler için çift tırnak ve karakter için tek tırnak kullandığı birden çok dille çalışırken de geçerlidir. Aynı alıntıyı tahtada kullanmayı ve JS için çift tırnaklarla yapışmayı tercih ederim. Yıllarca dokunarak yazdığınızda, çift tırnak için kaydırmak için ekstra anahtar tamamen ilgisizdir ve kodlamanız yazmanızla kısıtlanıyorsa, düzgün yazmayı denemeniz gerekir.
Lawrence Dol

336

Daha iyi bir çözüm yok ; Ancak, çift tırnak zaman zaman daha cazip olabilir iddia etmek istiyorum:

  • Yeni gelenler zaten kendi dillerinden çift tırnak bilecekler . İngilizce olarak, "alıntılanan metnin bir geçişini tanımlamak için çift tırnak kullanmamız gerekir . Tek bir alıntı kullanırsak ', okuyucu bunu bir kasılma olarak yanlış yorumlayabilir. Çevrili bir metnin geçişinin diğer anlamı ''konuşma dili' anlamını gösterir. Önceden var olan dillerle tutarlı kalmak mantıklıdır ve bu muhtemelen kodun öğrenilmesini ve yorumlanmasını kolaylaştırabilir.
  • Çift tırnak işaretleri kesme işaretlerinden kaçınma ihtiyacını ortadan kaldırır (kasılmalarda olduğu gibi). Dizeyi göz önünde bulundurun: "I'm going to the mall"Aksi karakterli biçimine Karşılaştırması: 'I\'m going to the mall'.
  • Çift tırnak, diğer birçok dilde bir dize anlamına gelir . Java veya C gibi yeni bir dil öğrendiğinizde, her zaman çift tırnak kullanılır. Ruby, PHP ve Perl'de, tek tırnaklı dizeler ters eğik çizgiden kaçış anlamına gelmezken, çift tırnaklar bunları destekler.

  • JSON gösterimi çift tırnak ile yazılır.

Bununla birlikte, diğerlerinin de belirttiği gibi, tutarlı kalmak çok önemlidir.


İngilizce ile ilgili ilk noktanız her zaman doğru değildir ve yer / ev kuralına bağlı olarak değişebilir. Basılı materyaller genellikle konuşma için tek tırnaklar kullanır ve alıntılanan büyük metin blokları için başka formatlar kullanır. 'Konuşma diline özgü' anlamınız, vurgulamak için alıntıların yararlı bir tanımı değildir. Ayrıca İngilizce kullanıcıları genel olarak tırnak işaretleri ve kesme işaretleri ile çok fakirdir.
John Ferguson

2
@JohnFerguson, sadece bu nedenle, bu ayrımı yapmak için (kesme işaretleri ve alıntılanan pasajlar arasında) çift tırnak kullanmak istenebilir.
user1429980

Ben tamamen pragmatizmle ilgiliyim. Yazdığım veya kullandığım 100 dizeden 1'inin çift tırnak içermesi ve daha birçoklarının kesme işareti olması nedeniyle iki katını kullanıyorum. Ancak günün sonunda, projenin yeni bir geliştiricisiyseniz 1) projede halihazırda kullanılmakta olan teklif türünü veya 2) daha mantıklı olduğunu düşündüğünüz teklif türünü kullanmalısınız.
dudewad

Vaka - ne yazdım (birden fazla kesme işareti var, çift tırnak yok;)
dudewad

FWIW - Bu bir Quora
theUtherSide

118

Tarifnamenin 7.8.4 kısmı değişmez dize gösterimini açıklamaktadır. Tek fark, DoubleStringCharacter'in "SourceCharacter ama double-quote değil" ve SingleStringCharacter "SourceCharacter ama single-quote" olmasıdır. Böylece tek fark bu şekilde gösterilebilir:

'A string that\'s single quoted'

"A string that's double quoted"

Yani ne kadar teklif kaçmak istediğinize bağlıdır. Aynı şey, çift tırnaklı dizgilerdeki çift tırnaklar için de geçerlidir.


@Gareth: Yine de spesifikasyonlardan bahsetmiyordum, olası performans etkisinden bahsediyordum. stackoverflow.com/questions/242813/…
Mathias Bynens

shift + 'tuşuna kaç kez basmanız gerektiğini telafi etmek için kodunuza yeterince kesme işareti koyarsanız, yanlış yaparsınız.
SgtPooki

1
"{\"name\": \"Peter\"}"Vs ne olacak '{"name": "Peter"}'? Kuşkusuz, bunun aynı fark olduğunu söyleyebilirsiniz, ancak kararınızı kesinlikle yukarıdaki örnekten farklı bir şekilde etkileyecektir.
Trevor

@MathiasBynens - Bu, en az bir yıldır ve belki 6 yıl kadar süren ilginç bir gözlem.
ArtOfWarfare

4
Bir kesme işareti için U + 2019 kullanmalı, dikey-tek tırnak değil
jjg

95

Tek Alıntılar

Keşke çift tırnaklar standart olsa, çünkü biraz daha mantıklı geliyorlar , ancak tek tırnak işaretleri kullanmaya devam ediyorum çünkü sahneyi domine ediyorlar.

Tek tırnak:

Tercih yok:

İkili alıntı:


7
Crockford şimdi çift tırnakları tercih ediyor.
Adam Calvet Bohl

6
airbnb şimdi çift tırnakları tercih ediyor
Suraj Jain

15
@SurajJain Kaynak? Airbnb ve Google stil rehberleri yine de tercih edilen şekilde single listeler.
Alec Mev

5
@SurajJain Ah, bunlar JSON'da yazılmış ve tek tırnaklara hiç izin vermeyen kod stili denetleyici yapılandırmalarıdır. Onları okumak, farklı projeler tarafından yapılan seçimleri karşılaştırmanın güzel bir yoludur.
Alec Mev

2
Google artık tek teklifleri tercih ediyor
GabrielOshiro

57

Aradaki farkın tamamen stilistik olduğunu söylemek isterim, ama gerçekten şüphelerim var. Aşağıdaki örneği düşünün:

/*
   Add trim() functionality to JavaScript...
    1. By extending the String prototype
    2. By creating a 'stand-alone' function
   This is just to demonstrate results are the same in both cases.
*/

// Extend the String prototype with a trim() method
String.prototype.trim = function() {
 return this.replace(/^\s+|\s+$/g, '');
};

// 'Stand-alone' trim() function
function trim(str) {
 return str.replace(/^\s+|\s+$/g, '');
};

document.writeln(String.prototype.trim);
document.writeln(trim);

Safari, Chrome, Opera ve Internet Explorer'da (IE7 ve IE8'de test edilmiştir), bu aşağıdakileri döndürür:

function () {
 return this.replace(/^\s+|\s+$/g, '');
}
function trim(str) {
 return str.replace(/^\s+|\s+$/g, '');
}

Ancak, Firefox biraz farklı bir sonuç verecektir:

function () {
    return this.replace(/^\s+|\s+$/g, "");
}
function trim(str) {
    return str.replace(/^\s+|\s+$/g, "");
}

Tek tırnakların yerine çift tırnaklar konur. (Ayrıca, girintili alanın nasıl dört boşlukla değiştirildiğine dikkat edin.) Bu, en az bir tarayıcının her şeyi çift tırnak kullanılarak yazılmış gibi JavaScript'i dahili olarak ayrıştırdığı izlenimini verir. Her şey zaten bu 'standarda' göre yazılmışsa, JavaScript'in ayrıştırılması Firefox'un daha az zaman alacağını düşünebilir.

Bu arada, beni çok üzücü bir panda yapar, çünkü tek tırnakların kodda daha hoş görüneceğini düşünüyorum. Ayrıca, diğer programlama dillerinde, genellikle çift tırnaklardan daha hızlıdırlar, bu nedenle yalnızca JavaScript'e uygulandığında anlamlı olur.

Sonuç: Sanırım bu konuda daha fazla araştırma yapmamız gerekiyor.

Düzenleme: Bu Peter-Paul Koch'un 2003 yılındaki test sonuçlarını açıklayabilir .

Explorer Windows'da tek tırnak işaretleri bazen daha hızlı görünüyor (testlerimin kabaca 1 / 3'ü daha hızlı tepki süresi gösterdi), ancak Mozilla bir fark gösteriyorsa, çift tırnakları biraz daha hızlı işler. Opera'da hiç fark bulamadım.

Edit 2014: Firefox / Spidermonkey'in modern sürümleri artık bunu yapmıyor.


25
Bir tarayıcıda bir şekilde biraz daha hızlı ve diğerinde başka şekilde yapmak için biraz daha hızlı ise, bundan uzaklaşabileceğimiz tek rehber gibi görünüyor, daha fazla istediğimiz şeyi yapmalıyız, çünkü bazılarını incitecek kullanıcılara ve başkalarına yardım eder ve fark miktarı muhtemelen algılanamaz. "Erken optimizasyon ..." ve tüm bunlar.
Andrew Hedges

2
Üzgünüm, yorumum daha yapıcı değildi. Sadece tarayıcının sözdiziminin iç temsilini görüntülemeyi nasıl seçtiğini muhtemelen nasıl ayrıştırıldığına dair çok az şey olduğunu ve bu nedenle muhtemelen bir alıntıyı diğerine tercih etmek için bir neden olmadığını söylüyorum. Öte yandan, tarayıcılar arasında tek ve çift tırnak için ayrıştırma sürelerini karşılaştıran performans verileri daha cazip olacaktır.
Chris Calo

1
Bu müthiş bir cevap, 'Onlar aynı oldukları' cıvıltılarından kalan bir mola ... dedi. "Artı, diğer programlama dillerinde, genellikle çiftten daha hızlı kullanıyorlar " , hangi dilleri sorabilir miyim? Java ve C # gibi normal langs kullandım, tek tırnak içinde dize değişmezlerini kabul eden JS dışında bir tane görmedim. Tek tırnak işaretleri genellikle karakter sabitleri için kullanılır (yalnızca bir karaktere izin verilir).
ADTC

3
AFAIK bu Firefox 17'de düzeltildi, Firefox yaparken ayrıştırmayı yapıyordu .toStringama şimdi orijinal kopyayı döndürüyor. Modern firefox'ta bu sorun olmaz.
Benjamin Gruenbaum

3
Hız farklarını bilmiyorum. Ancak şunu belirtmek isterim: "Bu, en az bir tarayıcının JavaScript'i dahili olarak ayrıştırdığı izlenimini veriyor, sanki her şey çift tırnak kullanılarak yazılmış gibi." saçmalıktır. Çift tırnak işareti ile yazılmıştır. Yani iç temsilini (tırnak işaretlerini değil, sadece dizeyi saklar), insan tarafından okunabilir bir sürüme dönüştürdü, bunun için bir tırnak seti kullanıldı. Her neyse, bu Benjamin'nin yorumuna göre değişmiş gibi görünüyor.
subsub

32

Satır içi JavaScript (muhtemelen "kötü" bir şey yapıyorsanız, ancak bu tartışmadan kaçınıyorsanız) tek tırnaklar dize değişmezleri için tek seçeneğinizdir, inanıyorum.

örneğin, bu iyi çalışıyor:

<a onclick="alert('hi');">hi</a>

Ama farkında olduğum kaçan bir yöntemle "merhaba" yı çift tırnak içine alamazsınız. Bu &quot;benim en iyi tahminim bile olurdu (HTML özellik değerinde tırnaklardan kaçtığınız için) Firefox'ta benim için çalışmıyor. \"bu noktada çalışmaz çünkü bu noktada JavaScript için değil HTML için kaçıyorsunuz.

Yani, oyunun adı tutarlılıksa ve uygulamanızın bazı kısımlarında satır içi JavaScript yapacaksanız, tek tırnakların kazanan olduğunu düşünüyorum. Yanılıyorsam lütfen biri beni düzeltin.


8
Tartışmasız kötü bir şey olduğu konusunda hemfikirdi, ancak yapılması gerekiyorsa, URL tarzı kodlamanın kullanılabileceğinden eminim <a onclick="alert(%22hi%22);">hi</a>- bunun yerine href özniteliğinde olabilir, ancak bellekten çalışıyor<a href="javascript:alert(%22hi%22);">hi</a>
Graza

2
@PhiLho haklısın ... İnsanların geleneksel olarak çift tırnaklı HTML özellikleri yazdığını ve (1) toptan satışları her şeyi tek tırnaklara dönüştürmeyeceklerini veya (2) karıştırıp eşleştirmeyeceklerini varsayıyordum tek ve çift tırnaklı özellikler. Ama evet, haklısın yasal
Tom Lianza

4
@Tom Lianza, kesinlikle alert(&quot;hi&quot;)geçerli bir JavaScript değil. Ancak özelliklerin değerleri kodlanır. w3.org/TR/html4/intro/sgmltut.html#didx-attribute
Robert

4
@Robert ile aynı fikirde. &quot;HTML özelliğinin içindeki çift tırnaktan kaçmanın doğru yoludur. Firefox'ta iyi çalışıyor. @Denilson, XML (ve dolayısıyla XHTML) hem tek hem de çift tırnaklara izin verir. Bkz AttValueXML spec değişmez w3.org/TR/REC-xml/#d0e888 .
Chris Calo

1
@Pacener: Çünkü bu, ah, yanlış değil. HTML'de, çift tırnak arasına nitelikler koymak için bir kural vardır.
Konrad Borowski

30

Teknik olarak hiçbir fark yoktur, sadece stil ve konvansiyon meselesidir.

Douglas Crockford, dahili dizeler için tek tırnaklar ve harici için çift tırnaklar kullanmanızı önerir (harici olarak, mesajlar veya uyarılar gibi uygulama kullanıcılarına görüntülenecek olanları kastediyoruz).

Ben şahsen takip ediyorum.

GÜNCELLEME: Görünüşe göre Bay Crockford fikrini değiştirdi ve şimdi çift tırnak kullanmayı öneriyor :)


13
Douglas Crockford ve JQuery Karşılaştırması. Zehirini seç.
Eric

Crockford'un bunun muhakemesi nedir?
BadHorsie

1
Takip ettiğim kongre bu. Daha kişisel bir tercih. Ben jQuery seçiciler gibi iç şeyler ve / veya getElementById ('id') gibi şeyler için tek tırnaklı dizeleri kullanmayı seviyorum; Ben sadece tek tırnak ile görünüyor gibi. Ancak, metinde genellikle iç tırnak içerebileceğinden, harici metin için çift tırnaklara geçin. Ayrıca, birinde veya diğerinde bir hata bulmaya çalışıyorsanız, harici veya dahili dizeleri ayırt etmeyi ve ayırt etmeyi kolaylaştırır.
adimauro

3
Nisan 2016'dan itibaren Douglas Crockford , uygulamada birçok geliştiricinin dahili ve harici ikileminin kullanımını zor bulduğu göz önüne alındığında, yalnızca çift tırnak kullanılmasını önermektedir .
Thunderforge

27

Açıkçası, anlamda bir fark yoktur; böylece seçim kolaylık sağlar.

Seçiminizi etkileyebilecek çeşitli faktörler şunlardır:

  • Ev tarzı: Bazı geliştirici grupları zaten bir kongre veya diğeri kullanıyor.
  • İstemci tarafı gereksinimleri: Dizelerde tırnak işareti kullanacak mısınız? (Bkz. Ady'nin cevabı).
  • Sunucu tarafı dili: VB.Net kullanıcıları, komut dosyaları sunucu tarafında oluşturulabilmesi için java-script için tek tırnak kullanmayı tercih edebilir (VB.Net, dizeler için çift tırnak kullanır, bu nedenle java-script dizeleri ayırt etmek kolaydır tek tırnak işareti kullanıyorlarsa).
  • Kütüphane kodu: Belirli bir stili kullanan bir kütüphane kullanıyorsanız, aynı stili kendiniz de kullanabilirsiniz.
  • Kişisel tercih: Bir veya daha fazla stilin daha iyi göründüğünü düşünebilirsiniz.

Doğru değil, 'olduğu 00100111ederken, ikili düzende "olduğu 00100010ikilik sistemde. Bu nedenle, çift tırnaklar tek tırnakların saklanması kadar güç harcar. Buradaki fark bu.

19

Bir referansın ne yaptığına bakalım.

Jquery.js içinde her dize çift tırnak içine alınmıştır.

Şimdi, çift tırnaklı dizeler kullanacağım. (Single kullanıyordum!)


11
Bu neden aşağı oylandı? Bu bir stil meselesidir ve en iyi stil tutarlı olmak ve sizden önce gelenleri takip etmektir.
Eric

2
+1 jQuery API belgeleri de geçerlidir. Çift tırnak için tek nedenim buydu. Şahsen, "kişisel tercihe iniyor" cevabının biraz kusurlu olduğunu düşünüyorum - en yaygın olarak kullanılan bir kongre bulmak ve ona bağlı kalmak en iyisidir. Ve (doğrudan veya dolaylı olarak) jQuery örnekleri kopyalamak ve yapıştırmak isteyebilirsiniz, ben her zaman tırnak değiştirmek zorunda kalmak istemiyorum.
Steve Chambers

2
Belki de jQuery insanları önlerinde takip edemedi (ya da diğer çoğu uzman gibi gerçekten umursamadı). ;)
James Wilkins

14

Sadece kullandığınız şeyde tutarlılık sağlayın. Ama konfor seviyenizi düşürmeyin.

"This is my string."; // :-|
"I'm invincible."; // comfortable :)
'You can\'t beat me.'; // uncomfortable :(
'Oh! Yes. I can "beat" you.'; // comfortable :)
"Do you really think, you can \"beat\" me?"; // uncomfortable :(
"You're my guest. I can \"beat\" you."; // sometimes, you've to :P
'You\'re my guest too. I can "beat" you too.'; // sometimes, you've to :P

ES6 güncellemesi

Şablon değişmez sözdizimini kullanma .

`Be "my" guest. You're in complete freedom.`; // most comfort :D

13

Çoğunlukla stil ve tercih meselesi. Diğer cevaplarda oldukça ilginç ve faydalı teknik keşifler var, bu yüzden belki de ekleyebileceğim tek şey küçük bir dünya tavsiyesi sunmak.

  • Eğer bir şirket veya takımda kodlarken, daha sonra muhtemelen "ev tarzı" takip etmek iyi bir fikirdir.

  • Eğer yalnız bir kaç yan projeleri hack ediyoruz, daha sonra toplum içinde birkaç önemli liderleri bak. Diyelim ki Düğüm'e girdiğinizi varsayalım. Örneğin corecore.js veya express gibi temel modüllere göz atın ve hangi kuralları kullandıklarını görün ve bunu takip etmeyi düşünün.

  • Eğer her iki konvansiyonlar eşit kullanılmaktadır sonra kişisel için erteleme
    tercihi.

  • Eğer hiçbir kişisel tercih var o zaman yazı tura.

  • Eğer bir metal para yok, sonra bira üzerimde olduğu;)


13

Umarım bariz bir şey eklemiyorum, ama bu konuda Django ve Ajax ve JSON ile mücadele ediyorum .

HTML kodunuzda normalde olması gerektiği gibi çift tırnak kullandığınızı varsayarsak, JavaScript'teki geri kalanı için tek tırnak kullanmanızı öneririm.

Bu yüzden @ady ile ama biraz özenle katılıyorum.

Sonuç olarak: JavaScript'te muhtemelen önemli değil, ancak HTML veya benzeri içine gömdüğünüzde sorun yaşamaya başlarsınız. Gerçekten kaçmayı, okumayı, ipinizi geçirmeyi bilmelisiniz.

Benim basit durumum:

tbox.innerHTML = tbox.innerHTML + '<div class="thisbox_des" style="width:210px;" onmouseout="clear()"><a href="https://stackoverflow.com/this/thislist/'
                   + myThis[i].pk +'"><img src="/site_media/'
                   + myThis[i].fields.thumbnail +'" height="80" width="80" style="float:left;" onmouseover="showThis('
                   + myThis[i].fields.left +','
                   + myThis[i].fields.right +',\''
                   + myThis[i].fields.title +'\')"></a><p style="float:left;width:130px;height:80px;"><b>'
                   + myThis[i].fields.title +'</b> '
                   + myThis[i].fields.description +'</p></div>'

ShowThis öğesinin üçüncü alanında \ 'işaretini görebilirsiniz.

Çift teklif işe yaramadı!

Neden olduğu açık, ama neden tek tırnaklara bağlı kalmamız gerektiği de açık ...

Bu durum çok basit bir HTML yerleştirmesidir, hata 'çift tırnaklı' bir JavaScript kodundan basit bir kopyala / yapıştır ile oluşturulmuştur.

Soruyu cevaplamak için:

HTML içindeyken tek tırnak kullanmaya çalışın. Birkaç hata ayıklama sorunu kaydedebilir ...


1
ES6 string interpolation (backticks) ile benzer bir problemle karşılaştım. Yapım sistemim, tek tırnakla çalışan bir Auth başlığını kıran çift tırnaklı bir dizeye derledi!
Jay

12

Bunun günümüz dünyasında geçerli olup olmadığından emin değilim, ancak kontrol karakterlerinin işlenmesi gereken içerik için kullanılan çift tırnaklar ve kullanılmayan dizeler için tek tırnak.

Derleyici, tek tırnaklı bir dizgiyi tam anlamıyla el değmeden bırakarak, çift tırnaklı bir dize üzerinde dize manipülasyonu çalıştıracaktır. Bu, 'iyi' geliştiricilerin, gibi \nveya \0(tek tırnak içinde işlenmemiş) gibi kontrol karakterleri içermeyen dizeler için tek tırnak kullanmayı ve dizenin ayrıştırılması gerektiğinde (cpu döngülerinde hafif bir maliyetle) çift tırnak kullanmayı seçmesini sağlar. dizeyi işleme).


14
Bu eskiden bir şekilde yapılmadı ve şimdi başka bir şekilde yapıldı. Farklı diller alıntıları farklı şekilde ele alır ve bazıları tanımladığınız gibi çalışır. Ancak bu bir JavaScript sorusudur. Tek ve çift tırnaklar JavaScript'te aynı şekilde ele alınır (diğer alıntı türlerinin bir dizede kaçmadan kullanılmasına izin verilmesi hariç). Kontrol karakterlerine veya dize enterpolasyonuna izin veren çift tırnak sorusu yoktur. JavaScript böyle çalışmıyor. Kontrol karakterleri ve kaçış dizileri, kullandığınız teklif türüyle aynı şekilde çalışır.
Michael Geary

Eski bir Perl programcısı olarak, JS'de alakasız olduğunu bilsem de düşünmeye devam ediyorum.
zkent

12

Jshint kullanıyorsanız , çift tırnak dizesi kullanırsanız hata oluşur.

AngularJS'nin Yeoman iskele aracılığıyla kullandım ama belki bir şekilde bunu yapılandırmak için bir maner var.

Bu arada, HTML'yi JavaScript ile işlediğinizde, tek tırnak kullanmak daha kolaydır:

var foo = '<div class="cool-stuff">Cool content</div>';

Ve en azından JSON, yinelenen dizeler için çift tırnak kullanıyor.

Sorunuza cevap vermenin önemsiz bir yolu yok


Uygulama jshint değişti mi? demo web sitesi herhangi bir uyarı / hata atmadan ya kabul ediyor gibi görünüyor ve ben de kullanmak için jshint kısıtlamak için herhangi bir seçenek bulamıyorum. Belki de bu cevap eski ya da yanlış?
Lea Hayes

jshint çift tırnaklı bir dize için bir hata oluşturursa, bu ciddi şekilde kırılır. JavaScript standardı, bazı kırık linterları değil neyin doğru olduğunu tanımlar.
Mecki

10

Performanstan bahsetmişken, alıntılar asla sizin darboğazınız olmayacaktır, ancak her iki durumda da performans aynıdır.

Kodlama hızı hakkında konuşmak, eğer 'bir dizeyi sınırlamak için kullanırsanız , "tırnak işaretlerinden kaçmanız gerekir . "Dizenin içinde kullanmanız daha olasıdır , örneğin:

//JSON Objects:
var jsonObject = '{"foo":"bar"}';
//HTML attributes:
document.getElementById("foobar").innerHTML = '<input type="text">';

Sonra, ben 'dizeyi sınırlamak için kullanmayı tercih , bu yüzden daha az karakter kaçmak zorunda.


10

Tek tırnak kullanmanın bir (aptalca) nedeni, bunları yazmak için üst karakter tuşuna basmanızı gerektirmemeleri, çift tırnak ise. (Ortalama dize kaçmayı gerektirmediğini varsayıyorum, bu makul bir varsayımdır.) Şimdi her gün 200 kod satırı kodlayalım. Belki bu 200 satırda 30 alıntı var. Belki bir çift alıntı yazmak tek bir alıntı yazmaktan 0.1 saniye daha fazla zaman alır (çünkü üst karakter tuşuna basmam gerekiyor). Sonra herhangi bir günde 3 saniye israf ediyorum. Bu şekilde 40 yıl boyunca yılda 200 gün kod yazarsam hayatımın 6.7 saatini boşa harcadım. Düşünce için yiyecek.


1
Sanırım burada sadece İngilizce klavye düzenine atıfta bulunuyorsunuz ... Almanca bir tane var, her ikisi için de vardiyaya basmam gerekiyor. Her neyse, shift tuşuna basmanın neden işleme zaman kazandırdığını görmüyorum. Sol elle vardiyaya vurdum ve sağdaki alıntı tuşuna bastım. Aynı zamanda olur, benim için hiçbir fark yok.
codewandler

1
@codewandler siz "anahtarına paralel olarak bastırın bile shift tuşuna basmak zorunda bir maliyeti var hâlâ Uçup varsayılan konumundan parmağını hareket ettirmek için zorlar Örneğin, sen yazmaya varsayalım.:. var description = "This is a \"quick\" test";üzerine İngilizce bir klavye için, pembemsi parmağınız, A tuşundan Q tuşuna geçmek yerine sol üst karakterden en üst satırdaki Q tuşuna gitmelidir Başka bir deyişle, iki kat daha fazla mesafe kat etmelidir. Tuşların Almanca klavyede nerede olduğundan emin değilim, ama eminim buna benzer bir örnek var
John Kurlak

2
@codewandler Ayrıca, paralel yazabilsem bile, üst karakter yazmam gerekiyorsa, sol pembemsi parmağın bir sonraki karakteri "yazdığınız her
şeye

1
"Zaman kaybı" fikri biraz aptalca, ancak daha az ergonomik zorlanma (özellikle karpel tünel sendromu, vb. Çağda) fikri, özellikle de başka türlü önemli olmadığı durumlarda hoş bir kazanç sağlıyor. Günde 1.000 satırdan fazla kod verildiğinde, bu yüzlerce günlük pembemsi kıvrımı kurtarabilir.
Beejor

9

Avantaj ve dezavantajları inceleme

Tek tırnak lehine

  • Daha az görsel karmaşa.
  • HTML oluşturma: HTML özellikleri genellikle çift tırnaklarla sınırlandırılır.

elem.innerHTML = '<a href="' + url + '">Hello</a>';
Ancak, tek tırnaklar HTML'de de yasaldır.

elem.innerHTML = "<a href='" + url + "'>Hello</a>";

Ayrıca, satır içi HTML normalde bir anti-kalıptır. Şablonları tercih edin.

  • JSON oluşturuluyor: JSON'da yalnızca çift tırnak işareti kullanılabilir.

myJson = '{ "hello world": true }';

Yine, JSON'u bu şekilde inşa etmek zorunda kalmamalısınız. JSON.stringify () genellikle yeterlidir. Değilse, şablonları kullanın.

Çift tırnak lehine

  • Renk kodlamanız yoksa iki kat daha kolay fark edilir. Konsol günlüğünde veya bir tür görünüm kaynağı kurulumunda olduğu gibi.
  • Diğer dillere benzerlik: Kabuk programlamada (Bash vb.), Tek tırnaklı dize değişmezleri vardır, ancak kaçışlar bunların içinde yorumlanmaz. C ve Java, dizeler için çift tırnak ve karakterler için tek tırnak kullanır.
  • Kodun geçerli JSON olmasını istiyorsanız, çift tırnak kullanmanız gerekir.

Her ikisinin de lehine

JavaScript'te ikisi arasında fark yoktur. Bu nedenle, şu anda uygun olanı kullanabilirsiniz. Örneğin, aşağıdaki dize değişmezlerinin tümü aynı dizeyi üretir:

    "He said: \"Let's go!\""
    'He said: "Let\'s go!"'
    "He said: \"Let\'s go!\""
    'He said: \"Let\'s go!\"'

İç dize için tek tırnak, dış dize için çift tırnak. Bu, dahili sabitleri kullanıcıya gösterilecek (veya diske yazılacak vb.) Dizelerden ayırt etmenizi sağlar. Açıkçası, ikincisini kodunuza koymaktan kaçınmalısınız, ancak bu her zaman yapılamaz.


8

Çift tırnaklardan tek tırnaklara geçişin bir nedeni olarak düşünmek isteyebileceğiniz bir şey daha, sunucu tarafı komut dosyalarının popülaritesinin artmasıdır. PHP kullanırken değişkenleri aktarabilir ve PHP'deki dizeleri ve değişkenleri kullanarak javascript fonksiyonlarını ayrıştırabilirsiniz.

Eğer bir dize yazar ve PHP için çift tırnak kullanırsanız tek tırnak kaçmak zorunda kalmazsınız ve PHP otomatik olarak sizin için değişkenlerin değerini alır.

Örnek: Sunucumdan bir değişken kullanarak bir javascript işlevi çalıştırmak gerekiyor.

public static function redirectPage( $pageLocation )
{
    echo "<script type='text/javascript'>window.location = '$pageLocation';</script>";
}

Bu bana dizeleri birleştirme ile uğraşmak zorunda çok güçlük tasarrufu ve ben etkili bir PHP javascript çağırabilir. Bu sadece bir örnektir, ancak bu, programcıların javascript'te tek tırnak işaretlerini varsayılan olarak kullanmasının birkaç nedeninden biri olabilir.

PHP belgelerinden alıntı : "Çift tırnaklı dizelerin en önemli özelliği değişken adlarının genişletilmesidir. Ayrıntılar için dize ayrıştırma bölümüne bakınız."


+1, bunu MVC.Net projemde yapıyorum, böylece C # 'dan çift tırnak javascript tek tırnak karışmasını, ya da tam tersi.
DCShannon

3
Bence bir PHP sınıf yönteminden sayfanıza JavaScript yazıyorsanız daha büyük sorunlarınız var.
BadHorsie

6

Performans farklılıklarını gördüğünü iddia eden insanlar var: eski posta listesi iş parçacığı . Ama bunların hiçbirini teyit edemedim.

Ana şey, dizenizde ne tür tırnaklar (çift veya tek) kullandığınıza bakmaktır. Kaçış sayısını düşük tutmaya yardımcı olur. Örneğin, dizelerinizin içinde html ile çalışırken, tek tırnak işaretleri kullanmak daha kolaydır, böylece özniteliklerin çevresindeki tüm çift tırnaklardan kaçmak zorunda kalmazsınız.


Nitelikleri tek tırnak ile de çevrili olabilir :)
Damir Zekić

Hakkınız, xml ve xhtml'in öznitelikleri çevreleyen çift tırnak öngördüğünü, ancak tek tırnaklara izin verildiğini düşündüm.
Michiel Overeem

6

Ben tek tırnak kullanılamaz ve tersi çift tırnak kullanın:

"'" + singleQuotedValue + "'"
'"' + doubleQuotedValue + '"'

Onun yerine:

'\'' + singleQuotedValue + '\''
"\"" + doubleQuotedValue + "\""

Ne Lly "O'rea gibi hem tek tırnak ve çift tırnak içeren bir dize hakkında
sudhAnsu63

6

JavaScript'te tek ve çift tırnaklar arasında fark yoktur.

Şartname önemlidir:

Belki performans farklılıkları vardır, ancak kesinlikle minimumdur ve tarayıcıların uygulamasına göre her gün değişebilir. JavaScript uygulamanız yüz binlerce uzun olmadığı sürece daha fazla tartışma işe yaramaz.

Bir kıyaslama gibi

a=b;

daha hızlı

a = b;

(fazladan boşluk)

bugün, belirli bir tarayıcıda ve platformda vb.


2
boşluk olmadan daha hızlı. dizede ayrıştırılacak daha az karakter. : p
pilavdzice

6

CoffeeScript kullanırken çift tırnak kullanıyorum. İkisinden birini seçip ona bağlı kalmanız gerektiğine katılıyorum. CoffeeScript, çift tırnak işaretlerini kullanırken enterpolasyon sağlar.

"This is my #{name}"

ES6, şablon dizeleri için geri keneler (`) kullanıyor. Muhtemelen iyi bir nedeni vardır, ancak kodlama sırasında enterpolasyon özelliğini elde etmek için dize değişmez karakterini tırnaklardan veya çift tırnaklardan arka kenelere değiştirmek zahmetli olabilir. CoffeeScript mükemmel olmayabilir, ancak her yerde aynı dize değişmez karakterini kullanmak (çift tırnak) ve her zaman enterpolasyon yapabilmek güzel bir özelliktir.

`This is my ${name}`

Benim için arka kene bu yarışmada açık bir kazanan, (neredeyse) ortak metin dizelerinde hiçbir varlık yok, artı var enterpolasyonu
Simone Poggi

5

JavaScript ve C # arasında ileri geri atlıyorsanız, çift tırnaklı ortak kongre için parmaklarınızı eğitmek en iyisidir.


5

Aşağıdakileri yaklaşık 20 kez çalıştırıyorum. Ve çift tırnakların yaklaşık% 20 daha hızlı olduğu anlaşılıyor.

Eğlenceli kısım, eğer 2. ve 1. bölümleri değiştirirseniz, tek tırnaklar yaklaşık% 20 daha hızlıdır.

//Part1
var r='';
var iTime3 = new Date().valueOf();
for(var j=0; j<1000000; j++) {
    r+='a';
}
var iTime4 = new Date().valueOf();
alert('With single quote : ' + (iTime4 - iTime3));  

//Part 2                
var s="";
var iTime1 = new Date().valueOf();
for(var i=0; i<1000000; i++) {
    s += "a";
}
var iTime2 = new Date().valueOf();
alert('With double quote: ' + (iTime2 - iTime1));

31
Başka bir deyişle, sonraki kodun en hızlı çalıştığını gördünüz. Mikro ölçütler yaparken sorun budur. Kodu çalışırken optimize eden JS motorunu hesaba katmanız gerekir. (JIT'in çalışması nedeniyle Java'yı karşılaştırırken aynı etkiyi göreceksiniz.)
David Phillips

4
ilk yeni Tarih yavaş, var dummy_date = new Date()başlangıca ekle
Lauri

1
Buradaki mikro optimizasyon seviyesi o kadar saçma ki, tek tırnakların yazımının daha hızlı olduğunu ve daha hızlı gelişime yol açabileceğini de iddia edebilirsiniz.
Beejor

4

Kesinlikle hiçbir fark yoktur, bu nedenle kaçış sayısını düşük tutmak çoğunlukla bir zevk ve dizedeki (veya JS kodunun kendisi bir dize içindeyse) meselesidir.

Hız farkı gösterimi, iki tırnak içinde farklı davranışların bulunduğu PHP dünyasından gelebilir.


Ve Ruby, ekleyebilirim. Python, JavaScript ile aynı davranışa sahiptir: tek / çift tırnaklar arasında fark yoktur.
Damir Zekić

4

Belki daha hızlı veya belki de avantajları olduğunu söyleyen tüm cevapları okuduktan sonra, çift tırnak daha iyi veya belki daha hızlı olduğunu söyleyebilirim çünkü Google kapatma derleyicisi tek tırnakları çift tırnaklara dönüştürür.


Bunu neden yaptığını biliyor musunuz?
ma11hew28

Bilmiyorum. Belki bir kodlama kuralı ve özel bir şey değil.
Mohsen

4

Şimdi 2020 olduğuna göre, Javascript için üçüncü bir seçenek düşünmeliyiz: Her şey için tek backtick.

Bu, tek veya çift tırnak yerine her yerde kullanılabilir.

Her şeyi yapmanızı sağlar!

  1. Tek tırnak içine gömün: `` Harika! ''
  2. İçine çift tırnak işareti ekleyin: `` "Gerçekten" harika! "
  3. Dize enterpolasyonu kullanın: `` Harikadan çok "$ {better}"!
  4. Bu, birden fazla satır sağlar: `

    Bu

    Markalar

    JavaScript

    Daha iyi!

    '

Diğer ikisini değiştirirken de performans kaybına neden olmaz: https://medium.com/javascript-in-plain-english/are-backticks-slower-than-other-strings-in-javascript-ce4abf9b9fa


3

JS kaynağınız:

elem.innerHTML="<img src='smily' alt='It\'s a Smily' style='width:50px'>";

HTML kaynağı:

<img src="smiley" alt="It's a Smiley" style="width:50px">

veya HTML5 için

<img src=smiley alt="It's a Smiley" style=width:50px>

JS böyle dizilere izin verir:

var arr=['this','that'];

Ancak onu dizgi yaparsanız, uyumlu bir nedenden ötürü olacaktır:

JSON=["this","that"]

Eminim bu biraz zaman alır.


3

Sadece 2 sent eklemek için: Birkaç yıl önce hem JS hem de PHP ile çalışırken, tek tırnak kullanmaya alışkınım, böylece kaçmak zorunda kalmadan kaçış karakterini ('\') yazabilirim. Genellikle dosya yolları vb. İle ham dizeler yazarken kullanılır ( http://en.wikipedia.org/wiki/String_literal#Raw_strings )

Her neyse, benim kongre gibi tanımlayıcı tipi ham dizeleri üzerinde tek tırnak, kullanımı olma sona erdi if (typeof s == 'string') ...ve çift tırnak - (şimdiye hangi kaçış karakterler kullanılmalıdır asla) metinler böyle "Hey, ne haber?" Gibi. Tanımlayıcı adlarını göstermek için tipografik bir kural olarak yorumlarda tek tırnak işaretleri kullanıyorum. Bu sadece bir kural, ve ben sadece gerektiğinde, örneğin HTML dizeleri yazarken '<a href="#"> like so <a>'(tırnak burada ters olabilir) koparmak . JSON durumunda, adlar için çift tırnak kullanıldığının da farkındayım - ancak bunun dışında , tırnaklar arasındaki metin için kaçmanın asla gerekli olmadığı durumlarda tek tırnakları tercih ediyorum - gibi document.createElement('div').

Alt satırda ve bazılarının belirttiği / ima ettiği gibi, bir kongre seçin, ona uyun ve sadece gerektiğinde sapın.

Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.