Когда использовать двойные или одинарные кавычки в JavaScript?

StackOverflow https://stackoverflow.com/questions/242813

  •  04-07-2019
  •  | 
  •  

Вопрос

console.log("double"); против console.log('single');

Я вижу, что все больше и больше библиотек JavaScript используют одинарные кавычки при обработке строк.Каковы причины использовать один вместо другого?Я думал, они вполне взаимозаменяемы.

Это было полезно?

Решение

Наиболее вероятной причиной использования одинарного или двойного в разных библиотеках является предпочтение программиста и / или согласованность API.

Кроме согласованности, используйте в зависимости от того, какая строка лучше всего подходит.

Использование другого типа цитаты как литерала:

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

& # 8230; но это может усложниться & # 8230;

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, следует отметить, что строго говоря, строки JSON должны заключаться в двойные кавычки. Конечно, многие библиотеки также поддерживают одинарные кавычки, но у меня были большие проблемы в одном из моих проектов, прежде чем я понял, что одиночные кавычки строки на самом деле не соответствуют стандартам JSON.

Нет лучшего решения;однако я хотел бы утверждать, что иногда двойные кавычки могут быть более желательны:

  • Новички уже знакомы с двойными кавычками на своем языке..В английском языке мы должны использовать двойные кавычки " определить отрывок цитируемого текста.Если бы мы использовали одну кавычку ', читатель может ошибочно принять это за сокращение.Другое значение отрывка текста, окруженного ' указывает на «разговорное» значение.Имеет смысл придерживаться уже существующих языков, и это, вероятно, может облегчить изучение и интерпретацию кода.
  • Двойные кавычки устраняют необходимость избегать апострофов. (как при схватках).Рассмотрим строку: "I'm going to the mall", против.иначе экранированная версия: 'I\'m going to the mall'.
  • Двойные кавычки означают строку во многих других языках..Когда вы изучаете новый язык, например Java или C, всегда используются двойные кавычки.В Ruby, PHP и Perl строки в одинарных кавычках не подразумевают использования обратной косой черты, тогда как двойные кавычки поддерживают их.

  • Обозначение JSON записывается в двойных кавычках.

Тем не менее, как заявляли другие, наиболее важно оставаться последовательным.

Различие только проявляется в следующем:

'A string that\'s single quoted'

"A string that's double quoted"

Итак, это зависит только от того, сколько вы хотите сделать, избегая цитаты. Очевидно, то же самое относится к двойным кавычкам в двойных кавычках.

Одиночные кавычки

Я бы хотел, чтобы двойные кавычки были стандартом, потому что они иметь немного больше смысла, но я продолжаю использовать одинарные кавычки, потому что они доминируют на сцене.

Одиночные кавычки:

Нет предпочтений:

Двойные кавычки:

Я бы хотел сказать, что разница чисто стилистическая, но у меня действительно есть сомнения. Рассмотрим следующий пример:

/*
   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, "");
}

Одинарные кавычки заменены на двойные. (Также обратите внимание, как пространство отступа было заменено четырьмя пробелами.) Создается впечатление, что по крайней мере один браузер внутренне анализирует JavaScript, как если бы все было написано с использованием двойных кавычек. Можно подумать, что Firefox занимает меньше времени для разбора JavaScript, если все уже написано в соответствии с этим «стандартом».

Что, кстати, делает меня очень грустной пандой, так как я думаю, что одиночные кавычки выглядят намного лучше в коде. Кроме того, в других языках программирования они обычно используются быстрее, чем двойные кавычки, поэтому это будет иметь смысл только в том случае, если это применимо к JavaScript.

Заключение: я думаю, что нам нужно провести больше исследований по этому вопросу.

Изменить . Это может объяснить Peter- Результаты теста Пола Коха в далеком 2003 году.

  

Кажется, что одинарные кавычки иногда быстрее в Windows Explorer (примерно 1/3 моих тестов показывали более быстрое время отклика), но если Mozilla вообще показывает разницу, он обрабатывает двойные кавычки немного быстрее Я не обнаружил никакой разницы в Opera.

Редактировать 2014 год: современные версии Firefox / Spidermonkey don & # 8217; не делайте этого больше.

Если вы используете встроенный JavaScript (возможно, " плохой " вещь, но избегаете этого обсуждения) single , кавычки - ваш единственный вариант для строковых литералов, я полагаю .

Например, это прекрасно работает.

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

Но вы не можете завершить " hi " в двойных кавычках, через любой способ побега, о котором я знаю. Даже &quot; , который был бы моим лучшим предположением (поскольку вы избегаете кавычек в значении атрибута HTML), не работает для меня в Firefox. \" также не будет работать, потому что в этот момент вы переходите на HTML, а не на JavaScript.

Итак, если название игры - последовательность, и вы собираетесь использовать встроенный JavaScript-код в некоторых частях своего приложения, я думаю, что одинарные кавычки - победитель. Кто-то, пожалуйста, поправьте меня, если я ошибаюсь.

Технически нет никакой разницы, это только вопрос стиля и соглашения.

Дуглас Крокфорд рекомендует использовать одинарные кавычки для внутренних строк и двойные кавычки для внешних (под внешними мы подразумеваем те, которые должны отображаться пользователю приложения, например сообщения или оповещения).

Я лично следую за этим.

ОБНОВЛЕНИЕ. Похоже, что мистер Крокфорд передумал и теперь рекомендует использовать двойные кавычки:)

Строго говоря, разницы в значении нет;так что выбор сводится к удобству.

Вот несколько факторов, которые могут повлиять на ваш выбор:

  • Стиль дома:Некоторые группы разработчиков уже используют то или иное соглашение.
  • Требования к клиентской стороне:Будете ли вы использовать кавычки внутри строк?(См. ответ Ади).
  • Серверный язык:Пользователи VB.Net могут использовать одинарные кавычки для java-скриптов, чтобы сценарии можно было создавать на стороне сервера (VB.Net использует двойные кавычки для строк, поэтому строки java-скриптов легко отличить, если они используют одинарные кавычки). ).
  • Код библиотеки:Если вы используете библиотеку, использующую определенный стиль, вы можете рассмотреть возможность использования того же стиля самостоятельно.
  • Личное предпочтение:Возможно, вам покажется, что тот или иной стиль выглядит лучше.

Давайте посмотрим, что делает ссылка.

Внутри jquery.js каждая строка заключена в двойные кавычки.

Итак, теперь я буду использовать строки в двойных кавычках. (Я использовал сингл!)

В основном это вопрос стиля и предпочтений.В других ответах есть довольно интересные и полезные технические исследования, поэтому, пожалуй, единственное, что я мог бы добавить, — это дать небольшой житейский совет.

  • Если вы программируете в компании или команде, затем Вероятно, это хорошая идея, чтобы Следуйте «домашнему стилю».

  • Если ты один взломал несколько побочных проектов, затем взгляните на нескольких выдающихся лидеров сообщества.Например, допустим, вы начинаете работать с Node.js.Взгляните на основные модули, например, подчеркивание .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="/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.

Двойная кавычка не сработала!

Понятно почему, но также понятно, почему мы должны придерживаться одинарных кавычек ... .. Я думаю ..

Это случай очень простого встраивания HTML, сгенерирована ошибка простым копированием / вставкой из кода JavaScript с двойными кавычками.

Итак, чтобы ответить на вопрос:

Попробуйте использовать одинарные кавычки в HTML. Это может спасти пару проблем отладки ...

Просто соблюдайте последовательность в том, что вы используете. Но не снижайте уровень комфорта.

"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

Не уверен, что это актуально в современном мире, но двойные кавычки использовались для контента, который должен обрабатываться управляющими символами, и одинарные кавычки для строк, которые этого не делали.

Компилятор будет запускать манипуляции со строками для строки в двойных кавычках, оставляя строку в одинарных кавычках буквально нетронутой. Раньше это приводило к тому, что «хорошие» разработчики предпочитали использовать одинарные кавычки для строк, которые не содержали управляющих символов, таких как \n или \0 (не обрабатываются в одинарных кавычках), и двойные кавычки, когда им нужно было проанализировать строку (при небольшая стоимость в процессорных циклах для обработки строки).

Если вы используете jshint , возникнет ошибка, если вы используете строку в двойных кавычках.

Я использовал его через Yeoman леса AngularJS, но, возможно, есть какой-то способ настроить это.

Кстати, когда вы обрабатываете 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">';

Затем я предпочитаю использовать <=> для разделения строки, поэтому мне нужно экранировать меньше символов.

Одна (глупая) причина использовать одинарные кавычки в том, что они не требуют от вас нажатия клавиши Shift для их ввода, тогда как двойные кавычки делают. (Я предполагаю, что средняя строка не требует экранирования, что является разумным предположением.) Теперь давайте предположим, что каждый день я кодирую 200 строк кода. Может быть, в этих 200 строках у меня 30 цитат. Возможно, ввод двойной кавычки занимает на 0,1 секунды больше времени, чем ввод одинарной кавычки (потому что я должен нажать клавишу Shift). Затем в любой день я трачу 3 секунды. Если я буду кодировать таким образом 200 дней в году в течение 40 лет, то я потрачу впустую 6,7 часа своей жизни. Пища для размышлений.

Рассмотрение плюсов и минусов

В пользу одинарных кавычек

  • Меньше визуального беспорядка.
  • Генерация HTML:Атрибуты HTML обычно заключаются в двойные кавычки.

elem.innerHTML = '<a href="' + url + '">Hello</a>';
Однако одинарные кавычки также допустимы в HTML.

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

Более того, встроенный HTML обычно является антишаблоном.Отдавайте предпочтение шаблонам.

  • Генерация JSON:В JSON разрешены только двойные кавычки.

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

Опять же, вам не обязательно создавать JSON таким образом.JSON.stringify() часто бывает достаточно.Если нет, используйте шаблоны.

В пользу двойных кавычек

  • Двойников легче обнаружить, если у вас нет цветовой кодировки.Например, в журнале консоли или в какой-то настройке источника представления.
  • Сходство с другими языками:В командном программировании (Bash и т. д.) существуют строковые литералы в одинарных кавычках, но внутри них не интерпретируются escape-последовательности.C и Java используют двойные кавычки для строк и одинарные кавычки для символов.
  • Если вы хотите, чтобы код был действительным в формате JSON, вам нужно использовать двойные кавычки.

В пользу обоих

В JavaScript между ними нет разницы.Поэтому вы можете использовать все, что удобно в данный момент.Например, следующие строковые литералы создают одну и ту же строку:

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

Одинарные кавычки для внутренних строк и двойные для внешних.Это позволяет вам отличать внутренние константы от строк, которые должны отображаться пользователю (или записываться на диск и т. д.).Очевидно, что вам следует избегать использования последнего в своем коде, но это не всегда возможно.

Еще одна вещь, которую вы могли бы рассмотреть в качестве причины перехода от двойных к одиночным кавычкам, - это рост популярности серверных сценариев. При использовании PHP вы можете передавать переменные и анализировать функции JavaScript, используя строки и переменные в PHP.

Если вы пишете строку и используете двойные кавычки для своего PHP, вам не нужно избегать ни одной из одинарных кавычек, и PHP автоматически получит значение переменных для вас.

Пример: мне нужно запустить функцию javascript, используя переменную с моего сервера.

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

Это избавляет меня от хлопот, связанных с объединением строк, и я могу эффективно вызывать JavaScript из PHP. Это только один пример, но это может быть одной из нескольких причин, почему программисты по умолчанию используют одинарные кавычки в javascript.

Цитата из документов PHP : " Наиболее важной особенностью строк в двойных кавычках является тот факт, что имена переменных будут расширены. Смотрите разбор строк для деталей. Quot &;

Я бы использовал двойные кавычки, когда нельзя использовать одинарные кавычки, и наоборот:

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

Вместо:

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

В JavaScript нет разницы между одинарными и двойными кавычками.

Спецификация важна:

Возможно, существуют различия в производительности, но они абсолютно минимальны и могут меняться каждый день в зависимости от реализации браузера. Дальнейшее обсуждение бесполезно, если ваше приложение JavaScript не имеет длины в сотни тысяч.

Это похоже на тест, если

a=b;

быстрее чем

a = b;

(дополнительные пробелы)

сегодня, в конкретном браузере и платформе и т. д.

При использовании CoffeeScript я использую двойные кавычки. Я согласен, что вы должны выбрать любой из них и придерживаться его. CoffeeScript дает вам интерполяцию при использовании двойных кавычек.

"This is my #{name}"

ES6 использует обратные галочки (`) для строк шаблона. Что, вероятно, имеет вескую причину, но при кодировании может быть затруднительно изменить символ строковых литералов с кавычек или двойных кавычек на обратные тики, чтобы получить возможность интерполяции. CoffeeScript может быть не идеальным, но использование везде одинаковых символов строковых литералов (двойные кавычки) и всегда возможность интерполировать - хорошая функция.

`This is my ${name}`

Есть люди, которые утверждают, что видят различия в производительности: старая ветка списка рассылки . Но я не смог найти ни одного из них, чтобы подтвердить.

Главное - посмотреть, какие кавычки (двойные или одинарные) вы используете внутри своей строки. Это помогает сохранить количество побегов на низком уровне. Например, когда вы работаете с html внутри ваших строк, проще использовать одинарные кавычки, чтобы вам не пришлось экранировать все двойные кавычки вокруг атрибутов.

Если вы перепрыгиваете вперед между JavaScript и C #, лучше потренировать пальцы для общего соглашения, заключающегося в двойных кавычках.

Я выполнял следующее примерно 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));

После прочтения всех ответов, в которых говорится, что это может быть быстрее или, возможно, иметь преимущества, я бы сказал, что двойная кавычка лучше, а может, и быстрее, потому что компилятор закрытия Google конвертирует одинарные кавычки в двойные.

Различий строго нет, поэтому в основном это зависит от вкуса и от того, что находится в строке (или если сам код JS находится в строке), чтобы сохранить число экранированных символов на низком уровне.

Легенда о разнице в скорости может происходить из мира PHP, в котором две кавычки ведут себя по-разному.

Если ваш источник 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 несколько лет назад, я привык использовать одинарные кавычки, поэтому могу набирать escape-символ ('\'), не прибегая к его экранированию. , Я обычно использовал его при наборе необработанных строк с путями к файлам и т. Д. ( http: //en.wikipedia. орг / вики / String_literal # Raw_strings )

Во всяком случае, мое соглашение в конечном итоге стало использование одинарных кавычек в необработанных строках идентификатора, таких как if (typeof s == 'string') ... (в которых escape-символы никогда не будут использоваться - никогда), и двойных кавычек для текстов , например, " Эй, как дела? " ;. Я также использую одинарные кавычки в комментариях как типографское соглашение, чтобы показать имена идентификаторов. Это всего лишь практическое правило, и я прекращаю работу только тогда, когда это необходимо, например, при вводе HTML-строк '<a href="#"> like so <a>' (хотя здесь вы также можете изменить кавычки). Мне также известно, что в случае JSON для имен используются двойные кавычки - но за этим лично я предпочитаю одинарные кавычки, когда экранирование никогда требуется для текста между кавычками - как document.createElement('div').

Итог, и, как некоторые упоминали / ссылались на него, выбирайте соглашение, придерживайтесь его и отклоняйтесь только при необходимости.

Вы можете использовать одинарные или двойные кавычки. Это позволяет вам, например, легко вкладывать javascript в атрибуты HTML без необходимости экранировать кавычки. То же самое, когда вы создаете JavaScript с помощью PHP.

Общая идея такова: если это возможно, используйте такие кавычки, которые вам не понадобятся. Меньше экранирования = лучший код.

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top