宮水の日記

宮水の日記

主に書評や資格取得について記事を書いています。

js-hanzenkaku 【JSライブラリ1日1個】

JSライブラリを1日1つ紹介する

1日1つJSのライブラリを調べます。

① ライブラリに関するドキュメントを最初から最後まで読む
② 実際に使ってみる or 使い方を調べる
③ ライブラリを3行で説明する


本日は、js-hanzenkakuのドキュメントを読んで実際に業務で使っているところを調べました。


 

ドキュメント

今回読んだドキュメントはこちらです。

github.com


 

実際に使ってみる

このライブラリはファイルを直接アプリケーションに置いて使うことができます。
js-hanzenkaku/hanzenkaku.min.js at master · dankogai/js-hanzenkaku · GitHub

内容は超シンプルで、カタカナの半角や全角を変換できるライブラリです。
.toHiragana()とかあったので、先人の方が頑張ってメソッドを作ったのかと思ってました😭

OO INTERFACE
If your environment supports ECMASCript 5, `String.prototype' is exteneded as follows:

'コガイダン'.toZenkaku(); // HanZenKaku.h2z('コガイダン')
'コガイダン'.toHankaku(); // HanZenKaku.z2h('コガイダン')
'dankogai'.toFullwidth(); // HanZenKaku.hw2fw('dankogai')
'dankogai'.toHalfwidth(); // HanZenKaku.fw2hw('dankogai')
'dan kogai'.toHalfwidthSpace(); // HanZenKaku.fs2hs('dan kogai')
'dan kogai'.toFullwidthSpace(); // HanZenKaku.hs2fs('dan kogai')
'こがいだん'.toKatakana(); // HanZenKaku.h2k('こがいだん')
'コガイダン'.toHiragana(); // HanZenKaku.k2h('コガイダン')

わからなかったところ

ここの行でString.prototypeを拡張しています。
js-hanzenkaku/hanzenkaku.js at master · dankogai/js-hanzenkaku · GitHub

ドキュメントに書いてあったここの意味がわかりませんでした...

ES5 is required to prevent from String.prototype from being enumerated so built-in objects like String are safely extended.

String.prototypeが列挙されるのを防ぐためにES5が必要...?🐤
ES5ってちょっと古いJSのことでは...!?

列挙ってこういう話のことですかね...?
プロパティの列挙可能性と所有権 - JavaScript | MDN
Object.keys() - JavaScript | MDN

1時間調べて何もわからなかったので仕事に戻ります...
 

3行以内でまとめる

js-hanzenkakuを導入すると、

  • カタカナやひらがなに関する便利なメソッドを使うことができる

フィードバック

  • これは英文の意味としては、 String.prototype でメソッドが列挙されるのを防ぎ、安全にStringオブジェクトを拡張するためにES5が必須です、という意味。

Object.definePropertyを使っていて、これが使えるのがES5からだから。
developer.mozilla.org

  • Stringのようなビルトインのオブジェクトを拡張しようとすると、他のライブラリの挙動を壊してしまうことがある。ここではObject.definePropertyのenumerableのオプションを使うことで、他でObject.keys(String)などと使われているところがあっても影響をださずにStringを拡張できている(だから安全だ)と言っている。

> String.prototype.hoge = 'hogehoge';
> var str = 'str'
> for (var key in str) { console.log(str[key]) }
s
t
r
hogehoge

 
String.prototype.hoge = 'hogehoge';
のかわりに
Object.defineProperty(String.prototype, 'hoge', { ... オプション });
を使うことで上記の挙動を防ぐことができる。

  • 現在はこういうStringみたいなbuilt-inクラスを拡張するのは基本的に行儀が悪いのでダメということになっている。作られたのが2012年とのことなので、当時はそういうのもあったな、って感じ。

 
以上です!