JavaScript 配列から null とか undefined を取り除く

create-react-app で作ったプロジェクトを npm run eject して webpack の秘伝のタレを眺めていて次ような記述を発見しました。

const loaders = [
  // 略
].filter(Boolean);

0 とか null とか undefined とか false になる値を配列から削除してる

array.filter(callback) なので、先の例は次の処理と同等。

const loaders = [
  // 略
].filter((val) => Boolean(val));

filterは true を返す要素を残すので Boolean で Bool値変換して false になる要素を削除しているということでした。

e.g.

const list = [
  1,
  0, // want to remove
  -0, // want to remove
  -1,
  true,
  false, // want to remove
  null, // want to remove
  undefined, // want to remove
  NaN, // want to remove
  "a",
  "", // want to remove
];

list.filter((val) => Boolean(val));
// => [ 1, -1, true, 'a' ]
list.filter(Boolean);
// => [ 1, -1, true, 'a' ]

　
流石すごい人達が作った秘伝のタレ…学びがある。味ついてて美味しいです。

---

[参考]

• Array.prototype.filter() - JavaScript | MDN

リズと青い鳥[Blu-ray]

響け! ユーフォニアム 北宇治高校吹奏楽部、決意の最終楽章 後編 (宝島社文庫)

SUPERKIT レンジでゆで卵器 シンプル 卵蒸し器 たまご 電子レンジ用 １ケ用 白 超かわいい

ゆで卵…電子レンジで作れるんですね… (爆発すると思ってた

GitHub PR のコミット順がローカルの log と違う件

git rebase で --fixup や --squash したり、コミット順を入れ替えたりしたブランチで PR を出すと、PR内や Commits タグで表示されるコミットの並び順がローカルのリポジトリで git log --oneline で表示した順番と違っていることがありました。

GitHub の PR のコミットは日付順で並ぶ

GitHub の PR に表示されるコミットは日付順で並ぶらしく、特に rebase で順番を入れ替えたりしてもコミットした日付が残っているので、PRでは元の日付順に表示されてしまうのが原因だったようです。

--ignore-date オプションを使う

--ignore-date オプションを使って rebase すると日付がリセットされ、GitHub の PR に表示されるコミット順がローカルと同じになります。

$ git rebase --ignore-date <commit hash>

ただ、git log してみている限りコミットした日自体がリセットされるので作業した日のログ的なものとしてはダメになりそうです。もしかしたら内部的に残っているのかもですがチョット確認しきれてません。

---

[参考]

• レビュー依頼前のコミット整理方法 - Misoca開発者ブログ

入門git

Mac 黒い画面を Zsh にしてみた。

git やローカルサーバーの立ち上げ以外にも黒い画面 (ターミナル) 使うことが増えてきたので、デフォルトの bash から zsh にしてみたメモ。 尚、zsh のカラフルな画面にしてみたいと思っただけで bash との違いもイマイチわかってない。

環境は Mac OSX
黒い画面は iTerm2

install

$ brew install zsh

ログインシェルに zsh を追加

$ sudo vi /etc/shells

homebrew でインストールした zsh のパス /usr/local/bin/zsh を追加する

# List of acceptable shells for chpass(1).
# Ftpd will not allow users to connect who are not using
# one of these shells.

/bin/bash
/bin/csh
/bin/ksh
/bin/sh
/bin/tcsh
/bin/zsh
# 追加
/usr/local/bin/zsh

デフォルトのシェルを zsh に変更

$ chsh -s /usr/local/bin/zsh

iTerm を再起動するとシェルが zsh になっている。
bash に戻す時は $ chsh -s /bin/bash とすればOK

コマンドやディレクトリ名とかを自動補完できるようにする

.zprofile か .zshrc に設定ファイルを書いていく。(.zprofile に書くことにしました)
ファイルがない場合は作成する。

$ touch ~/.zprofile
$ vi ~/.zprofile

自動補完を有効にする設定を設定ファイルに追加

.zprofile

autoload -U compinit
compinit

設定を反映

$ source ~/.zprofile

ターミナルで使うフォントのダウンロード

Nerd fonts というGitHubとかのアイコンの入ったフォントをダウンロードします

$ brew tap caskroom/fonts
$ brew cask install font-hack-nerd-font

iTerm にフォントを反映

1. iTermのメニューバーから iTerm > Preference を選択して設定画面を開く
2. Profiles を選択し、Text タブを開く
3. Font 欄の 「Change Font」をクリックして Hack Regular Nerd Font Complete を選択する
4. Use a different font for non-ASCII text をチェックし、Non-ASCII Font の「Change Font」をクリックして Hack Regular Nerd Font Complete を選択

Powerlevel9k の導入

カレントディレクトリ名やGitリポジトリ名とかカラフルに表示してくれる Zsh のテーマ

$ git clone https://github.com/bhilburn/powerlevel9k.git ~/powerlevel9k

設定ファイルにテーマの設定を追加

.zprofile

POWERLEVEL9K_MODE='nerdfont-complete'
source ~/powerlevel9k/powerlevel9k.zsh-theme

# Theme settings
POWERLEVEL9K_LEFT_PROMPT_ELEMENTS=(ssh dir vcs newline status)
POWERLEVEL9K_RIGHT_PROMPT_ELEMENTS=()
POWERLEVEL9K_PROMPT_ADD_NEWLINE=true

テーマカスタマイズの設定方法がGitHubページに詳しく書かれている。
ref. GitHub - bhilburn/powerlevel9k: The most awesome Powerline theme for ZSH around!

間違ったコマンドとかをハイライトしてくれるプラグイン

$ brew install zsh-syntax-highlighting zsh-autosuggestions

設定ファイルに設定を追加 .zprofile

# Load Zsh tools for syntax highlighting and autosuggestions
HOMEBREW_FOLDER="/usr/local/share"
source "$HOMEBREW_FOLDER/zsh-syntax-highlighting/zsh-syntax-highlighting.zsh"
source "$HOMEBREW_FOLDER/zsh-autosuggestions/zsh-autosuggestions.zsh"

設定方法などは次のサイトに詳しく書かれてるので参考に
ref. zsh-syntax-highlightingを使ってターミナルを見やすくする - Qiita

bash の設定の読み込み

.bash_profile を読み込ませて bash で使っていたエイリアスとかをそのまま Zsh で使えるようにする。

.zprofile

source ~/.bash_profile

設定を反映

$ source ~/.zprofile

.bashrc や .bash_profile に alias ll='ls -G' とか書いているなら zsh で ll コマンドが実行できるようになっている。

所感

基本的にやり方書いてあるサイトを色々なぞっただけですが zsh を導入・カスタマイズすることが出来ました。
色々プラグインが動いているからだと思いますが、特にgitのリポジトリがあるディレクトリの場合エンター押した後の表示が少し遅いかなと感じる部分があるくらいです。
ag で検索するときとか改行連打してスペース空ける癖があるので。

検索していると fish というのもあるみたいです。
気が向いたら試してみたい

---

[参考]

• Zsh
• https://medium.com/the-code-review/make-your-terminal-more-colourful-and-productive-with-iterm2-and-zsh-11b91607b98c
• とりあえずZshを使えば良いんだろう？ - Qiita
• iTerm2 - macOS Terminal Replacement
• Nerd Fonts - Iconic font aggregator, collection, and patcher
  • GitHub - ryanoasis/nerd-fonts: Iconic font aggregator, collection, and patcher. 40+ patched fonts, over 3,600 glyph/icons, includes popular collections such as Font Awesome & fonts such as Hack
  • ターミナルでアイコンフォントを使う理由 | IIJ Engineers Blog
• GitHub - bhilburn/powerlevel9k: The most awesome Powerline theme for ZSH around!
  • Zsh の表示をカッコよくする 「Powerlevel9k」 | SlackNote
• zsh-syntax-highlightingを使ってターミナルを見やすくする - Qiita
• My .zshrc file · GitHub
• Oh My Zsh - a delightful & open source framework for Z-Shell
• 隠しファイルの表示 (ls -a) (Solaris ユーザーズガイド (上級編))

bash に戻す時

• Back to Bash: Remove Zsh and terminal themes on a Mac step-by-step

fish

• fish shell
• 「うん、このシェルいいね」5年間使ってきたzshからfishにのりかえました | 東京上野のWeb制作会社LIG
• fish shell を使いたい人生だった ｜ DevelopersIO

入門bash 第3版