---
description: 🚧 under construction
---

# code unit

[JS](../../../../../..) ⟩ [value](../../../../..) ⟩ [primitive](../../../..) ⟩ [String](../../..) ⟩ [Unicode](../..) ⟩ [encoding](..) ⟩ [UTF-16]() ⟩ code unit

{% hint style="success" %}
* <mark style="color:yellow;">**UTF-16**</mark> <mark style="color:purple;">**code units**</mark> are <mark style="color:yellow;">**16-bit**</mark> unsigned integers. (<mark style="color:yellow;">**0x0000**</mark> \~ <mark style="color:yellow;">**0xFFFF**</mark>)
{% endhint %}

{% tabs %}
{% tab title="🗺️ 圖表" %}
<img src="https://2527454625-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MfvEFZnSBhKT6fJmus0%2Fuploads%2FeAPkVT4OexgWTMyevBZY%2Fcode.point.svg?alt=media&#x26;token=c612329d-0a48-4cfc-9949-764991d69905" alt="" class="gitbook-drawing">
{% endtab %}

{% tab title="🧨 雷區" %}
{% hint style="danger" %}
* string[.codePointAt(index)](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/codePointAt)&#x20;
* string.slice(start, end)
* string\[index]

uses <mark style="color:yellow;">**index**</mark> of <mark style="color:purple;">**code units**</mark>, <mark style="color:red;">**not**</mark>**&#x20;**<mark style="color:yellow;">**characters**</mark>:exclamation:
{% endhint %}

{% hint style="danger" %}
.[`split("")`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/split) will <mark style="color:yellow;">**split**</mark> by UTF-16 <mark style="color:purple;">**code units**</mark> and will <mark style="color:yellow;">**separate**</mark> [**surrogate pairs**](surrogate-pair):exclamation:
{% endhint %}

{% hint style="danger" %}
By default, <mark style="color:purple;">**regular expressions**</mark> work on [**code units**](code-unit), <mark style="color:red;">**not**</mark>**&#x20;**<mark style="color:yellow;">**actual characters**</mark>:exclamation:
{% endhint %}
{% endtab %}

{% tab title="⭐️ 重點" %}
{% hint style="danger" %}
(dangerous) use code units

* string.length
* string\[index]
* string[.charCodeAt(index)](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/charCodeAt)
{% endhint %}

{% hint style="success" %}
(safe) use code points

* string iteration (for-of loop)
{% endhint %}
{% endtab %}

{% tab title="💈範例" %}
* replit ⟩ [code unit](https://replit.com/@pegasusroe/code-unit#index.js)

```javascript
// code
```
{% endtab %}

{% tab title="👥 相關" %}
* [..](../.. "mention")
{% endtab %}

{% tab title="📗" %}
* [ ] Eloquent JavaScript ⟩ [Strings & Character Codes](https://eloquentjavascript.net/05_higher_order.html#h_gQf5HZNGpM)
{% endtab %}

{% tab title="📘 手冊" %}
* [UTF-16 characters, code points, grapheme clusters](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String#utf-16_characters_unicode_codepoints_and_grapheme_clusters)
* String.prototype ⟩&#x20;
  * [.charCodeAt()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/charCodeAt)
  * [.codePointAt()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/codePointAt)
* [String](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String) ⟩&#x20;
  * [.fromCodePoint()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/fromCodePoint)
  * [.fromCharCode()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/fromCharCode)
{% endtab %}
{% endtabs %}
