Когда пишешь JavaScript , очень часто приходится лазить по интернету в поисках информации о синтаксисе и параметрах для методов, работающих со строками.
Я прочитал множество статей по работе со строками. В данном посте будет показаны примеры и краткие описания наиболее распространенных методов по работе со строками. Я попытался поставить самые частые методы в верхней части для быстрого ознакомления.
Конечно, большинство опытных разработчиков уже достаточно знакомы со многими из методов, но я думаю, что это хороший список для начинающих, чтобы понимать спектр методов, которые могут помочь выполнить сложные операции простыми средствами.
Конвертирование в String
Вы можете конвертировать число, булево выражение или объект в строку:
Var myNumber = 24; // 24 var myString = myNumber.toString(); // "24"
Вы можете сделать это так же с помощью String() :
Var myNumber = 24; // 24 var myString = String(myNumber); // "24"
Если вы не уверены, что значение не является null или undefined , вы можете использовать String() , которая всегда возвращает строку, независимо от типа значения.
Разделение строки в подстроки
Чтобы разделить строки в массив подстрок, вы можете использовать метод split():
Var myString = "coming,apart,at,the,commas"; var substringArray = myString.split(","); // ["coming", "apart", "at", "the", "commas"] var arrayLimited = myString.split(",", 3); // ["coming", "apart", "at"]
Как видно в последней строке, второй параметр функции — это лимит количества элементов, которое будет в итоговом массиве.
Получение длины строки
Чтобы найти, сколько символов в строки, мы используем свойство length:
Var myString = "You"re quite a character."; var stringLength = myString.length; // 25
Поиск подстроки в строке
Есть два метода для поиска подстроки:
Использование indexOf() :
Var stringOne = "Johnny Waldo Harrison Waldo"; var wheresWaldo = stringOne.indexOf("Waldo"); // 7
indexOf() метод начинает поиск подстроки с начала строки, и возвращает позицию начала первого вхождения подстроки. В данном случае — 7 позиция.
Использование lastIndexOf() :
Var stringOne = "Johnny Waldo Harrison Waldo"; var wheresWaldo = stringOne.lastIndexOf("Waldo"); // 22
Метод возвращает начальную позицию последнего вхождения подстроки в строку.
В обоих методах, если подстрока не найдена, возвращается значение -1, и оба принимают необязательный второй аргумент, указывающий положение в строке, где вы хотите начать поиск. Таким образом, если второй аргумент «5», indexOf() начинает поиск с 5 символа, игнорируя символы 0-4, в то время как lastIndexOf() начинает поиск с символа 5 и идет в обратном направлении, игнорируя символы 6 и дальше.
Замена подстроки
Чтобы заменить вхождение подстроки в строке на другую подстроку, вы можете использовать replace() :
Var slugger = "Josh Hamilton"; var betterSlugger = slugger.replace("h Hamilton", "e Bautista"); console.log(betterSlugger); // "Jose Bautista"
Первый аргумент — то, что вы хотите заменить и второй аргумент — новая строка. Функция заменяет только первое вхождение подстроки в строку.
Чтобы заменить все вхождения, нужно использовать регулярное выражение с глобальным флагом:
Var myString = "She sells automotive shells on the automotive shore"; var newString = myString.replace(/automotive/g, "sea"); console.log(newString); // "She sells sea shells on the sea shore"
Второй аргумент может включать специальный шаблон или функцию. Подробней можно почитать .
Получить символ по заданной позиции в строке
Получить символ мы можем с помощью функции charAt() :
Var myString = "Birds of a Feather"; var whatsAtSeven = myString.charAt(7); // "f"
Как часто бывает в JavaScript, первая позиция в строке начинается с 0, а не с 1.
В качестве альтернативной функции можно использовать charCodeAt() функцию, которая код символа.
Var myString = "Birds of a Feather"; var whatsAtSeven = myString.charCodeAt(7); // "102" var whatsAtEleven = myString.charCodeAt(11); // "70"
Заметьте, что код для символа «F» (11 позиция) другой, нежели у символа «f» (позиция 7).
Соединение строк
В большинстве случаем, чтобы соединить строки, можно использовать оператор «+». Но так же можно использовать метод concat() :
Var stringOne = "Knibb High football "; var stringTwo = stringOne.concat("rules."); // "Knibb High football rules"
Таким способом мы можем соединить множество строк в одну в том порядке, в котором они записаны:
Var stringOne = "Knibb "; var stringTwo = "High "; var stringThree = "football "; var stringFour = "rules."; var finalString = stringOne.concat(stringTwo, stringThree, stringFour); console.log(finalString); // "Knibb high football rules."
Извлечение подстроки
Есть 3 способа получения строки из части другой строки:
Используя slice() :
Var stringOne = "abcdefghijklmnopqrstuvwxyz"; var stringTwo = stringOne.slice(5, 10); // "fghij"
Используя substring() :
Var stringOne = "abcdefghijklmnopqrstuvwxyz"; var stringTwo = stringOne.substring(5, 10); // "fghij"
В обеих функция первый параметр — символ, с которого начинает подстрока (начиная с 0 позиции) и второй аргумент (необязательный) — позиция символа, до которого возвращается подстрока. В примере (5, 10) возвращается строка между позицией 5 и 9.
Используя substr() :
Var stringOne = "abcdefghijklmnopqrstuvwxyz"; var stringTwo = stringOne.substr(5, 10); // "fghijklmno"
Первый аргумент — позиция символа, с которого начинается новая строка и второй аргумент — количество символов от начальной позиции новой строки. Т.е. (5, 10) возвращает 10 символов, начиная с 5 позиции.
Перевод строки в верхний или нижний регистр.
Есть 4 метода для перевода. Первые 2 переводят строку в верхний регистр:
Var stringOne = "Speak up, I can"t hear you."; var stringTwo = stringOne.toLocaleUpperCase(); // "SPEAK UP, I CAN"T HEAR YOU" var stringThree = stringOne.toUpperCase(); // "SPEAK UP, I CAN"T HEAR YOU"
Другие 2 переводят строку в нижний регистр:
Var stringOne = "YOU DON"T HAVE TO YELL"; var stringTwo = stringOne.toLocaleLowerCase(); // "you don"t have to yell" var stringThree = stringOne.toLowerCase(); // "you don"t have to yell"
Лучше использовать «locale» методы, т.к. в разных местах, например, в Турции отображение регистров работает не совсем так, как мы привыкли и поэтому результат может быть тот, который мы хотели. Если использовать «locale» методы, то таких проблем не будет.
Pattern Matching
Соответствие по шаблону в строке может быть использовано с помощью 2-х методов, которые работают по-разному.
Метод match() применяется к строке и он принимает в качестве параметра регулярное выражение:
Var myString = "How much wood could a wood chuck chuck"; var myPattern = /.ood/; var myResult = myString.match(myPattern); // ["wood"] var patternLocation = myResult.index; // 9 var originalString = myResult.input // "How much wood could a wood chuck chuck"
Метод exec() применяется к объекту регулярного выражения и принимает в качестве параметра строку:
Var myString = "How much wood could a wood chuck chuck"; var myPattern = /.huck/; var myResult = myPattern.exec(myString); // ["chuck"] var patternLocation = myResult.index; // 27 var originalString = myResult.input // "How much wood could a wood chuck chuck"
В обоих методах возвращается лишь первое совпадение. Если совпадений не было — возвращается null.
Так же можно использовать метод search() , который принимает регулярное выражение и возвращает позицию первого совпадения по шаблону:
Var myString = "Assume"; var patternLocation = myString.search(/ume/); // 3
Если совпадений не было — возращается «-1 «.
Сравнение двух строк для сортировки
Вы можете сравнить 2 строки, чтобы определить, какая их них идет первая по алфавиту. Для этого воспользуемся методом localeCompare() , который возвращает 3 возможных значения:
Var myString = "chicken"; var myStringTwo = "egg"; var whichCameFirst = myString.localeCompare(myStringTwo); // -1 (Chrome returns -2) whichCameFirst = myString.localeCompare("chicken"); // 0 whichCameFirst = myString.localeCompare("apple"); // 1 (Chrome returns 2)
Как было показано выше, отрицательное число возвращается, если строковый аргумент идет после исходной строки. Положительное число, если строковый аргумент идет раньше исходной строки. Если вернулся 0 — значит строки равны.
Для проверки возвращаемого значения лучше использовать if (result < 0), чем if (result === -1). Последнее не будет работать в Chrome.
Спасибо за внимание, надеюсь, что вы узнали много нового и интересного!
Автор статьи: Alex. Категория:Дата публикации: 19.03.2013
Сразу предупрежу, да, статья немного некорректная, добро пожаловать в комментарии, там неплохие уточнения).
Доброго времени суток.
В JavaScript есть два похожих оператора: == и ===. Если не знать их отличия, это может обернуться кучей ошибок. Так что решил раскрыть эту тему. Чем именно отличаются == и ===, как они работают, почему так происходит, и как избежать ошибок.Оператор == сравнивает на равенство, а вот === - на идентичность. Плюс оператора === состоит в том, что он не приводит два значения к одному типу. Именно из-за этого он обычно и используется.
Abc == undefined; // true, если abc = undefined | null
abc === undefined; // true - только если abc = undefined!
abc == false; // true, если abc = false | 0 | "" |
abc === false; // true, только если abc = false!
Ведь путать false и 0 (или "", или ) - вряд ли очень хорошо.
Разумеется:
5 === 5; // true
true === true; // true
"abc" === "abc"; // true
А теперь интересный пример.
5 == 5; // true
5 === 5; // true
new Number(5) == 5; // true
new Number(5) === 5; // false!
Почему так происходит? Да, любое число - это объект класса Number. Но можно представить число как цифру - некоторой константой. Она единожды объявлена, и всегда идентична сама себе. Но в то же время объявляя новый объект класса Number - он равен ей по значению, но не идентичен (так как это два совершенно разных объекта класса Number).
Arrays / Objects
А вот для массивов и объектов оба оператора работают одинаково, сравнивая на идентичность:var a = {}; a == {}; // false a === {}; // false a == a; // true a === a; // true
Для сравнения массивов и объектов можно написать специальную функцию:
function isEq(a, b){
if(a == b) return true;
for(var i in a){
if(!isEq(a[i], b[i])) return false;
}
for(var i in b){
if(!isEq(a[i], b[i])) return false;
}
return true;
}
Немножко неаккуратно, два цикла, да и про hasOwnProperty
забыли; ну да сойдёт.
This <-
Есть ещё один подводный камень. Это передача в this.(function(){ this == 5; // true this === 5; // false }).call(5);
Вот такой вот момент. Стоит о нём не забывать.
Итого...
Ну а теперь представим, что мы пишем свой суперфреймворк, активно юзаем там оператор === вместо == просто потому что он красивее, и некто находит у нас несколько багов.func(new Number(5)); (function(){ func(this); }).call(5);
Кажется, что такие примеры нежизнеспособны? Пожалуйста!
JQuery:
$.each(, function(){
func(this);
});
Ну или захотелось расширить цифру.
var Five = new Number(5);
Five.a = 2; // захотелось расширить, а просто 5 не расширяется
// здесь как-то используем...
func(Five);
На этом всё, надеюсь кому-то будет полезно. Спасибо за внимание.
Операндами операторов сравнения могут быть численные и строковые значения. Строки сравниваются, исходя из стандартного лексикографического порядка при использовании Unicode.
Яваскрипт допускает как строгое сравнение, так и сравнение с приведением типов. Для строгого сравнения оба операнда должны иметь одинаковый тип и:
- Две строки строго равны, если состоят из одинаковой последовательности символов
- Два числа строго равны, если равны в обычном смысле слова. +0 строго равен -0 .
- NaN строго не равно ничему, включая NaN
- Два булевых операнда строго равны, если они оба true или false
- Два операнда-объекта строго равны, если являются ссылками на один и тот же общий объект
- Null и Undefined равны == , но не строго равны ===
Следующая таблица описывает операторы сравнения:
Оператор | Описание | Примеры, возвращающие true при var1=3, var2=4 |
---|---|---|
Равно (==) | Если два операнда не одного типа, javascript преобразовывает типы и сравнивает строго. Если какой-либо операнд - число или булево значение, то операнды преобразуются в числа; если какой-либо операнд строка - второй преобразуются в строку |
3 == var1 |
Не равно (!=) | Возвращает true , если операнды не равны. Если операнды имеют разный тип, javascript преобразовывает. |
var1 != 4 |
Строго равно (===) | Возвращает true , если операнды строго равны (см. выше), без преобразования типов. | |
Строго не равно (!==) | Возвращает true , если операнды не являются строго равными (см. выше) или имеют разные типы. |
var2 !== 3 |
Больше (>) | Возвращает true , если левый операнд больше правого. | |
Больше или равно (>=) | Возвращает true , если левый операнд больше правого или равен ему. |
var2 >= var1 |
Меньше (<) | Возвращает true , если левый операнд меньше правого. | |
Меньше или равно (<=) | Возвращает true , если левый операнд меньше правого или равен ему. |
var1 <= var2 |
Использование операторов сравнения
Стандартные операторы равенства (== и!=) сравнивают два операнда безотносительно их типа. Строгое равенство (=== и!==) производит сравнения операндов одинакового типа. Используйте строгое равенство, если операнды должны иметь одинаковый тип и значение. В ином случае, используйте обычные операторы равенства, которые позволяют проверить равенство операндов, даже если они разного типа.
При конвертации типов яваскрипт преобразует String , Number , Boolean и Object следующим образом:
- При сравнении числа и строки, строка преобразуется в числовое значение. Яваскрипт при этом получает значение числа из строкового литерала: "123" == 123 .
- Если один из операндов - булевый, то он преобразуется к 1, если он true и к +0, если он false
- Если объект сравнивается с числом или строкой, яваскрипт пытается получить соответствующее значение для объекта. Он преобразует объект к элементарному значению, строке или числу, используя методы valueOf и toString . Если преобразовать объект не удается - генерируется ошибка выполнения.
Когда я пишу на javascript, то приходится часто обращаться к поисковым системам, с целью уточнить синтаксис методов (и порядок, определение аргументов) работающих со строками.
В этой статье я постараюсь привести примеры и описание наиболее распространенных методов javascript связанных со строками. Наиболее популярные методы для удобства расположены в верхней части статьи.
Преобразовываем в строку
Вы можете преобразовать число, булево значение или объект в строку.
Var myNumber = 24; // 24 var myString = myNumber.toString(); // "24"
Вы также можете совершить подобную манипуляцию при помощи функции string() .
Var myNumber = 24; // 24 var myString = String(myNumber); // "24"
Николас Закас говорит: "Если вы не уверены в значении (null или undefined), то используйте функцию String() , так как она возвращает строку в независимости от типа переменной".
undefined означает, что переменной не присвоено никакого значения, a null , - что ей присвоено пустое значение (можно сказать, что null определяется, как пустой объект).
Разбиваем строку на подстроки
Чтобы разбить строку на массив из подстрок вы можете использовать метод split() :
Var myString = "coming,apart,at,the,commas"; var substringArray = myString.split(","); // ["coming", "apart", "at", "the", "commas"] var arrayLimited = myString.split(",", 3); // ["coming", "apart", "at"]
Как следует из последней строки, значение второго необязательного аргумента определяет количество элементов у возвращаемого массива.
Получить длину строки
При помощи свойства length вы можете найти число юникодных символов в строке:
Var myString = "You"re quite a character."; var stringLength = myString.length; // 25
Определяем подстроку в строке
Есть два способа осуществить задуманное:
Использовать indexOf() :
Var stringOne = "Johnny Waldo Harrison Waldo"; var wheresWaldo = stringOne.indexOf("Waldo"); // 7
Метод indexOf() ищет подстроку (первый передаваемый аргумент) в строке (от начала строки) и возвращает позицию первого символа, с которого началось вхождение подстроки в строку.
Использовать lastIndexOf() :
Var stringOne = "Johnny Waldo Harrison Waldo"; var wheresWaldo = stringOne.lastIndexOf("Waldo"); // 22
Метод lastIndexOf() делает все то же самое, за исключением того, что он ищет последнюю подстроку по вхождению в строку.
В случае, если подстрока не найдена оба метода возвращают -1. Второй необязательный аргумент указывает на позицию в строке, с которой вы хотите начать поиск. Так, если для метода indexOf() второй аргумент равен 5, то поиск начнется с 5-го символа, а 0-4 символы будут проигнорированы. Для lastIndexOf() , также если второй аргумент равен 5, поиск начнется в обратном направлении, причем символы от 6-го и выше будут проигнорированы.
Как заменить часть строки
Чтобы заменить часть (или даже всю) строки используйте метод replace() .
Var slugger = "Josh Hamilton"; var betterSlugger = slugger.replace("h Hamilton", "e Bautista"); console.log(betterSlugger); // "Jose Bautista"
В первом аргументе содержится та часть подстроки, которая подлежит замене; второй аргумент - это та строка, которая встанет на место заменяемой подстроки. Будет заменен только первый экземпляр подстроки.
Чтобы заменить все вхождения подстроки, используйте регулярное выражение c флагом " g ".
Var myString = "She sells automotive shells on the automotive shore"; var newString = myString.replace(/automotive/g, "sea"); console.log(newString); // "She sells sea shells on the sea shore"
Второй аргумент может включать заменяемую подстроку или функцию.
Найти символ по заданной позиции
Чтобы выяснить какой символ стоит в заданной позиции, вы можете использовать метод charAt() :
Var myString = "Birds of a Feather"; var whatsAtSeven = myString.charAt(7); // "f"
Как это часто бывает в javascript, первая позиция ведет свой отсчет с 0, а не с 1.
Как альтернативу вы можете использовать метод charCodeAt() , однако вместо самого символа вы получите его код.
Var myString = "Birds of a Feather"; var whatsAtSeven = myString.charCodeAt(7); // "102" var whatsAtEleven = myString.charCodeAt(11); // "70"
Отметьте, что код для прописной буквы (позиция 11) отличается от кода той же буквы, но в малом регистре (позиция 7).
Конкатенация строк в javascript
По большой части для конкатенации строк вы будете использовать оператор (+). Но вы также можете объединить строки, используя метод concat() .
Var stringOne = "Knibb High football "; var stringTwo = stringOne.concat("rules."); // "Knibb High football rules"
В concat() можно передать множество строк, причем в результирующей строке они будут расположены в порядке их добавления в метод concat() .
Var stringOne = "Knibb "; var stringTwo = "High "; var stringThree = "football "; var stringFour = "rules."; var finalString = stringOne.concat(stringTwo, stringThree, stringFour); console.log(finalString); // "Knibb high football rules."
Часть строки (извлечь подстроку в javascript)
Есть три различных способа создать новую строку, "выдернув" часть подстроки из уже имеющейся строки.
Используя slice() :
Var stringOne = "abcdefghijklmnopqrstuvwxyz"; var stringTwo = stringOne.slice(5, 10); // "fghij"
Используя substring() :
Var stringOne = "abcdefghijklmnopqrstuvwxyz"; var stringTwo = stringOne.substring(5, 10); // "fghij"
Для обеих (slice() и substring()) методов первый аргумент - это позиция символа, с которого начинается подстрока (отсчет ведется с 0) , второй аргумент - это позиция символа, на котором подстрока заканчивается, причем символ, обозначенный во втором аргументе, не включается в возвращаемую подстроку.
Используя substr() :
Var stringOne = "abcdefghijklmnopqrstuvwxyz"; var stringTwo = stringOne.substr(5, 10); // "fghijklmno"
Для метода substr первый аргумент также определяет позицию символа, с которого начинается подстрока. Второй аргумент является необязательным. Но в тоже время второй аргумент определяет количество символов, которые должны быть включены в подстроку, начиная с позиции, которую мы уже определили в первом аргументе. Данная методика хорошо проиллюстрирована на примере выше.
Преобразование строки в нижний или верхний регистр на javascript
Есть четыре метода сделать необходимые преобразования. Два для преобразования символов строки в верхний регистр.
Var stringOne = "Speak up, I can"t hear you."; var stringTwo = stringOne.toLocaleUpperCase(); // "SPEAK UP, I CAN"T HEAR YOU" var stringThree = stringOne.toUpperCase(); // "SPEAK UP, I CAN"T HEAR YOU"
И два для преобразования строки в нижний регистр:
Var stringOne = "YOU DON"T HAVE TO YELL"; var stringTwo = stringOne.toLocaleLowerCase(); // "you don"t have to yell" var stringThree = stringOne.toLowerCase(); // "you don"t have to yell"
Как правило, нет разницы между locale-методом и не-locale-методом, однако "для некоторых языков, например для турецкого, у которых регистр символов не следует установленному регистру в системе Unicode, последствия использования не-locale-метода могут быть различными". Поэтому следуйте следующему правилу: "если вы не знаете языка, в котором будет работать код, безопаснее использовать locale-методы".
Соответствие шаблону в javascript
Проверить наличие шаблона в строке можно при помощи 2-х методов.
Метод match() вызывается у объекта string , в качестве аргумента методу match() передается регулярное выражение.
Var myString = "How much wood could a wood chuck chuck"; var myPattern = /.ood/; var myResult = myString.match(myPattern); // ["wood"] var patternLocation = myResult.index; // 9 var originalString = myResult.input // "How much wood could a wood chuck chuck"
И exec() метод вызывается у RegExp объекта, в качестве аргумента передается строка:
Var myString = "How much wood could a wood chuck chuck"; var myPattern = /.huck/; var myResult = myPattern.exec(myString); // ["chuck"] var patternLocation = myResult.index; // 27 var originalString = myResult.input // "How much wood could a wood chuck chuck"
Оба метода возвращают первое совпавшее вхождение. Если совпадения не найдены будет возвращен NULL. Если у регулярного выражения присутствует флаг " g ", то в качестве результата будет возвращен массив, содержащий все совпадения.
Вы также можете использовать метод search(), который в качестве аргумента принимает регулярное выражение и возвращает начальную позицию первого совпавшего шаблона.
Var myString = "Assume"; var patternLocation = myString.search(/ume/); // 3
Если совпадений не найдено, метод возвратит -1.
Сравнение двух строк для последующей сортировки
Чтобы сравнить две строки в зависимости от порядка сортировки в языковом стандарте, вы можете использовать метод localeCompare . Метод localeCompare возвращает три возможных значения.
MyString = "chicken"; var myStringTwo = "egg"; var whichCameFirst = myString.localeCompare(myStringTwo); // -1 (except Chrome, which returns -2) whichCameFirst = myString.localeCompare("chicken"); // 0 whichCameFirst = myString.localeCompare("apple"); // 1 (Chrome returns 2)
Как показано выше, будет возвращено отрицательное значение, если оригинальная строка при сортировке оказывается перед строковым аргументом, если строковой аргумент при сортировке оказывается после оригинальная строки, возвращается значение +1. Если возвращается нулевое значение, две строки эквивалентны.