JSFiddle - React, Tailwind, and code Playground

by Sergey Aleshin

HTML

<code class="code" id="inputAlphabetFrequency"></code>
<code class="code" id="outputAlphabetFrequency"></code>

CSS

.code {
  display: inline-table;
  margin: 0 10px;
  padding: 10px;
  font-weight: 600;
  border-radius: 5px;
  box-shadow: 0px 2px 15px -5px #999;
  overflow-x: auto;
}

JavaScript

const inputAlphabetFrequency = document.getElementById('inputAlphabetFrequency');
const outputAlphabetFrequency = document.getElementById('outputAlphabetFrequency');

var outputText = 'awd';

var inputText = 'гптюыэщбтюыятпыашюжжшхшэщшюжюыящфпабятощ юьюахэанюьпаяаэуюрхшьчющрмадшэюитпшящтмюыапаяунюапжшетшпюэтюиэабщшюжаф яаьуюыапаяушюжарэщыт пювюпшлюыпаюхшмтшпюэтюэщжшюгпанюэтвышюфшяжушюстбюьюхявбанюьпаяаэуюрхшь чюшьпчюпапюищэщивиющэоаяитзщщюыапаяунюхаьптпаешэюхмйюпабаюепацуюьтиаьп айпшмчэаюазшэщжтпчюм цушюяштмчэушюыящфпаьщьпшиующмщюхтдшюьархтжтпчюьжащюьацьпжшээушюйруыюыэ щбщюхшмтмьйюфаюжариадэаьпщюхаьпвфэуиюэаюэшюаьжацадхтшпюещптпшмйюапюэша цлахщиаьпщюжмтхшэщйюгмшишэптяэуищюаьэажтищюитпшитпщыщюжюетьпэаьпщютмбш цяующюпшаящщюбявффющюфамшниэабщшюжафяаьуюыюьадтмшэщ юаьптмщьчюртюацмадытищюгпанюыэщбщюжюетьпэаьпщюфаьмшюхамбщлюьаиэшэщнютж паяюяшсщмюапытртпчьйюапюятььиапяшэщйюжжщхвюшбаюыятнэшнюэшфятыпщеэаьпщю щюэшвдщжещжаьпщюэтюяаььщньыанюфаежшюитььвюфамшрэанющэоаяитзщщюиадэаюэт нпщюэтюьшяжшяш';

const alphabet = [
	["а", 0.062], ["б", 0.014], ["в", 0.038], ["г", 0.013], ["д", 0.025], ["е", 0.072], ["ё", 0.072],
  ["ж", 0.007], ["з", 0.016], ["и", 0.062], ["й", 0.010], ["к", 0.028], ["л", 0.035], ["м", 0.026],
  ["н", 0.053], ["о", 0.090], ["п", 0.023], ["р", 0.040], ["с", 0.045], ["т", 0.053], ["у", 0.021],
  ["ф", 0.002], ["х", 0.009], ["ц", 0.004], ["ч", 0.012], ["ш", 0.006], ["щ", 0.003], ["ы", 0.016],
  ["ь", 0.014], ["ъ", 0.014], ["э", 0.003], ["ю", 0.006], ["я", 0.018], [" ", 0.175]
];

var alphabetFrequency = [];
for (let i = 0; i < alphabet.length - 1; i = i + 1) {
	alphabetFrequency.push([alphabet[i][0].toUpperCase() , Math.ceil(inputText.length * alphabet[i][1])]);
}
alphabetFrequency.sort((a, b) => (b[1] - a[1]))
//

var inputFrequency = [];
for (let i = 0; i < alphabet.length - 1; i = i + 1) {
	inputFrequency.push([alphabet[i][0], (inputText.split(alphabet[i][0]).length - 1)]);
}
inputFrequency.sort((a, b) => (b[1] - a[1]))




var frequency = [];
var...