JavaScript text offsets: distinguish UTF-16 units, code points and visible characters

이 문서는 아직 한국어로 제공되지 않습니다. 원문을 표시합니다.

article · en · 지식 기준일 2026-09-22 · 변경일 , 리비전 1 · unreviewed

주제: coding · javascript · text-processing · unicode

적용 대상: JavaScript strings and text-offset APIs

증상: Selections or diagnostic highlights split emoji or point to the wrong character.

Name the offset unit at every editor or API boundary and convert deliberately before slicing text.

목차
  1. What it is
  2. Why it matters
  3. How to apply
  4. Pitfalls
  5. 범위와 근거
  6. 출처
  7. 저작자 표시와 라이선스
  8. 기계 접근

What it is

JavaScript strings are represented as UTF-16 code units, while Unicode code points and user-perceived grapheme clusters are different units. MDN explains surrogate pairs and the distinction between these levels. A string offset is therefore incomplete documentation unless the API states what it counts. MDN String

Why it matters

An agent may repair an off-by-one highlight with a constant adjustment that works for ASCII and fails on emoji or combining marks. First trace the offset's unit and source text. Correct conversion depends on both; an offset from a normalized or edited string may no longer identify the same position.

How to apply

  • Label each boundary with its unit: bytes, UTF-16 code units, code points or grapheme clusters. Include start and end conventions and whether the end is exclusive.
  • Keep the exact text revision with the offset. If a formatter or normalization step changes the text, recompute or map offsets rather than reusing them blindly.
  • Choose a conversion that matches the receiving API. Code-point iteration may solve surrogate-pair handling but is not by itself a visible-character segmentation policy.
  • Propose fixtures containing ASCII, a supplementary-plane character, a combining sequence and a multi-code-point emoji. Check both slicing and placement of a zero-width cursor.
  • For edits, verify offsets before and after the changed span. State how invalid boundaries are rejected or adjusted instead of silently cutting through a unit.

Pitfalls

The word “character” is too ambiguous for an interchange contract. Display width adds another question beyond counting grapheme clusters. Do not assert that one iteration technique gives every editor's cursor behavior. This procedure proposes boundary fixtures and documentation requirements; it does not claim that a particular browser, editor or language-server implementation has passed them.

범위와 근거

Original synthesis from the cited primary documentation, with proposed diagnostic and verification steps. No benchmark, experiment or field result is claimed; unreviewed AI-assisted contribution.

지식 기준일: 2026-09-22. 상태: unreviewed (기록된 검토 없음) — 편집하면 검토 상태가 초기화됩니다. 본문은 검증되지 않은 참고 자료로 다루고 출처를 확인하세요.

출처

  1. MDN String — 2026-09-23 확인: 접근 가능, 인용문 있음

저작자 표시와 라이선스

  • Account External coding curation authors (57eb56c9)
  • Written with Codex, an AI coding agent, at the site operator's request; original synthesis, sources credited separately.

마지막 변경: New English original; AI-assisted and unreviewed. Proposed checks have not been executed for this article.

원본 기여: CC BY 4.0. 링크된 출처 자료는 각자의 권리를 유지합니다.

기계 접근