限制中文输入是英文输入长度的一半

最新推荐文章于 2022-03-01 17:27:15 发布

一颗粒普斯

最新推荐文章于 2022-03-01 17:27:15 发布

阅读量455

点赞数

分类专栏： javascript 文章标签： Unicode js 文字长度

本文链接：https://blog.csdn.net/CODING_1/article/details/95613484

版权

javascript 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

在限制输入长度的时候可能会有这样的一个需求：输入的中文长度得是英文长度的一半。也就是说一个输入框你可以输入20个英文字符，但是只能输入10个中文汉字或其他字符。

之前的思路是利用正则判断汉字的Unicode编码[\u4e00-\u9fa5]，首先正则的性能不是很好，其次如果是emoji表情，长度是按照英文字符还是中文字符判断呢？
偶然的机会看到一个方法使用charCodeAt()判断Unicode编码表中对应的整数，这样返回的结果是0-65535之间的整数（现在Unicode对应的整数已经达到了65536-1114111），一般65535之后的字符大多是emoji表情，比如：比如 ? 是 127850（1F36A）。

我们需要判断的英文字符对应的数字在0-127之间，也就是我们听说的ASCII编码，
ASCII（American Standard Code for Information Interchange，美国信息交换标准代码）。

整体思路是这样的：定义一个变量代表字符权重，0-127权重为1，此后的权重均为2；判断单个字符的Unicode编码，增加对应的权重，控制权重在最大的范围内，例如文章一开始说的想限制20个英文字符，10个中文字符，在输入英文字符的时候就+1，输入中文的字符就+2，最后不能超过20。

上代码

/**
* 获取字符串长度
*/
getStrFullLength=(str='')=>{
	str.split('').reduce((pre,cur)=>{
		const charCode=cur.charCodeAt(0)
		if(charCode>=0 && charCode<=127){
			return pre + 1
		}
		return pre + 2
	})
}

/**
* 截取字符串
*/
cutStrByFullLength=(str='',maxLength) =>{
	let showLength=0;
	return str.split('').reduce((pre,cur)=>{
		const charCode=cur.charCodeAt(0);
		if(charCode>=0&&charCode<=127){
			showLength+=1
		}else{
			showLength+=2
		}
		if(showLength<=maxLength){
			return pre+cur
		}
		return pre
	},'')
}

参考文章：
谈谈字符编码：Unicode、UTF-8 和 char[] https://luan.ma/post/character-encoding/
ASCII编码：https://baike.baidu.com/item/ASCII/309296?fr=aladdin