转载请注明出处：http://www.cnblogs.com/shamoyuu/p/6694595.html
一、emoji是什么
绘文字（日语：絵文字/えもじ emoji）是日本在无线通信中所使用的视觉情感符号，绘意指图形，文字则是图形的隐喻，可用来代表多种表情，如笑脸表示笑、蛋糕表示食物等。
在NTTDoCoMo的i-mode系统电话系统中，绘文字的尺寸是12x12 像素，在传送时，一个图形有2个字节。Unicode编码为E63E到E757，而在Shift-JIS编码则是从F89F到F9FC。基本的绘文字共有176个符号，在C-HTML4.0的编程语言中，则另增添了76个情感符号。
最早由栗田穰崇（Shigetaka Kurita）创作，并在日本网络及手机用户中流行。
自苹果公司发布的iOS 5输入法中加入了emoji后，这种表情符号开始席卷全球，目前emoji已被大多数现代计算机系统所兼容的Unicode编码采纳，普遍应用于各种手机短信和社交网络中。
以上摘自百度百科
二、如何存储emoji
上面说到了，emoji表情并不是图片，而是拥有两个字节的图形（可以理解为字符），后台无法直接存储emoji字符，PC端在没有插件的情况下也无法显示emoji字符。可以通过encode对它进行编码后存储。前端进行解码以后可以直接使用。
三、emoji图标前端的显示
对于不需要截取的情况来讲，直接decode就可以用了。
但是对于需要截取，需要获取length的场景，emoji的大部分字符都是2个length，将造成非常大的麻烦。
我们先来看看进过encode编码后的emoji字符都是什么样的，点击展开，这里面列举了我手机上232个emoji字符
%F0%9F%98%84 %F0%9F%98%83 %F0%9F%98%80 %F0%9F%98%8A %F0%9F%98%89 %F0%9F%98%8D %F0%9F%98%98 %F0%9F%98%9A %F0%9F%98%97 %F0%9F%98%99 %F0%9F%98%9C %F0%9F%98%9D %F0%9F%98%9B %F0%9F%98%B3 %F0%9F%98%81 %F0%9F%98%94 %F0%9F%98%8C %F0%9F%98%92 %F0%9F%98%9E %F0%9F%98%A3 %F0%9F%98%A2 %F0%9F%98%82 %F0%9F%98%AD %F0%9F%98%AA %F0%9F%98%A5 %F0%9F%98%B0 %F0%9F%98%85 %F0%9F%98%93 %F0%9F%98%A9 %F0%9F%98%AB %F0%9F%98%A8 %F0%9F%98%B1 %F0%9F%98%A0 %F0%9F%98%A1 %F0%9F%98%A4 %F0%9F%98%96 %F0%9F%98%86 %F0%9F%98%8B %F0%9F%98%B7 %F0%9F%98%8E %F0%9F%98%B4 %F0%9F%98%B5 %F0%9F%98%B2 %F0%9F%98%9F %F0%9F%98%A6 %F0%9F%98%A7 %F0%9F%98%88 %F0%9F%91%BF %F0%9F%98%AE %F0%9F%98%AC %F0%9F%98%90 %F0%9F%98%95 %F0%9F%98%AF %F0%9F%98%B6 %F0%9F%98%87 %F0%9F%98%8F %F0%9F%98%91 %F0%9F%A4%97 %F0%9F%A4%94 %F0%9F%99%84 %F0%9F%A4%90 %F0%9F%A4%93 %F0%9F%99%83 %F0%9F%A4%92 %F0%9F%A4%95 %F0%9F%A4%91 %F0%9F%91%B2 %F0%9F%91%B3 %F0%9F%91%AE %F0%9F%91%B7 %F0%9F%92%82 %F0%9F%91%B6 %F0%9F%91%A6 %F0%9F%91%A7 %F0%9F%91%A8 %F0%9F%91%A9 %F0%9F%91%B4 %F0%9F%91%B5 %F0%9F%91%B1 %F0%9F%91%BC %F0%9F%91%B8 %F0%9F%98%BA %F0%9F%98%B8 %F0%9F%98%BB %F0%9F%98%BD %F0%9F%98%BC %F0%9F%99%80 %F0%9F%98%BF %F0%9F%98%B9 %F0%9F%98%BE %F0%9F%91%B9 %F0%9F%91%BA %F0%9F%99%88 %F0%9F%99%89 %F0%9F%99%8A %F0%9F%92%80 %F0%9F%91%BD %F0%9F%92%A9 %F0%9F%94%A5 %F0%9F%8C%9F %F0%9F%92%AB %F0%9F%92%A5 %F0%9F%92%A2 %F0%9F%92%A6 %F0%9F%92%A7 %F0%9F%92%A4 %F0%9F%92%A8 %F0%9F%91%82 %F0%9F%91%80 %F0%9F%91%83 %F0%9F%91%85 %F0%9F%91%84 %F0%9F%91%8D %F0%9F%91%8E %F0%9F%91%8C %F0%9F%91%8A %F0%9F%91%8B %F0%9F%91%90 %F0%9F%91%86 %F0%9F%91%87 %F0%9F%91%89 %F0%9F%91%88 %F0%9F%99%8C %F0%9F%99%8F %F0%9F%91%8F %F0%9F%92%AA %F0%9F%96%90 %F0%9F%96%95 %F0%9F%96%96 %F0%9F%95%B5 %F0%9F%9A%B6 %F0%9F%8F%83 %F0%9F%92%83 %F0%9F%91%AB %F0%9F%91%AA %F0%9F%91%AC %F0%9F%91%AD %F0%9F%92%8F %F0%9F%92%91 %F0%9F%91%AF %F0%9F%99%86 %F0%9F%99%85 %F0%9F%92%81 %F0%9F%99%8B %F0%9F%92%86 %F0%9F%92%87 %F0%9F%92%85 %F0%9F%91%B0 %F0%9F%99%8E %F0%9F%99%8D %F0%9F%99%87 %F0%9F%8E%A9 %F0%9F%91%91 %F0%9F%91%92 %F0%9F%91%9F %F0%9F%91%9E %F0%9F%91%A1 %F0%9F%91%A0 %F0%9F%91%A2 %F0%9F%91%95 %F0%9F%91%94 %F0%9F%91%9A %F0%9F%91%97 %F0%9F%8E%BD %F0%9F%91%96 %F0%9F%91%98 %F0%9F%91%99 %F0%9F%92%BC %F0%9F%91%9C %F0%9F%91%9D %F0%9F%91%9B %F0%9F%91%93 %F0%9F%8E%80 %F0%9F%8C%82 %F0%9F%92%84 %F0%9F%92%9B %F0%9F%92%99 %F0%9F%92%9C %F0%9F%92%9A %F0%9F%92%94 %F0%9F%92%97 %F0%9F%92%93 %F0%9F%92%95 %F0%9F%92%96 %F0%9F%92%9E %F0%9F%92%98 %F0%9F%92%8C %F0%9F%92%8B %F0%9F%92%8D %F0%9F%92%8E %F0%9F%91%A4 %F0%9F%91%A5 %F0%9F%92%AC %F0%9F%91%A3 %F0%9F%92%AD %F0%9F%A4%98 %F0%9F%93%BF %F0%9F%A4%96 %F0%9F%A6%81 %F0%9F%A6%84 %F0%9F%A6%83 %F0%9F%A6%80 %F0%9F%A6%82 %F0%9F%A7%80 %F0%9F%8C%AD %F0%9F%8C%AE %F0%9F%8C%AF %F0%9F%8D%BF %F0%9F%8F%BA %F0%9F%9B%90 %F0%9F%95%8B %F0%9F%95%8C %F0%9F%95%8D %F0%9F%8F%90 %F0%9F%8F%B9 %F0%9F%8F%B8 %F0%9F%8F%93 %F0%9F%8F%92 %F0%9F%8F%91 %F0%9F%8F%8F %F0%9F%95%8E %F0%9F%8D%BE %F0%9F%8F%8B %E2%9C%8D %E2%98%9D %E2%9C%8A %E2%9C%8C %E2%9C%A8 %E2%98%BA %E2%9C%8B %E2%9D%A4 %E2%9B%B9 下面的几个是中文 %E4%BD%A0 %E4%BB%A5 %E4%B8%BA %E6%88%91 %E8%B4%AB %E7%A9%B7 %EF%BC%8C %E7%9B%B8 %E8%B2%8C %E5%B9%B3 %E5%B0%B1 %E6%B2%A1 %E6%9C%89 %E6%84%9F %E6%83%85 %E5%90%97 %EF%BC%9F %E4%BD%A0 %E6%98%AF %E4%B8%8D %E6%98%AF %E6%83%B3 %E9%94%99 %E4%BA%86
可以看到emoji表情的编码拥有比较高的规律性，要么是%F0%9F开头的12位，要么是%E2%9开头的9位。所以可以从这方面入手处理截取，方案有二，各有利弊。
一、按上面的规律截取字符串
优点是即使这里没有列举的emoji表情也能够进行判断，但是有误伤的可能
二、将上面所有的emoji编码存起来，对符合上面规律的字符串再进行一次逐一的对比
优点是不可能误伤，但是如果对于没有列举到的表情将无能为力
下面的代码是采用第一种做法获取到解码后的字符数组，这样length等都可以正常使用，想怎么截取都可以。
///将带有emoji表情的encode编码的字符串转换成字符数组
function getEmojiStrArray(str){
if(!str || str.constructor.name != "String"){
return [];
}
var result = [];
//微信名不能有 <>/ 这三个字符，不是微信的其他情况这里需要再处理一下
var psw = "<";
var reg = /%F0%9F\S{6}?|%E2%9\S{4}?/gi;
//所有emoji图标
var emojis = str.match(reg) || [];
//把emoji的编码都解码了
for(var index in emojis){
emojis[index] = decodeURI(emojis[index]);
}
//把不包含emoji的编码都解码了
str = decodeURI(str.replace(reg, psw));
result = str.split("");
var index = 0;
for (var i = 0; i < result.length; i++) {
if(result[i] === psw){
result[i] = emojis[index];
index++;
}
}
return result;
}