Zenn
📚

空文字なのにfalse判定してくれない原因

2021/04/27に公開
JavaScript
Unicode
tech

zennのリアルタイムマークダンプレビュースクリプトを書いている時に、つまずいた箇所があったので解決策のメモを残します。

空文字なのにtrue

入力エディタに入力されている文字を取得するため下記のコードを実行してみます。

document.querySelector(".CodeMirror-code").outerText


ちゃんと取得できてます。

次に下記のような単純なif文を実行してみました。
空文字（””）はfalseと判定されることを利用しています。

if (document.querySelector(".CodeMirror-code").outerText) {
  console.log("true")
} else {
  console.log(false)
}



しかし、予想に反して文字が入力されていてもいなくてもtrue判定されてしまいました。

目に見えない文字

この謎を解明すべく、試しに文字列のUnicodeコードポイントを返すcodePointAt()メソッドを実行してみました。

何も入力されていない空文字のはずなのに、8203という値が返ってきています。
このUnicodeの8203という値は「ゼロ幅スペース」という「非表示文字」に属する文字とのことでした。[1]
これで謎は解決です。

脚注

  1. https://ja.wikipedia.org/wiki/ゼロ幅スペース ↩︎

Discussion