JavaScript | Как перевернуть строку?

Как записать строку в обратном порядке силами JavaScript?

В этой публикации приведены три способа переворота строки в обратном порядке, где первая буква становится последней, а последняя - первой.

Способ № 1 - Функция переворачивания строки через литерал массива, оператор spread, метод revese() и метод join()

function reverseStr(str){
   return [...str].reverse().join("")
}

Логика работы функции

Есть строка:

var stroka = 'tpircSavaJ'

Все строки в JavaScript являются итерируемыми объектами, а значит могут быть приведены к массиву. Воспользуемся оператором троеточия.

var massiv = [...stroka]

Теперь в переменной massiv находится массив из символов строки.

Его последовательность элементов совпадает с последовательностью символов в строке. Сейчас мы можем воспользоваться методом reverse() и перевернуть массив.

massiv.reverse()

Теперь элементы отзеркалились - последний стал первым.

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

massiv.reverse().join("")

Перевернули массив из букв и склеили - JavaScript

В результате мы перевернули строку и получили слово "JavaScript" из слова "tpircSavaJ"

Собственный метод для объектов-прототипов String

String.prototype.reverseStr = function(){
   return [...this].reverse().join("")
}

Пример работы метода и его вызова:

Собственный метод для переворота строк - JavaScript

Способ № 2 - через цикл for

У всех строк есть свойство длины - "length". Мы можем перевернуть строку при помощи самописной функции и цикла for:

function reverseStr(str){
   var a = "";
   for (i = 0; i < str.length; i++){
      a += str[(str.length - 1) - i];
   }
   return a;
}

Результат работы:

Переворот строки циклом for - JavaScript

Собственный метод для объектов-прототипов String

String.prototype.reverseStr = function(){
   var a = ""; 
   for (i = 0; i < this.length; i++){ 
      a += this[(this.length - 1) - i]; 
   } 
   return a;
}

Пример работы метода и его вызова:

Расширили методы для строк - перевернули строку циклом for - JavaScript

Способ № 3 - через метод [@@match] для экземпляров регулярных выражений

Выражение переворота будет выглядеть так:

/./g[Symbol.match]("Какая-то строка").reverse().join("")

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

К методу [@@match] мы можем обратиться только по имени [Symbol.match]. Обратите внимание, что вызов этого метода НЕ СОПРОВОЖДАЕТСЯ ТОЧКОЙ!!!

Работа метода сопоставления строки возвращает нам массив, а дальше действия как в первом примере - это методы .reverse() и .join("").

Результат работы:

Перевернули строку через регулярное выражение - JavaScript

Зачем переворачивать строку?

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

После переворота строки первые сопоставления по сути будут являться последними сопоставлениями.

Информационные ссылки

JavaScript | Строки (String)

Стандарт ECMAScript - Раздел "22.1 String Objects" - https://tc39.es/ecma262/#sec-string-objects

Стандарт ECMAScript - Раздел "14.7.4 The for Statement" - https://tc39.es/ecma262/#sec-for-statement

Стандарт ECMAScript - Раздел "22.2.5.7 RegExp.prototype [ @@match ] ( string )" - https://tc39.es/ecma262/#sec-regexp.prototype-@@match