ホームページ ウェブフロントエンド jsチュートリアル HTML および javascript_javascript スキルでよく発生するコーディングの問題

HTML および javascript_javascript スキルでよく発生するコーディングの問題

May 16, 2016 pm 06:57 PM
html javascript エンコードの問題

日常のフロントエンド開発作業では、HTML、JavaScript、CSS などの言語を扱うことがよくあります。実際の言語と同じように、コンピューター言語にもアルファベット、文法、用語集、コーディング方法などがあります。

ここでは、フロントエンド HTML と JavaScript の日常業務でよく遭遇するコーディングの問題について簡単に説明します。
コンピューターでは、保存される情報はバイナリ コードで表されます。画面上に表示される英語や漢字などの記号と、記憶に使用されるバイナリコードとを相互に変換することをエンコードといいます。

文字セットと文字エンコーディングという 2 つの基本概念を説明する必要があります。

文字セット、文字セットは、特定の記号と特定の数値の間のマッピング関係のテーブルです。つまり、107 が Koubei の「a」で、21475 が Koubei の「口」であることがわかります。ascii、gb2312、Unicode など、この数値と文字のマッピング テーブルによってテーブルが異なります。数値のバイナリ表現を特定の文字に変換できます。
文字エンコード、エンコード方法。たとえば、「口」であるはずの数値 21475 は、u5k3e3 を使用して表す必要がありますか、それとも「口」を使用して表す必要がありますか?これは文字エンコーディングによって決まります。

アメリカ人が一般的に使用する文字「koubei.com」のような文字列については、0 ~ 127 の 128 個の数字を使用した ASCII と呼ばれる文字セットが開発されました。その正式名称は、米国情報交換コードです。 , (2 の 7 乗、0×00-0×7f) は、123abc など、よく使用される 128 文字を表します。合計 7 ビットに加え、最初のビットは負の数などを表すために 1 の補数を補うために使用される符号ビットです。合計 8 ビットで 1 バイトが構成されます。当時のアメリカ人はちょっとケチだったので、最初から1バイトを16ビットか32ビットに設計しておけば、世界的には問題は少なかったでしょうが、当時は8ビットで十分だと考えていたのでしょう。 128 の異なる文字を表します。

コンピューターはアメリカ人によって発明されて以来、彼らは手間を省き、使用するすべての記号をエンコードしました。これはとても楽しく使用できます。しかし、コンピュータが国際化され始めると、中国を例に挙げると、何万もの漢字が存在します。

既存の 8 ビットと 1 バイトのシステムは基礎であり、それを破壊したり、16 ビットなどに変更したりすることはできません。そうしないと、変更が大きすぎるため、複数の ASCII 文字を使用するという別の方法を取るしかありません。 . 別の文字、つまり MBCS (Multi-Byte Character System、マルチバイト文字システム) を表すため。
この MBCS の概念を使用すると、たとえば、2 つの ASCII 文字を使用すると、理論的には 2 の 16 乗の 65536 文字が存在します。しかし、これらのコードはどのようにして文字に割り当てられるのでしょうか?たとえば、コウベイの「口」の Unicode エンコーディングは 21475 です。誰が決めたのですか?文字セット。これは、先ほど紹介した文字セットです。 ascii は最も基本的な文字セットであり、これに加えて、gb2312、big5、および簡体字中国語と繁体字中国語用のその他の MBCS 文字セットに似た文字セットもあります。最後に、Unicode Consortium と呼ばれる組織は、すべての文字を含む文字セット (UCS、Universal Character Set) と、対応するエンコード方式の標準である Unicode を作成することを決定しました。 1991 年から Unicode 国際標準の最初のバージョンである ISBN 0-321-18578-1 がリリースされ、国際標準化機構 ISO もこの ISO/IEC 10646: Universal Character Set のカスタマイズに参加しました。つまり、Unicode は地球上に存在するすべての記号を基本的にカバーする文字標準であり、現在では ECMA 標準でも JavaScript 言語の内部文字が Unicode 標準を使用することが規定されています。変数名、関数名などは中国語でも使用できます!)。

中国の開発者の場合、gbk、gb2312、utf-8 間の変換など、さらに多くの問題に遭遇する可能性があります。厳密に言えば、この記述はあまり正確ではありません。gbk と gb2312 は文字セット (charset) であり、utf-8 は Unicode 標準における UCS 文字セットの符号化方式です。文字が使用されている コレクションの Web ページは主に UTF-8 でエンコードされているため、それらを並べて表示することがよくありますが、これは実際には不正確です。

Unicode では、少なくとも人類文明がエイリアンに遭遇するまでは、これがマスターキーなので、誰もがそれを使用する必要があります。現在最も広く使用されている Unicode エンコード方式は UTF-8 (8 ビット UCS/Unicode Transformation Format) で、これには特に優れた機能がいくつかあります。

世界中で広く使用されているエンコードされた UCS 文字セット

2 番目の点は、ストレージを追加することなく、これまで純粋な ASCII エンコードを使用していたシステムと互換性を持たせることができるという大きな利点です (固定長エンコード方式が次のように規定していると仮定します)。各文字が 2 バイトで構成される場合、ASCII 文字が占める記憶領域は 2 倍になります)。

UTF-8 を明確に説明するには、次のテーブルを導入すると便利です。

U-00000000 – U-0000007F: 0xxxxxxx
U-00000080 – U-000007FF: 110xxxxx 10xxxxxx
U-00000800 – U-0000FFFF: 1110xxxx 10xxxxxx 10xxxxxx
U-00010000 – U-001FFFFF: 11110xxx 10xxxxxx 10xxxxxx 10xxxxxx
U-00200000 – U-03FFFFFF: 1 11110 xx 10xxxxxx 10xxxxxx 10xxxxxx 10xxxxxx
U- 04000000 – U-7FFFFFFF: 1111110x 10xxxxxx 10xxxxxx 10xxxxxx 10xxxxxx 10xxxxxx

このテーブルを理解するには、最初の 2 行を見るだけで済みます

U-00000000 – U-0000007F:
0xxxxxxx 最初の行は次のようになります。つまり、utf- 8 でエンコードされたバイトのバイナリ コードは 0xxxxxxx で、0 で始まり、10 進数で 0 ~ 127 になります。これは文字を表す 1 バイトであり、ASCII コードとまったく同じ意味を持ちます。他のすべての utf8 エンコードされたバイナリ値は 1、1xxxxxxx で始まり、127 より大きく、シンボルを表すために少なくとも 2 バイトが必要です。したがって、バイトの最初のビットはスイッチであり、文字が ASCII コードであるかどうかを示します。これは、英語の定義からすると、utf8 エンコーディングの 2 つの属性です。

UCS 文字 U 0000 から U 007F (ASCII) は、単純にバイト 0x00 から 0x 7F としてエンコードされます。 ASCII 互換性)。これは、7 ビット ASCII 文字のみを含むファイルと文字列は、ASCII と UTF-8 の両方で同じエンコードを持つことを意味します。
すべての UCS 文字 >U 007F は、それぞれ複数のバイトのシーケンスとしてエンコードされます。したがって、ASCII バイト (0×00 ~ 0×7F) は他の文字の一部として現れることはできません。

次に 2 行目を見てみましょう。 🎜>U-00000080 – U-000007FF: 110xxxxx 10xxxxxx
まず最初のバイトを見てください: 110xxxxx、その意味は、私は ASCII コードではなく (最初のビットが 0 ではないため)、私は最初のバイトですマルチバイト文字(2ビット目は1)の中で、私が参加している文字は2バイト(3ビット目は0)で構成されており、4ビット目からが文字情報が格納されます。
2 番目のバイトを見てください: 10xxxxxx、その意味は次のとおりです: 私は ASCII コードではありません (最初のビットが 0 ではないため)、私はマルチバイト文字の最初のバイトではありません (2 番目のビットは 0) )の3ビット目からが文字情報が格納される場所です。

この例から、UTF-8 エンコード方式では、長い一連の連続バイナリ バイト コードでは、シンボルは 2 ~ 6 バイトで表現できるため、A バイトを使用する場合と比較して、シンボルの ASCII コード 2 つの追加情報を保存するためのスペースが必要です。1 つ目は、シンボルの開始位置、生物学的には、タンパク質の翻訳中の開始コドン AUG です。このシンボルによって使用されるバイト (実際、各シンボルにスターターがある場合、この長さを指定する必要はありませんが、長さの情報を提供すると、一部のバイトが失われた場合のフォールト トレランスが向上します)。解決策は、バイトの 2 番目のビットが 1 であるかどうかを使用して、そのバイトが文字の開始バイトであるかどうかを表します (バイトの最初のビットが使用されたばかりであるため、0 は ASCII コードを意味し、1 は非 ASCII を意味します)。つまり、マルチバイト シンボルの最初のバイトは 11xxxxxx (192 ~ 255 の 2 進数) でなければなりません。次に、3 番目のビットから長さ情報が提供されます。これは、シンボルが 3 番目のビットから 1 増えるごとに、文字が占めるバイト数が 1 ずつ増加することを意味します。 。 UTF-8 では最大 6 バイトの文字が定義されており、110xxxxx のような 2 バイトのスターターよりも 4 つ多くの 1 が必要となるため、上の表に示すように、このスターターは 1111110x になります。
英語の標準定義をもう一度見てください。同じ意味を表しています。

非 ASCII 文字を表すマルチバイト シーケンスの最初のバイトは常に 0xC0 から 0xFD の範囲にあり、それがどのように表現されるかを示しています。この文字には多くのバイトが続きます。マルチバイト シーケンス内のすべてのバイトは 0x80 から 0xBF の範囲内にあります。これにより、エンコードがステートレスになり、欠落バイトに対して堅牢になります。つまり、charset 文字セット内の実際のデジタル情報) が、バイナリ形式で上の表の「x」に順番に直接配置されます。中国人プログラマーが最も頻繁に使用する漢字を考えてみましょう。そのエンコード範囲は U-00000800 ~ U-0000FFFF です。上の表から、この範囲の UTF-8 エンコードでは 3 つのバイトが使用されていることがわかります。 (UTF-8 でエンコードされた中国語の文字が、1 文字あたり 2 バイトを占める EUC-CN でエンコードされた gb2312 文字セットの中国語の文字よりも多くの記憶域を使用するのはこのためです)。または、口コミの「口」という単語を使用します。 Unicode での口の部分は次のようになります:
口: 21475 == 0×53e3 == Binary 101001111100011

JavaScript で、このコードを実行します (firebug コンソールを使用するか、HTML を編集して、間に次のコードを挿入します)。スクリプト タグのペア):

alert('u53e3'); // '口'
alert(escape('口')); // '%u53E3'
アラートを取得します。 (String.fromCharCode('21475')); // '口' を取得
alert('口'.charCodeAt(0)) // '21475' を取得
アラート (encodeURI('口')) ; //get '口'

ご覧のとおり、文字列リテラルは u 16 進 Unicode コードの形式で文字 '口' を取得でき、fromCharCode メソッドは 10 を受け入れます。16 進 Unicode コードは次の目的で使用されます。 「口」という文字を取得します。

2 番目のアラートは「%u7545」を受け取りました。これは非標準の Unicode エンコーディングであり、URI のパーセント エンコーディングの一部です。ただし、この使用方法は W3C によって正式に拒否されており、どの RFC 標準にも含まれていません。 -262 規格ではこの逃避行動が規定されており、一時的なものであると推定されています。
さらに興味深いのは、5 番目の警告で得られた「口」です。これは何ですか?どうやって入手しましたか?

これは、URI で一般的に使用されるパーセント エンコーディングであり、RFC 3986 標準で指定されています。

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

Video Face Swap

Video Face Swap

完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

HTMLの表の境界線 HTMLの表の境界線 Sep 04, 2024 pm 04:49 PM

HTML の表の境界線に関するガイド。ここでは、HTML でのテーブルの境界線の例を示しながら、テーブル境界線を定義する複数の方法について説明します。

HTML のネストされたテーブル HTML のネストされたテーブル Sep 04, 2024 pm 04:49 PM

これは、HTML でのネストされたテーブルのガイドです。ここでは、テーブル内にテーブルを作成する方法をそれぞれの例とともに説明します。

HTML 左マージン HTML 左マージン Sep 04, 2024 pm 04:48 PM

HTML マージン左のガイド。ここでは、HTML margin-left の概要とその例、およびそのコード実装について説明します。

HTML テーブルのレイアウト HTML テーブルのレイアウト Sep 04, 2024 pm 04:54 PM

HTML テーブル レイアウトのガイド。ここでは、HTML テーブル レイアウトの値と例および出力について詳しく説明します。

HTML入力プレースホルダー HTML入力プレースホルダー Sep 04, 2024 pm 04:54 PM

HTML 入力プレースホルダーのガイド。ここでは、コードと出力とともに HTML 入力プレースホルダーの例について説明します。

HTML 内のテキストの移動 HTML 内のテキストの移動 Sep 04, 2024 pm 04:45 PM

HTML でのテキストの移動に関するガイド。ここでは、概要、マーキー タグが構文でどのように機能するか、および実装例について説明します。

HTML 順序付きリスト HTML 順序付きリスト Sep 04, 2024 pm 04:43 PM

HTML 順序付きリストのガイド。ここでは、HTML 順序付きリストと型の導入とその例についても説明します。

HTML の onclick ボタン HTML の onclick ボタン Sep 04, 2024 pm 04:49 PM

HTML オンクリック ボタンのガイド。ここでは、それらの紹介、動作、例、およびさまざまなイベントでの onclick イベントについてそれぞれ説明します。

See all articles