QQ登录

只需要一步,快速开始

APP扫码登录

只需要一步,快速开始

手机号码,快捷登录

泡泡马甲APP 更多内容请下载泡泡马甲手机客户端APP 立即下载 ×
查看: 188|回复: 0

[HTML/CSS/JS] 字符编码

[复制链接]

等级头衔

积分成就    金币 : 2806
   泡泡 : 1516
   精华 : 6
   在线时间 : 1244 小时
   最后登录 : 2024-5-5

丰功伟绩

优秀达人突出贡献荣誉管理论坛元老

联系方式
发表于 2023-7-28 09:37:59 | 显示全部楼层 |阅读模式
JavaScript中的字符编码在Web开发中起着非常重要的作用。字符编码是将字符序列转换为二进制数据的方式,主要用于将文本数据在网络传输中进行跨语言和设备的传输。在本篇博客中,我们将介绍JavaScript中的字符编码,重点讨论Unicode编码和URI编码,并且演示如何在JavaScript中正确地使用这些编码。+ }7 i4 n9 l- n1 j8 ^. o
Unicode编码& R' z9 n% d% \& ~
JavaScript内置了Unicode字符编码,它不仅覆盖了所有的ASCII字符,还包括来自不同语言和文化的数千个字符。Unicode是一个全球性的字符编码标准,涉及到包括各种语言、符号和表情等字符。在JavaScript中,对于单个字符,可以使用charCodeAt()函数来获取它的Unicode编码。
8 y( a0 R) b9 R以下是一个示例,演示如何输出字符串中每个字符的Unicode编码:+ l; q4 ~$ i0 a- w9 `& d
  1. let str = "Hello, 世界!";
  2. for (let i = 0; i < str.length; i++) {
  3.   console.log(str[i] + ' -> ' + str.charCodeAt(i));
  4. }
输出结果如下:
$ r: x; q( j7 T
H -> 726 l6 ]. I. H! i# ]" B6 n
e -> 101$ L: i  o0 H) q; K8 Y
l -> 108$ o, ~9 n" P8 G
l -> 108
8 N- i& E. j6 W/ g, Go -> 111
! z: x2 O4 }; ^# o5 @, -> 44
* B2 X+ v( {1 \6 e+ S. g* C  -> 32
1 P+ t" \( u, c( x# ]- p9 ~9 x5 H世 -> 19990
4 z* C+ ]7 ~- O/ X界 -> 30028) `+ H  }4 d4 m/ {8 U( w/ _
! -> 33
& d0 x# a  }3 N; [" q
URI编码+ H2 x: M3 A0 i9 z4 w! j7 x. q
URI是Uniform Resource Identifier的缩写,用于表示Web上的标识符。通常,当我们需要在URI中包含非ASCII字符、保留字或其他特殊字符时,我们需要对字符串进行URI编码。在JavaScript中,我们可以使用以下两个方法来实现URI编码:
0 J2 o+ w7 v( i) a' G
  • encodeURI():用于将整个URI进行编码,保留字符如冒号、正斜杠、问号和井号,不进行编码。
  • encodeURIComponent():对于大部分场景来说,这个函数可能更加常用。它对所有非字母数字字符进行编码,包括空格。在编码过程中,将空格编码为%20。
    % n* O8 C: {/ N/ l$ O
以下是一个示例,演示如何对URI中的中文进行编码:
' ?6 U( {5 r8 @$ w
  1. let uri = 'https://example.com/search?query=你好';
  2. console.log(encodeURI(uri));
  3. console.log(encodeURIComponent(uri));
输出结果如下:, @  k, d: F4 z6 @4 g
https://example.com/search?query=%E4%BD%A0%E5%A5%BD
! D, V8 V/ ]2 H9 n2 n6 ~https%3A%2F%2Fexample.com%2Fsearch%3Fquery%3D%E4%BD%A0%E5%A5%BD

+ y0 N/ P& e) {5 U; ?5 t# m( X在第一个输出结果中,只有查询字符串中的非英文字符被编码。在第二个输出结果中,整个URI都被编码。在使用编码之前,需要确定所选的编码方案(例如UTF-8)是否与文档和服务器相匹配。
7 m& L( q1 ]) g3 J0 G1 h$ t内容编码
, |7 Y7 o: T) p7 P8 Q  b. l; L6 S& q在进行网络传输时,我们还需要考虑内容编码的问题。在HTTP中,我们可以使用多种内容编码方式来压缩和优化传输的数据,常见的包括gzip和deflate。在JavaScript中,我们可以通过给请求添加特定的HTTP请求头信息来指定使用的内容编码。以下是一个示例,演示如何在请求头中设置gzip编码:
4 d6 G8 r: n2 d* {; {/ \, f9 A$ Q
  1. let xhr = new XMLHttpRequest();
  2. xhr.open('GET', '/example/data', true);
  3. xhr.setRequestHeader('Accept-Encoding', 'gzip');
  4. xhr.onreadystatechange = function() {
  5.   if (xhr.readyState === 4 && xhr.status === 200) {
  6.     let compressedData = xhr.responseText;
  7.     let uncompressedData = atob(compressedData);
  8.     console.log(uncompressedData);
  9.   }
  10. }
  11. xhr.send();
在这个示例中,我们将请求头的Accept-Encoding属性设置为gzip,以告知服务器使用gzip进行内容编码。在服务器响应的内容被接收后,我们将其传递给atob()函数来将gzip气体解压缩为非压缩数据。. i! `/ P: b( h; }  Q/ j. ]
结论
! ~, n' e- O  M: pJavaScript中的字符编码对于Web开发至关重要。在本篇博客中,我们介绍了Unicode编码和URI编码,以及如何正确地使用这些编码。无论是从Web性能还是国际化的角度上考虑,都需要开发者具有对字符编码的良好理解。希望本篇博客对大家学习JavaScript有所帮助。
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|手机版|小黑屋|paopaomj.COM ( 渝ICP备18007172号 )

GMT+8, 2024-5-6 20:26

Powered by paopaomj X3.4 © 2016-2024 sitemap

快速回复 返回顶部 返回列表