I've made this function to map alphabetic coordinates to their corresponding ordinal number.
var exec = document.querySelector('#exec');
// Maps alphabetic characters to their index
// within the alphabet.
// --------------------------------------------
// @param { string || array } chars - String
// consisting of a single alphabetic character
// or an array which elements are single
// alphabetic characters.
// @throws Error in case of invalid
// parameter ( == not a single alphabetic
// character ).
// --------------------------------------------
// @returns { array } with numbers. The indexes
// of the characters within the alphabet.
//
// ------- Usage examples ----------
// getIndexInAlphabet('i')); // Result : [9]
// getIndexInAlphabet(['a', 'B', 'c'])[1] // 2
// getIndexInAlphabet(['a', 'G', 'z'])); // [1, 7, 26]
function getIndexInAlphabet( chars ) {
var alphabet = [ 'a', 'b', 'c', 'd', 'e',
'f', 'g', 'h', 'i', 'j',
'k', 'l', 'm', 'n', 'o',
'p', 'q', 'r', 's', 't',
'u', 'v', 'w', 'x', 'y',
'z' ];
if (!Array.isArray(chars)) {
if (typeof chars === 'string') {
let tmp = [];
tmp.push(chars);
chars = tmp;
} else {
throw new Error(
'Parameter invalid because not of type string.');
}
}
chars.forEach(function(item, i) {
if (typeof item !== 'string') {
throw new Error('Element ' + i +
' invalid because not of type string.');
}
});
return chars.map(function(char, i) {
var ret = alphabet.indexOf(char.toLowerCase()) + 1;
if (ret === 0) {
throw new Error('Element ' + i + ' invalid because' +
' not an alphabetic character.');
}
return ret;
});
}
// -- From here on : Just testing ...
exec.addEventListener('click', function() {
try {
console.log(getIndexInAlphabet(['a', 'B', 'c'])[1])
console.log(getIndexInAlphabet('i'));
console.log(getIndexInAlphabet(['a', 'G', 'z']));
var charStr = ['a', 'b', 'c', 'd', 'e', 'f'];
var indexes = getIndexInAlphabet(charStr);
var charMap = {};
charStr.forEach(function(char, i) {
charMap[char] = indexes[i];
});
console.log(charMap.f);
} catch (e) {
console.log(e.message);
console.log(e.stack);
}
});
.wrap {
width: 800px;
margin: 50px auto;
}
<div class="wrap">
<div class="buttons">
<a href="#" id="exec" class="slideshow-nav">Exec!</a>
</div>
</div>