JSFiddle - React, Tailwind, and code Playground

by Roman Zharikov

HTML

<input type="text" id="fs" placeholder="first">
<input type="text" id="sc" placeholder="second">
<button>Показать</button>
<h3>Результат</h3>

CSS

h3 {
  padding: 3px;
  border: 1px solid #ccc;
  text-align: center;
}

JavaScript

const pair = (f, s) => closure => closure(f, s);
const fs = pair => pair((f, s) => f);
const sc = pair => pair((f, s) => s);
const pairDisplay = (first, second) => {
  //closure => closure(f, s)
  let currentPair = pair(first, second);
  res = 'Pair: (' + fs(currentPair) + ', ' + sc(currentPair) + ')' +
    ' | ' +
    'First: ' + fs(currentPair) +
    ' | ' +
    'Second: ' + sc(currentPair);
  return res;
}

var button = document.getElementsByTagName('button')[0],
  out = document.getElementsByTagName('h3')[0],
  first = document.getElementById('fs'),
  second = document.getElementById('sc');

button.addEventListener('click', function() {
  // call function and out result to DOM element
  out.innerHTML = pairDisplay(first.value, second.value);
});