首页 > 其他分享 >较真:js判断中文字符串长度的正确方法

较真:js判断中文字符串长度的正确方法

时间:2023-09-10 16:32:28浏览次数:40  
标签:console log js length let str 字符串 较真 charCode

对于使用javascript编程的人来说,判断字符串长度应该是常用又简单的操作,但在判断包含有中文字符或其他非asci字符的字符串长度时,却有些坑在里面。

错误做法1

先看看最常用的做法,也就是使用String.length判断:

let str = "你好奥";
let len  = str.length;
console.log(len);
//打印出来的结果时 3

这个输出结果显然是不对的,因为一个汉字实际占用2个字节(GB2312编码)或3个字节(utf8编码)。


错误做法2

看到网上有不少同学,将非asic字符按2个字符来计算,这个也是不对的,这种方法只有在GB2312编码时有效,而实际上网页有的采用GB2312,更多的采用utf8。

let str = "你好奥";
let len = 0;
for(var i = 0; i < str.length; i++){
        charCode = str.charCodeAt(i);
        if (charCode >= 0 && charCode <= 128) {
            len += 1;
        }else{
            len += 2;
        }
  }
console.log(len);
//还有这样做的:
console.log(str.replace(/[\u0391-\uFFE5]/g,"aa").length);

这两种方法犯同样的错误,就是想当然的认为时GB2312编码。

正确的做法

第一种是用TextEncoder,这个需要浏览器支持,有些浏览器如ID是不支持的:

let str = "你好奥";
const encoder = new TextEncoder();
console.log(encoder.encode(str).length);

第二种是用Blob:

let str = "你好奥"; 
console.log(new Blob([str]).size);

第三种,如果是在做nodejs后台程序,还可以用Buffer来判断:

console.log(Buffer.byteLength(str));

在utf8编码下,这三种方法都输出 9

完整的例子及输出

下面是完整的测试页面:

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <title>test</title>
</head>
<body>
<script>
    let str = "你好奥";
    console.log(str.length);

    let len = 0;
    for(var i = 0; i < str.length; i++){
            charCode = str.charCodeAt(i);
            if (charCode >= 0 && charCode <= 128) {
                len += 1;
            }else{
                len += 2;
            }
    }
    console.log(len);

    console.log(str.replace(/[\u0391-\uFFE5]/g,"aa").length);
    
    const encoder = new TextEncoder();
    console.log(encoder.encode(str).length);

    console.log(new Blob([str]).size);
    
    //for nodejs
    //console.log(Buffer.byteLength(str));
</script>
</body>
</html>

输出结果:

3
6
6
9
9


标签:console,log,js,length,let,str,字符串,较真,charCode
From: https://blog.51cto.com/livestreaming/7426815

相关文章

  • postgresql数据库安装日志解析插件wal2json
    postgresql数据库安装日志解析插件wal2json一、编译安装wal2json插件cdwal2jsonexportPATH=/data/home/fei.yang4/moudle/postgresql/bin:$PATHmakemakeinstall二、直接导入wal2json插件查看pg进程确定pgsql库和配置文件存放目录ps-ef|greppostgresqlubuntu24975248......
  • Vue.js 官方脚手架 create-vue 是怎么实现的?
    Vue.js官方脚手架create-vue是怎么实现的?摘要本文共分为四个部分,系统解析了vue.js官方脚手架create-vue的实现细节。第一部分主要是一些准备工作,如源码下载、项目组织结构分析、依赖分析、功能点分析等;第二部分分析了create-vue脚手架是如何执行的,执行文件的生成细节......
  • 原生JavaScript框架设计(一):整合JS函数
    本篇为回顾js时总结,诣在整理JS中常用知识点,剖析其规律。模仿jQuery,简单一些,特定功能,像apply函数、getElementXXX函数等浏览器函数都没有实现,直接套用。创建common.js://自定义实现push函数varmyPush=function(target,els){ varj=target.length, i=0; while((target[j++]=e......
  • chrome插件:content.js、background.js, options.js, popup.js之间的通信
    目录content.js向background.js发送消息background.js向content.js发送消息options.js或popup.js向background.js传递数据总结content.js向background.js发送消息消息方向://content.js一般不直接与options.js,popup.js通信,而是与常驻的background.js通信content.js=>[back......
  • 【Python基础】字符串常用方法
    replace()方法replace()方法把字符串中的old(旧字符串)替换成new(新字符串),如果指定第三个参数max,则替换不超过max次。str="ThisisATest"print(str.replace("is","was"))#ThwaswasATest"print(str.replace("is","was",1))#Thwas......
  • java 字符串常用API
      importjava.util.Scanner;publicclassMain{publicstaticvoidmain(Stringargs[]){Scannersc=newScanner(System.in);Strings="1233.32";doubley=Double.parseDouble(s);//将一个字符串强制转化为浮点数Stri......
  • nodejs采集淘宝、天猫网商品详情数据以及解决_m_h5_tk令牌及sign签名验证(2023-09-09)
    一、淘宝、天猫sign加密算法淘宝、天猫对于h5的访问采用了和APP客户端不同的方式,由于在h5的js代码中保存appsercret具有较高的风险,mtop采用了随机分配令牌的方式,为每个访问端分配一个token,保存在用户的cookie中,通过cookie带回服务端分配的token,客户端利用分配的token对请求的URL......
  • 字符串哈希
    字符串哈希可以快速判断字符串是否相同(比KMP还快)字符串前缀哈希法先预处理出来所有前缀的哈希str="ABCDEFGHI";h[0]=0;h[1]="A";//哈希值h[2]="AB";h[3]="ABC";h[4]="ABCD";...求字符串哈希值的方法是将字符串看成一个p进制的数:"ABCD"第一位的数是:A-......
  • 【JS】并发请求调度器实现演示
    控制多个请求的并发度,演示请求的过程和用时结果demo:https://scheduler-smoky.vercel.app/github:https://github.com/zjy4fun/scheduler   <scriptsetuplang="ts">import{ref}from'vue'classScheduler{queue:any[]maxCount:numberrunCoun......
  • 205. 同构字符串
    给定两个字符串 s 和 t ,判断它们是否是同构的。如果 s 中的字符可以按某种映射关系替换得到 t ,那么这两个字符串是同构的。每个出现的字符都应当映射到另一个字符,同时不改变字符的顺序。不同字符不能映射到同一个字符上,相同字符只能映射到同一个字符上,字符可以映射到自己本......