console.log("double");
対 console.log('single');
文字列を処理するときに一重引用符を使用するJavaScriptライブラリが増えています。どちらを使用する理由は何ですか?かなり互換性があると思いました。
alert("It's \"game\" time.");
またはalert('It\'s "game" time.');
?
console.log("double");
対 console.log('single');
文字列を処理するときに一重引用符を使用するJavaScriptライブラリが増えています。どちらを使用する理由は何ですか?かなり互換性があると思いました。
alert("It's \"game\" time.");
またはalert('It\'s "game" time.');
?
回答:
異なるライブラリでシングルとダブルを使用する最も可能性の高い理由は、プログラマーの好みやAPIの一貫性です。一貫性がある以外は、文字列に最適な方を使用します。
他のタイプの引用符をリテラルとして使用する:
alert('Say "Hello"');
alert("Say 'Hello'");
これは複雑になる可能性があります。
alert("It's \"game\" time.");
alert('It\'s "game" time.');
ES6の新機能である別のオプションは、文字を使用するテンプレートリテラルback-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`);
テンプレートリテラルは、変数の補間、複数行の文字列などの明確な構文を提供します。
JSONは二重引用符を使用するように正式に指定されていることに注意してください。システム要件によっては、検討する価値があるかもしれません。
alert('It’s “game” time')
対alert("It’s “game” time")
-重要ではありません。あなただけのシングルまたはダブルプライム記号(まれ)のケースではエスケープする必要があるだろう'
、"
実際には適切です。
JSONを扱う場合、厳密に言うと、JSON文字列は二重引用符で囲む必要があることに注意してください。もちろん、多くのライブラリは単一引用符もサポートしていますが、文字列の単一引用符が実際にはJSON標準に従っていないことに気付く前に、プロジェクトの1つで大きな問題がありました。
var jsonString = '{"key1":"value1"}';
(JSONを手動で作成することをお勧めしません)
.stringify()
。
より良い解決策はありません。ただし、二重引用符の方が望ましい場合もあると主張します。
"
、引用されたテキストの一節を識別するために二重引用符を使用する必要があります。単一引用符を使用する'
と、読者はそれを短縮形として誤って解釈する可能性があります。で囲まれたテキストのパッセージの他の意味'
は、「口語的な」意味を示します。既存の言語と一貫性を保つことは理にかなっており、これによりコードの学習と解釈が容易になる可能性があります。"I'm going to the mall"
それ以外の場合はエスケープされたバージョン:を考慮してください'I\'m going to the mall'
。二重引用符は、他の多くの言語の文字列を意味します。JavaやCのような新しい言語を学ぶときは、常に二重引用符が使用されます。Ruby、PHP、Perlでは、単一引用符で囲まれた文字列はバックスラッシュエスケープを意味しませんが、二重引用符はそれらをサポートします。
JSON表記は二重引用符で囲みます。
それにもかかわらず、他の人が述べたように、一貫性を保つことが最も重要です。
仕様のセクション7.8.4は、リテラル文字列表記について説明しています。唯一の違いは、DoubleStringCharacterが「SourceCharacterであるが二重引用符ではない」であり、SingleStringCharacterが「SourceCharacterであるが単一引用符ではない」ということです。したがって、唯一の違いはこうして示すことができます:
'A string that\'s single quoted'
"A string that's double quoted"
したがって、エスケープする引用の量によって異なります。明らかに、二重引用符で囲まれた文字列の二重引用符にも同じことが当てはまります。
"{\"name\": \"Peter\"}"
対'{"name": "Peter"}'
?確かに、これは同じ違いだと言えるかもしれませんが、上記の例とは異なる方法で決定に影響を与えることは確かです。
その違いは純粋に文体的なものだと言いたいのですが、本当に疑問があります。次の例を考えてみます。
/*
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、およびInternet Explorer(IE7およびIE8でテスト済み)では、次の結果が返されます。
function () {
return this.replace(/^\s+|\s+$/g, '');
}
function trim(str) {
return str.replace(/^\s+|\s+$/g, '');
}
ただし、Firefoxの結果は少し異なります。
function () {
return this.replace(/^\s+|\s+$/g, "");
}
function trim(str) {
return str.replace(/^\s+|\s+$/g, "");
}
一重引用符は二重引用符に置き換えられました。(また、インデントスペースが4つのスペースに置き換えられたことにも注意してください。)これにより、少なくとも1つのブラウザーがJavaScriptを内部的に解析し、すべてが二重引用符を使用して記述されているかのように見えます。すべてがこの「標準」に従ってすでに記述されている場合、JavaScriptを解析するためにFirefoxにかかる時間が短くなると考えるかもしれません。
ちなみに、コードでは一重引用符の方がずっと見栄えが良いと思うので、とても悲しいパンダになります。さらに、他のプログラミング言語では、通常、二重引用符よりも高速に使用できるため、同じことがJavaScriptに適用された場合にのみ意味があります。
結論:これについてさらに調査する必要があると思います。
編集:これは、2003年のピーターポールコッホのテスト結果を説明している可能性があります。
Explorer Windowsでは、シングルクォートの方が速い場合があります(私のテストの約1/3は応答時間が速いことを示しています)が、Mozillaがまったく異なる場合は、ダブルクォートをわずかに速く処理します。Operaにはまったく違いがありませんでした。
Edit 2014: Firefox / Spidermonkeyの最新バージョンでは、これはもう行われません。
.toString
が、現在は元のコピーを返します。最新のFirefoxにはこの問題はありません。
インラインJavaScriptを実行している場合(おそらく「悪い」ことですが、その議論は避けてください)、単一引用符が文字列リテラルの唯一のオプションであると私は信じています。
たとえば、これは正常に動作します。
<a onclick="alert('hi');">hi</a>
しかし、私が知っているエスケープメソッドを使用して、 "hi"を二重引用符で囲むことはできません。"
私の推測ではそれでも(HTMLの属性値で引用符をエスケープしているため)、Firefoxでは機能しません。 \"
この時点ではJavaScriptではなくHTMLにエスケープしているため、どちらも機能しません。
したがって、ゲームの名前に一貫性があり、アプリの一部でインラインJavaScriptを実行する場合は、一重引用符が適していると思います。私が間違っているのなら誰かが私を訂正してください。
<a onclick="alert(%22hi%22);">hi</a>
、メモリからこれは機能しますが、href属性にあった可能性があります<a href="javascript:alert(%22hi%22);">hi</a>
alert("hi")
有効なJavaScriptではありません。ただし、属性の値はエンコードされます。w3.org/TR/html4/intro/sgmltut.html#didx-attribute
"
HTML属性内の二重引用符をエスケープする正しい方法です。Firefoxでは正常に動作します。@ Denilson、XML(したがってXHTML)では、一重引用符と二重引用符の両方を使用できます。w3.org/TR/REC-xml/#d0e888AttValue
にあるXML仕様のリテラルを参照してください。
技術的には違いはありません、それはスタイルと慣習の問題だけです。
Douglas Crockfordは、内部文字列には一重引用符を使用し、外部には二重引用符を使用することをお勧めします(外部とは、メッセージやアラートなど、アプリケーションのユーザーに表示されるものを意味します)。
私は個人的にそれに従います。
厳密に言えば、意味に違いはありません。したがって、選択は利便性に帰着します。
ここにあなたの選択に影響を与える可能性のあるいくつかの要因があります:
リファレンスが何をするか見てみましょう。
jquery.js内では、すべての文字列が二重引用符で囲まれています。
したがって、今から、二重引用符で囲まれた文字列を使用します。(私はシングルを使用していました!)
使用するものに一貫性を持たせてください。ただし、快適さを落とさないでください。
"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アップデート
テンプレートリテラル構文の使用。
`Be "my" guest. You're in complete freedom.`; // most comfort :D
それは主にスタイルと好みの問題です。他の回答には、かなり興味深く有用な技術的な調査があるので、おそらく私が追加できる唯一のものは、少し世俗的なアドバイスを提供することです。
場合あなたが会社やチームでコーディングしている、そしてそれはおそらく「ハウススタイル」に従うことをお勧めします。
場合はあなただけでは、いくつかのサイドプロジェクトをハッキングしている、そしてコミュニティの数著名な指導者を見てください。たとえば、Node.jsにアクセスしたとします。コアモジュール、たとえばunderscore.jsまたはexpressを見て、それらが使用する規則を確認し、それに従うことを検討してください。
場合は、両方の規則が均等に使用され、その後、延期あなたの個人的に
好み。
場合あなたは何の個人的な好みを持っていない、そして、コインを投げます。
あなたがコインを持っていない場合、ビールは私にあります;)
私は明白なものを追加しないことを望みますが、私はこれに関してDjangoとAjaxとJSON と格闘してきました。
HTMLコードで通常どおりに二重引用符を使用すると仮定すると、JavaScriptの残りの部分には単一引用符を使用することを強くお勧めします。
@adyに同意しますが、注意が必要です。
私の結論は、JavaScriptではおそらく問題ではありませんが、HTMLなどに埋め込むとすぐに問題が発生し始めます。文字列を実際にエスケープ、読み取り、渡しているものを知っている必要があります。
私の単純なケースは:
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の3番目のフィールドで\ 'を見つけることができます。
二重引用符が機能しませんでした!
理由は明らかですが、単一引用符を使用する必要がある理由も明らかです... ..
このケースは非常に単純なHTML埋め込みであり、エラーは「二重引用符で囲まれた」JavaScriptコードからの単純なコピー/貼り付けによって生成されました。
だから質問に答えるために:
HTML内では単一引用符を使用してください。いくつかのデバッグ問題を保存するかもしれません...
これが今日の世界に関連しているかどうかはわかりませんが、制御文字を処理する必要があるコンテンツには二重引用符を使用し、処理しない文字列には単一引用符を使用していました。
コンパイラーは、二重引用符で囲まれた文字列に対して文字列操作を実行しますが、一重引用符で囲まれた文字列はそのままです。これは、「優れた」開発者が\n
またはなどの制御文字を含まない文字列に一重引用符\0
(一重引用符内で処理されない)を使用することを選択することにつながりました。文字列の処理)。
jshintを使用している場合使用すると、二重引用符の文字列を使用している場合、それはエラーが発生します。
AngularJSのYeoman scafflholdingを介して使用しましたが、おそらくこれを構成する方法があります。
ちなみに、HTMLをJavaScriptで処理する場合は、単一引用符を使用する方が簡単です。
var foo = '<div class="cool-stuff">Cool content</div>';
そして、少なくともJSONは、二重引用符を使用して文字列を表します。
あなたの質問に答える簡単な方法はありません
パフォーマンスについて言えば、見積もりがボトルネックになることは決してありませんが、パフォーマンスはどちらの場合でも同じです。
コーディング速度について言えば'
、文字列の区切りに使用する場合は、"
引用符をエスケープする必要があります。次の"
例のように、文字列内で使用する必要がある可能性が高くなります。
//JSON Objects:
var jsonObject = '{"foo":"bar"}';
//HTML attributes:
document.getElementById("foobar").innerHTML = '<input type="text">';
次に、'
文字列を区切るためにを使用したいので、エスケープする文字を少なくする必要があります。
単一引用符を使用する(愚かな)理由の1つは、シフトキーを押して入力する必要がないのに対して、二重引用符を使用するためです。(平均的な文字列はエスケープを必要としないと想定しています。これは妥当な仮定です。)ここで、毎日200行のコードをコーディングするとします。多分それらの200行で私は30の引用符を持っています。おそらく、二重引用符を入力する方が、単一引用符を入力するよりも0.1秒長くかかります(シフトキーを押す必要があるため)。それから、どんな日にでも、私は3秒を無駄にします。この方法でコードを1年に200日間、40年間コーディングすると、6.7時間の無駄になります。思考の糧。
var description = "This is a \"quick\" test";
上英語キーボード。英語キーボードの場合、小指は、AキーからQキーに移動するのではなく、左のシフトキーから最上列のQキーに移動する必要があります。つまり、2倍の距離を移動する必要があります。 。ドイツ語のキーボードのどこにキーがあるのかはわかりませんが、同様の例があると思います
長所と短所を調べる
一重引用符を支持して
elem.innerHTML = '<a href="' + url + '">Hello</a>';
elem.innerHTML = "<a href='" + url + "'>Hello</a>";
さらに、インラインHTMLは通常アンチパターンです。テンプレートを優先します。
myJson = '{ "hello world": true }';
繰り返しますが、JSONをこの方法で構築する必要はありません。多くの場合、JSON.stringify()で十分です。そうでない場合は、テンプレートを使用します。
二重引用符を支持する
両方を支持して
JavaScriptの2つの間に違いはありません。そのため、現時点で便利なものは何でも使用できます。たとえば、次の文字列リテラルはすべて同じ文字列を生成します。
"He said: \"Let's go!\""
'He said: "Let\'s go!"'
"He said: \"Let\'s go!\""
'He said: \"Let\'s go!\"'
内部文字列には一重引用符、外部文字列には二重引用符。これにより、ユーザーに表示される(またはディスクに書き込まれる)文字列と内部定数を区別できます。明らかに、後者をコードに含めることは避けなければなりませんが、それが常にできるわけではありません。
二重引用符から単一引用符に移行する理由としてもう1つ考慮すべきことは、サーバー側スクリプトの人気の増加です。PHPを使用する場合、PHPで文字列と変数を使用して変数を渡し、JavaScript関数を解析できます。
文字列を記述し、PHPに二重引用符を使用する場合、一重引用符をエスケープする必要はありません。PHPは変数の値を自動的に取得します。
例:サーバーの変数を使用してJavaScript関数を実行する必要があります。
public static function redirectPage( $pageLocation )
{
echo "<script type='text/javascript'>window.location = '$pageLocation';</script>";
}
これにより、文字列の結合に対処する必要がなくなり、PHPからJavaScriptを効果的に呼び出すことができます。これは1つの例にすぎませんが、これがプログラマーがJavaScriptで単一引用符にデフォルト設定するいくつかの理由の1つである可能性があります。
PHPドキュメントからの引用:「二重引用符で囲まれた文字列の最も重要な機能は、変数名が展開されることです。詳細については、文字列の解析を参照してください。」
パフォーマンスの違いを見ると主張する人がいます:古いメーリングリストのスレッド。しかし、確認できるものが見つかりませんでした。
主なことは、文字列内で使用している引用符(二重または単一)の種類を調べることです。それは脱出の数を低く保つのに役立ちます。たとえば、文字列内でhtmlを使用している場合、一重引用符を使用する方が簡単なので、属性を囲む二重引用符をすべてエスケープする必要はありません。
一重引用符を使用できない場合は二重引用符を使用します(逆も同様)。
"'" + singleQuotedValue + "'"
'"' + doubleQuotedValue + '"'
の代わりに:
'\'' + singleQuotedValue + '\''
"\"" + doubleQuotedValue + "\""
JavaScriptでは、一重引用符と二重引用符に違いはありません。
仕様は重要です:
パフォーマンスの違いがあるかもしれませんが、それは絶対に最小限であり、ブラウザの実装に応じて毎日変わる可能性があります。JavaScriptアプリケーションの長さが数十万でない限り、これ以上の議論は無駄です。
それはベンチマークのようなものです
a=b;
より速い
a = b;
(余分なスペース)
今日、特定のブラウザやプラットフォームなどで
CoffeeScriptを使用するときは、二重引用符を使用します。私はあなたがどちらかを選んでそれに固執すべきだということに同意します。CoffeeScriptは、二重引用符を使用するときに補間を提供します。
"This is my #{name}"
ES6はテンプレート文字列にバックティック( `)を使用しています。これにはおそらく正当な理由がありますが、コード化するときに、補間機能を得るために文字列リテラル文字を引用符または二重引用符からバックティックに変更するのは面倒な場合があります。CoffeeScriptは完璧ではないかもしれませんが、どこでも同じ文字列リテラル文字(二重引用符)を使用し、常に補間できるのは素晴らしい機能です。
`This is my ${name}`
以下を20回ほど走らせています。また、二重引用符の方が約20%速いようです。
楽しい部分は、パート2とパート1を変更すると、単一引用符が約20%速くなることです。
//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));
var dummy_date = new Date()
最初に追加
厳密に違いはないので、エスケープの数を低く抑えるには、好みと文字列の内容(またはJSコード自体が文字列の場合)の問題がほとんどです。
速度の違いの伝説は、2つの引用符の動作が異なるPHPの世界に由来する可能性があります。
Googleクロージャーコンパイラが一重引用符を二重引用符に変換するので、それがより高速である、または利点があるかもしれないというすべての回答を読んだ後、二重引用符がより良いまたはおそらくより高速であると思います。
2020年になりましたので、JavaScriptの3番目のオプション、つまりすべてに対して単一のバックティックを検討する必要があります。
これは、単一引用符または二重引用符の代わりにどこでも使用できます。
それはあなたがすべてのことをすることを可能にします!
それは複数の行を許可します: `
この
作る
Javascript
いいね!
`
また、他の2つを置き換えるときにパフォーマンスが低下することもありません 。
あなたのJSソースが:
elem.innerHTML="<img src='smily' alt='It\'s a Smily' style='width:50px'>";
HTMLソースは次のようになります。
<img src="smiley" alt="It's a Smiley" style="width:50px">
またはHTML5の場合
<img src=smiley alt="It's a Smiley" style=width:50px>
JSはそのような配列を許可します:
var arr=['this','that'];
しかし、それを文字列化すると、互換性のある理由になります。
JSON=["this","that"]
これには時間がかかると思います。
私の2セントを追加するだけです:数年前にJSとPHPの両方を操作するとき、エスケープ文字( '\')をエスケープすることなく入力できるように、単一引用符を使用することに慣れてきました。私は通常、ファイルパスなどで生の文字列を入力するときに使用しました(http://en.wikipedia.org/wiki/String_literal#Raw_strings)
とにかく、私の慣習は、識別子タイプの生の文字列if (typeof s == 'string') ...
(エスケープ文字は決して使用されない-ずっと)などの単一引用符、および"Hey、what's up?"などのテキストの二重引用符の使用になりました。識別子名を表示する表記規則として、コメントに一重引用符も使用しています。これは単なる経験則であり、HTML文字列を入力するときなど、必要な場合にのみ中断します'<a href="#"> like so <a>'
(ここで引用符を逆にすることもできます)。JSONの場合、名前に二重引用符が使用されていることも知っていますが、それ以外では、個人的には、引用符間のテキストにエスケープが必要ない場合は一重引用符を使用しますdocument.createElement('div')
。
結論として、一部の人が言及/言及したように、慣習を選び、それを守り、必要な場合にのみ逸脱してください。