Find index of a changed symbol in a word

only one symbol can be removed or added into any position No chance to detect which letter was deleted if there are several same letters in a row. More likely that letter with bigger index was been deleted.

by Alexander Zonov

HTML

<div class="display"></div>

Babel + JSX

let display = document.querySelectorAll('.display')[0];
let defaultSide = 0;
let defaultFront = 0;
let fabrics = [
	{side: 1, front: 1},
  {side: 2, front: 2},
  {side: 3, front: 3},
  {side: 4, front: 4},
  {side: 5, front: 5}
];

let oldWord = 'aarsgh';
let newWord = 'arsgh';

function showIndex(oldWord, newWord, fabrics) {
	let index = 0;
  let operation = 'change';
  
  oldWord = oldWord.split('');
  newWord = newWord.split('');
  
  operation = oldWord.length > newWord.length ? 'remove' : operation;
  operation = oldWord.length < newWord.length ? 'add' : operation;
  
  if (operation === 'change') {
  	/* SOME LETTERS WERE CHANGED */

  	return fabrics.map((el, i) => {
    	if (oldWord[i] === newWord[i]) {
      	return el;
      } else {
      	return {side: defaultSide, front: defaultFront}
      }
    });
  } else if (operation === 'remove') {
  	/* SOME LETTERS WERE REMOVED */
  	let correction = 0;
    
  	return fabrics.map((el, i) => {
    	if (oldWord[i + correction] === newWord[i]) {
      	return el;
      } else {
      	correction++;
      	return false;
      }
    }).filter(el => el);
  } else if (operation === 'add') {
  	/* SOME NEW LETTERS WERE ADDED */
    let correction = 0;
    let newFabrics = [];
    
  	fabrics.map((el, i) => {
    	if (oldWord[i] === newWord[i + correction]) {
      	newFabrics.push(el);
      } else {
      	correction++;
        newFabrics.push({side: defaultSide, front: defaultFront});
        newFabrics.push(el);
      }
    });
    
    return newFabrics;
  }
}

let result = showIndex(oldWord, newWord, fabrics);
display.textContent = `${JSON.stringify(result)}`;