Full-width to Half-width Katakana Conversion using Javascript

When dealing with enterprise customers in Japan, typically they still maintain legacy systems that have specific character entry requirements. One of such character entry requirement is entry of half-width katakana. Katakana is the Japanese equivalent of the alphabet and many legacy systems only support the half-width version of katakana. However, most modern mobile devices only allow entry of the full-width version of katakana (i.e. iPhone/iPad). Since the byte characters and lengths are different for full-width and half-width versions of katakana, most Japanese web applications resolve this issue by auto-converting full-width katakana characters into half-width katakana characters.

To show this issue resolved in action, I’ve prepared a simple Javascript sample to handle the conversion. In addition, there are many definitions of half-width katakana and full-width katakana, so I’ve prepared a list of what defines half-width/full-width katakana.

Half-width Katakana:

ｶﾞｷﾞｸﾞｹﾞｺﾞｻﾞｼﾞｽﾞｾﾞｿﾞﾀﾞﾁﾞﾂﾞﾃﾞﾄﾞﾊﾞﾋﾞﾌﾞﾍﾞﾎﾞｳﾞﾊﾟﾋﾟﾌﾟﾍﾟﾎﾟｧｨｩｪｫｬｭｮｯｰｱｲｳｴｵｶｷｸｹｺｻｼｽｾｿﾀﾁﾂﾃﾄﾅﾆﾇﾈﾉﾊﾋﾌﾍﾎﾏﾐﾑﾒﾓﾔﾕﾖﾗﾘﾙﾚﾛﾜｦﾝ

Full-width Katakana

ガギグゲゴザジズゼゾダヂヅデドバビブベボヴパピプペポァィゥェォャュョッーアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤユヨラリルレロワヲン

Note: You might notice that full-width katakana is wider than half-width katakana. Half-width katakana is the same width as an english alphabet character, while full-width is the same width as traditional kanji (Japanese) characters.

Code Implementation

The simplest way to implement this is to just implement a straight replacement of characters using search and replace in Javascript. I’ve provided a sample search and replace code in a JSFiddle for those looking to see an implementation.

// Convert Full-width Kana to Half-width Kana
function convertKanaF2H(str) {
    str.value = replaceStringByArrayOfIndex(str.value, WKANA, HKANA);
}

// Convert Half-width Kana to Full-width Kana
function convertKanaH2F(str) {
    str.value = replaceStringByArrayOfIndex(str.value, HKANA2, WKANA2);
}
function replaceStringByArrayOfIndex(str, src, dest) {
    var len = src.length;
    for (var i = 0; i < len; i++) {
        str = replaceAll(str, src[i], dest[i])
    }
    return str;
}

function replaceAll(target, from, to) {
    console.log(target+" "+from+" "+to);
    if (target.indexOf(from) < 0) {
        return target;
    } else {

        return target.split(from).join(to)
    }
}

For full sample code please check the JS fiddle: http://jsfiddle.net/hrfs4j5a/2/

Try Kana Converter Here

Convert FullWidth To HalfWidth
Convert HalfWidth To FullWidth