本記事を投稿しとうとしたきっかけ

JavaScriptの勉強をしていて、prototypeでのオブジェクト指向について勉強をやっていた時
thisの挙動がよくわからなくなったため、色々調べました。
その際に調べたthisについて、本記事で色々まとめてみたいと思います。
何か不足している情報などあれば、コメントください。。。

prototypeオブジェクト

よくJavaScriptで、機能ごとにオブジェクトにまとめたいなどあると思います。
その際に必ず、prototypeや、ES6だとclassに出会うことができると思います。

var UserInfo = function(userName, age, sex) {
    this.userName = userName;
    this.age = age;
    this.sex = sex;
}

UserInfo.prototype = {
    toString() {
        console.log('名称：' + this.userName);
        console.log('年齢：' + this.age);
        console.log('性別：' + this.sex);
    }
}

var userInfo = new UserInfo('太郎', 20, '男');
userInfo.toString();
// -> 名称：太郎
// -> 年齢：20
// -> 性別：男

「名称」「年齢」「性別」の3つのメンバ変数を持ち、prototypeには、ユーザ情報について表示するtoStringメソッドのあるユーザ情報オブジェクトです。
メンバ変数に注目すると、thisが出現します。
そのthisで定義された変数は、prototypeで定義したメソッド内（上記ソースだとtoStringメソッド）などで用いることができます。

しかし、以下のソースを実行してみると、予想とは違う挙動になります。

var UserInfo = function(userName, age, sex) {
    this.userName = userName;
    this.age = age;
    this.sex = sex;
}

UserInfo.prototype = {
    toString: function() {
        console.log('名称：' + this.userName);
        console.log('年齢：' + this.age);
        console.log('性別：' + this.sex);
    },
    // 追記
    set: (userName, age, sex) => {
        this.userName = userName;
        this.age = age;
        this.sex = sex;
    }
}

var userInfo = new UserInfo('太郎', 20, '男');
// 追記
userInfo.set('花子', 30, '女');

userInfo.toString();
// -> 名称：太郎
// -> 年齢：20
// -> 性別：男

あれ？変わらない？

先ほどの追記したソースをみてみると、setメソッドはアロー関数(Arrow_functions)で記述されています。
勉強していく上で、いちいちfunctionって書くのがめんどくさくなり、アロー関数をたくさん書くようにしたら、上記のようなソースでハマりました。。。

よくわからないまま直そうとした際、とりあえず、アロー関数を普通のfunctionにしてみようと思い、戻してみました。
すると表示結果は自分の思っていたような正常動作になりました。

    // ...省略
    set: function(userName, age, sex) {
        this.userName = userName;
        this.age = age;
        this.sex = sex;
    }
}

var userInfo = new UserInfo('太郎', 20, '男');
userInfo.set('花子', 30, '女');
userInfo.toString();
// -> 名称：花子
// -> 年齢：30
// -> 性別：女

いやー、そんなに長くハマらずに済みました〜。

うん？つまり、アロー関数が悪い？

アロー関数とthisの相性が悪いのか？っと考え、色々調べてみました。
MDNさんのアロー関数の説明によると

2 つの理由から、アロー関数が導入されました。1 つ目の理由は関数を短く書きたいということで、2 つ目の理由は this を束縛したくない、ということです。

あぁなるほど〜束縛したくないからね〜。
裏側の実装とか、細かいことなどが理解していないと、上記の説明では理解に苦しみます。。。

さらに色々調べてみました。戦いですね。
するといい記事が発見できました。

• 【JavaScript】アロー関数式を学ぶついでにthisも復習する話
• JavaScript の this を理解する多分一番分かりやすい説明

@mejileben, @takkyunさん、ありがとうございます！
とってもわかりやすかったです！

そもそもthisというのは

簡潔にいうと、thisというのは

• this は function を呼んだ時の . の前についているオブジェクトを指している
  ※@takkyunさんの記事引用

らしい。

.の前に何もなければ、グローバルオブジェクトをthisは参照するらしい。
例として、以下のソースを見ていただきたい。

var userName = '花子';
var age = 30;
var sex = '女';

var toString = function() {
    console.log('名称：' + this.userName);
    console.log('年齢：' + this.age);
    console.log('性別：' + this.sex);
}

var UserInfo = {
    userName: '太郎',
    age: 20,
    sex: '男',
    toString: toString
}

// toStringの . の前はUserInfoです。
// よって、thisはUserInfoを参照するわけです。
UserInfo.toString();
// -> 名称：太郎
// -> 年齢：20
// -> 性別：男

// toStringメソッドをいきなり呼ぶと
// . の前には何もないため、thisはグローバルオブジェクトを参照するわけです。
toString();
// -> 名称：花子
// -> 年齢：30
// -> 性別：女

グローバルオブジェクトについては、知っている前提で話を進めます。
もし、わからない方がいれば

Global object (グローバルオブジェクト)

を参照してください。

以下のソースは、グローバル領域とグローバルオブジェクトについてのソースとなります。

// グローバル領域でthisを参照すると、グローバルオブジェクト(Window Object)が出力されます。
console.log(this);
// -> Window {postMessage: ƒ, blur: ƒ, focus: ƒ, close: ƒ, parent: Window, …}

// グローバル領域で変数を定義。
// すると、以下のargはグローバルオブジェクトのメンバ変数として追加される。
var arg = "argument0";

// 以下は全て同じものを参照している。
console.log(arg);        // -> argument0
console.log(this.arg);   // -> argument0
console.log(window.arg); // -> argument0

なるほど、だんだんわかってきましたぞ。

あ。アロー関数は？

そもそもアロー関数を使用したら、うまくいかなかったというのに、少しthisの話が長くなってしまいました。。。
それでは、アロー関数でのthisの挙動はどうなるのでしょうか？
こちらも簡潔にいうと

• アロー関数式で宣言された関数は、宣言された時点で、thisを確定（＝束縛）させてしまうのです。
  ※@mejilebenさんの記事引用

こちらも実際にソースをみてみましょう。

var arg = "argument0";

// アロー関数でメソッドを定義
// 定義した時点でthisの参照先は束縛されます。
var func = () => {
    console.log(this.arg);
}

// 上記で宣言したメソッドをメンバ変数として追加。
var obj = {
    arg: "argument1",
    func: func
}

// こちらは、先ほどと変わらず、グローバル領域の変数を参照します。
func();      // -> argument0
// アロー関数で定義した時点でthisの参照先が決定するため
// objを参照せず、その外側の領域(グローバル領域)を参照します。
obj.func();  // -> argument0

いやー、結構わかってきたぞー

thisでの挙動についてある程度理解しました。
そこで、自分なりに色々意地悪なソースを考えてみたりして。。。
皆さんも、以下のソースで実際にどのような出力結果となるか考えてみてください！

arg = "arg1";

function consoleLog() {
    console.log(this.arg);
}

var obj1 = {
    arg: "argument2",
    func: consoleLog
}

var obj2 = {
    arg: "argument3",
    func: () => {
        console.log(this.arg);
    }
}

var obj3 = {
    arg: "argument4",
    func: function() {
        var arg = "argument5";
        var subFunc = () => {
            console.log(this.arg);
        }

        subFunc();
    }
}

var obj4 = {
    arg: "argument6",
    func: function() {
        var arg = "argument7";
        var subFunc = function() {
            console.log(this.arg);
        }

        subFunc();
    }
}

consoleLog(); // -> ???
obj1.func();  // -> ???
obj2.func();  // -> ???
obj3.func();  // -> ???
obj4.func();  // -> ???

ちょっと応用がきいているのではないかと思いますが、考えてみる価値はありそうです！
答えは、Chromeなどの開発者ツールのコンソールに上記ソースをはっつけていただいて、実行すれば答えがわかります！
個人的には、obj4のfunc実行時の出力結果が難しいのではないかと思っています。
ただ、thisの最初の説明にあった箇所を思い出せば解けると思います。
どんなにスコープがネストしても、いきなり . の前にオブジェクトがないfunctionを呼び出したりすると。。。

まとめ

ここまで、説明が足りない箇所もあったかと思われますが、ざっとまとめてみました。
JavaScriptでのthisは少し複雑だなと感じました。
あとは、何も考えずにアロー関数をバンバン用いるのは危険であることもわかりました。（気をつけます）

thisの操作に慣れると、ソースも安全に組むことができますし、正しいthisの使い方でコーディングできると思われます。
また、thisを正しく理解して用いると、コード量も減るのではないか？とも感じました。

もっとthisについて、上記以外の複雑なとこがあれば教えてください！
ここまで読んでくれた方、ありがとうございました?‍♂️

たとえばSlackでのZen mode の実践。

人とコミュニケーションする時ではなく、何かまとまったテキストを集中して書きたいときの話だ。

サイドバーは左脇に隠す。

これは自分で前に編み出したハック。

だがウィンドウサイズを採取にしても、入力エリアだけの表示には出来ない。

なので過去に書いたテキストがどうしても目につく。

隠せない。

そこでHeliumという前面ウィンドウ固定のアプリケーションを入れて、Slackの画面を覆い隠す。

目隠しする。

これはなかなか良い。

Slackのテキストエリアが文章量に応じて拡張するので、なかなかうまく全ては隠せないけれども。

Macデスクトップの背景画像も刺激の少ないものに工夫する。

完全なブラックは世界が閉ざされた感じがするので、ブラックに近い自然の画像が良い。

こうやって試行錯誤するが、何かアプリケーションで完全な禅モードを実践するのはなかなか難しいみたいだ。

そもそも禅を基本コンセプトに置かないものであると。

Slackでも本当にチャンネル名と入力エリアしか表示されない完全にサイレンスなモードがあれば、集中力にどれぐらい寄与するか分からないと思うのだけれど。

ほんの小さなフォントの文字が目の端に映るだけで、目は無意識にそれを読んでいる。

少なくとも意識に占める割合は0%ではないだろう。

ここではSlackの例に例えたが、プログラミングをするときでも同じだ。

僕らがまるで気が付かない視覚情報の働きが、ひたすらに注意力を削り取っていく。

だから集中モードに入りたい時はノイズは少なければ少ない方が良い。

それが視覚情報であっても、音声情報であっても、どんなタイプの刺激であっても。

ところで耳栓とイヤーマフラーを同時にしながらだと多くの聴覚ノイズを消すことが出来るが、頭が締め付けられてそれはそれで消耗する。

いちはやく人間工学的に優しいイヤーマフラーが発売されてほしい。

ノイズキャンセリング系のアイテムもなかなか微妙なところがあり、まだ本格利用には至っていない。

ZenModeでプログラミングしよう。

必要なのは集中力ではなく、集中力を担保できる環境設定だ。

Original Text

Mac の作業で #集中力 を上げるための禅モード。たとえばSlackでのZen mode の実践。人とコミュニケーションする時ではなく、何かまとまったテキストを集中して書きたいときの話だ。サイドバーは左脇に隠す。これは自分で前に編み出したハック。だがウィンドウサイズを採取にしても、入力エリアだけの表示には出来ない。なので過去に書いたテキストがどうしても目につく。隠せない。そこでHeliumという前面ウィンドウ固定のアプリケーションを入れて、Slackの画面を覆い隠す。目隠しする。これはなかなか良い。Slackのテキストエリアが文章量に応じて拡張するので、なかなかうまく全ては隠せないけれども。Macデスクトップの背景画像も刺激の少ないものに工夫する。完全なブラックは世界が閉ざされた感じがするので、ブラックに近い自然の画像が良い。こうやって試行錯誤するが、何かアプリケーションで完全な禅モードを実践するのはなかなか難しいみたいだ。そもそも禅を基本コンセプトに置かないものであると。Slackでも本当にチャンネル名と入力エリアしか表示されない完全にサイレンスなモードがあれば、集中力にどれぐらい寄与するか分からないと思うのだけれど。ほんの小さなフォントの文字が目の端に映るだけで、目は無意識にそれを読んでいる。少なくとも意識に占める割合は0%ではないだろう。ここではSlackの例に例えたが、プログラミングをするときでも同じだ。僕らがまるで気が付かない視覚情報の働きが、ひたすらに注意力を削り取っていく。だから集中モードに入りたい時はノイズは少なければ少ない方が良い。それが視覚情報であっても、音声情報であっても、どんなタイプの刺激であっても。ところで耳栓とイヤーマフラーを同時にしながらだと多くの聴覚ノイズを消すことが出来るが、頭が締め付けられてそれはそれで消耗する。いちはやく人間工学的に優しいイヤーマフラーが発売されてほしい。ノイズキャンセリング系のアイテムもなかなか微妙なところがあり、まだ本格利用には至っていない。ZenModeでプログラミングしよう。必要なのは集中力ではなく、集中力を担保できる環境設定だ。tags:qiita

English Translated

In the work of # Mac it is Zen mode to raise concentration. For example, Zen mode practice in Slack. It's a story when we want to focus something together rather than when communicating with people. Hide the sidebar on the left side. This is a hack we created earlier. However, even if the window size is sampled, it is not possible to display only the input area. So I can not see the text I wrote in the past. I can not hide it. So put in the front window fixed application called Helium, cover up Slack's screen. To blindfold. This is pretty good. Although the text area of Slack expands according to the amount of sentences, I can not hide it all well well though. Also devise a background image of Mac desktop with less irritation. Perfect black has a feeling that the world was shut, so natural images close to black are good. This is trial and error, but it seems difficult to practice the complete Zen mode with some application. In the first place Zen should not be placed on the basic concept. I think that if you have a completely silent mode where Slack really shows only the channel name and input area, I do not know how much I can contribute to concentration. Just a small font character appears at the edge of the eyes, the eyes are reading it unconsciously. At least the percentage of consciousness will not be 0%. Here is an example of Slack, but it is the same when programming. The function of visual information that we do not notice as usual will scratch our attention. Therefore, when you want to enter centralized mode, it is better to have less noise if fewer. Whether it is visual information, voice information, or whatever type of stimulus it is. By the way, while hearing the earplug and the ear muffler at the same time, many auditory noises can be erased but the head is tightened and it is consumed by it. I want you to release an ergonomically friendly ear muffler one after another. Items of the noise canceling system are also quite delicate, and have not yet reached full-scale use. Let's program with ZenMode. What you need is not concentrating ability, it is an environment setting that can secure concentration. tags: qiita

Chinese Translated

在＃Mac的工作中，提升注意力是禅模式。例如，Slack中的Zen模式练习。这是一个故事，当我们想要集中在一起而不是与人沟通时。隐藏左侧的侧边栏。这是我们之前创建的一个hack。但是，即使采样窗口大小，也不能仅显示输入区域。所以我看不到我过去写过的文字。我无法掩饰它。所以在前窗放置固定的应用程序叫做Helium，掩盖了Slack的屏幕。蒙上眼睛。这很不错。尽管Slack的文本区域根据句子的数量而扩展，但我无法将其完全隐藏起来。还设计了Mac桌面的背景图像，减少了刺激。完美的黑色有一种感觉世界被关闭，所以接近黑色的自然图像是好的。这是试验和错误，但似乎很难用一些应用程序来练习完整的Zen模式。首先，Zen不应该放在基本概念上。我认为如果你有一个完全静音的模式，Slack真的只显示频道名称和输入区域，我不知道我能为注意力做多少贡献。只是一个小字体出现在眼睛的边缘，眼睛在不知不觉中阅读它。至少意识的百分比不会是0％。这是Slack的一个例子，但编程时也是如此。我们通常不会注意到的视觉信息功能会引起我们的注意。因此，当您想要进入集中模式时，最好是减少噪音。无论是视觉信息，语音信息还是其他类型的刺激。顺便说一句，在同时听到耳塞和耳罩的同时，可以擦除许多听觉噪音但是头部被收紧并被它消耗掉。我希望你一个接一个地发布符合人体工程学的耳罩。降噪系统的项目也很精致，尚未达到全面使用。让我们用ZenMode编程。你需要的不是集中精力，它是一种可以确保集中注意力的环境。标签：qiita

Links

• いなうらゆうまはここにいた 2019-03-07

Original by Github issue

https://github.com/YumaInaura/zen/issues/27

1.はじめに

動作も軽くプラグインも豊富で業務でもちょっと使用していたのでよく使うショートカットなどを備忘録兼ねて載せます。

動作環境

Visual Studio Code バージョン1.31.1 (1.31.1)

2.Mac装飾キーの記号

まずはいつも忘れるのでこれ大事。

キー	内容
⌘	command
^	control
⇧	shift
⌥	option (alt)

3.よく使うショートカット

全然覚えていないので少ない。

コマンド	内容	備考
⌘ + ⇧ + P	コマンドパレットを開く
⌥ + ⇧ + F	ファイル内全コード整形
⌘ + ,	設定を開く
⌘ + K の後に ⌘ + 0	すべてのインデントを折りたたむ
⌘ + K の後に ⌘ + J	すべてのインデントを展開
⌘ + K の後に ⌘ + [	カーソルのあるインデントを子インデント含め折りたたむ
⌘ + K の後に ⌘ + ]	カーソルのあるインデントを子インデント含め折りたたむ

4.入れておいたほうがいいプラグイン

僕はHTML,CSSのコーディングで使用しているだけなのでとりあえずこれだけ。

• IntelliSense for CSS class names in HTML
  CSSクラスを指定するときに、入力補完してくれる。
  ワークスペースの中のCSSを読み込んでHTML上でクラス指定するときに入力候補を表示してくれる。

• Japanese Language Pack for Visual Studio Code
  VSCの日本語化パッケージ。そのままでもいいのですが、やっぱり日本語の方が馴染みやすい。

• Live HTML Previewer
  読んで字のごとく、HTMLをリアルタイムでプレビュー表示してくれる。
  ただCSSを変更しても即時反映してくれず、プレビューし直さないといけなかった。

• HTMLHint
  HTMLの構文チェックをしてくれる。

• HTML Snippets
  HTML5にも対応している追加スニペット。

プラグインインストール方法

1.VSCを開いてサイドバーの一番下にあるアイコンをクリック。画像の赤矢印のところ。

2.検索フィールドにインストールしたいプラグインのキーワードを入れる。
3.該当のプラグインの表示の中にインストールボタンがあるのでクリック。
4.「⌘ + q」でVSCを再起動。

5.まとめ

iOS開発がメインだった為、テキストエディタはCotEditorぐらいしか使わずにいましたが、HTML、CSSをやっているのでこれを機にエディタを変えようと思い探していました。
Sublime、Atomとで迷ったんですが、先輩からのおすすめもありVSCにしました。
全く使いこなせていませんが、仕事していれば覚えるでしょう。
Let's do VSC!!

5年前のもの
https://qiita.com/yuch_i/items/470685b945578afabbb9

概要

• あまりいろいろ使わなくなった
• JetBrains TOOLBOX最強!
• Docker便利!

開発系

JetBrains TOOLBOX

諸々。WebStorm/PyCharm/GoLand/IntelliJ/DataGridがメイン。
RubyMine/PhpStormも時々使う。

JS/TSは一時Visual Studio Codeに浮気してたがWebStormに戻ってきた。

一括アップデート、設定の同期化、便利。

Iterm2

開発中はIDEと行ったり来たり。
IDE付属のターミナルは基本使っていない。

https://www.iterm2.com

Xcode

Swift開発用。
最近あまり出番がない。

Karabiner Elements

US配列なので必須。
Ctrl+7で日本語、Ctrl+8で英語にするように設定している。

https://pqrs.org/osx/karabiner/

Tower

gitクライアント。
commitは差分が見やすいGUIでやりたい。
ずっと使ってる。

https://www.git-tower.com/mac

Notes (メモ)

タスク・メモのフロー情報管理はMac標準のメモに落ち着いた感じ。
ストック情報としたい場合はGoogle Docsに階層化して保存している。

TODO管理はThings -> Omni Focus -> Notes
テキストエディタもmi -> Cot Editor -> Notes

Safari, Chrome

通常利用はSafari。
開発用はChrome。

Docker Desktop

開発環境はなるべくコンテナ化しようとしている途中。
circleciコマンド経由で使っている場合もある。

https://www.docker.com/products/docker-desktop

VirtualBox + vagrant

Windows上での動作確認など、VMが必要な場合に使う。

CLI

zsh

Macではシェルはzshを使っている。

ansible

個人環境の設定ファイルやhomebrewパッケージはansibleで管理している。

Other

他はコミュニケーション系でSlack, Skype入れてるくらい。

macのwebでfigmaを使っていて
Missing Fontsのエラーが出て日本語入力できなかった

・Noto Sans CJK JPをダウンロードする

https://www.google.com/get/noto/#sans-jpan

・Font Book.appを立ち上げる
ダウンロードしたzipの中からoftファイルを全部選んでドラッグ&ドロップ

完了

今日僕はMacのデスクトップの背景を暗い砂漠に変えた。

忍者のイメージだ。

忍者なら絶対にこれを使う。

Zapier連携で投稿しているせいで画像が載せられないのが残念だ。

Macのデスクトップ背景などまず見ることはなかった。

今までであれば。

だがしかし最近はZenモードを実践している。

OSでもアプリケーションでもなるべく。

余計な情報を一切排除して一点集中する。

会社の賢者も昨日話していた。

マルチタスキングは実は健康に悪いものを食べ続けるよりも脳に悪いと。

だからなんとかして一点集中の技術を身に着けてゆく。

禅だ。

一点集中というと体がガチガチに緊張して疲れ果てるようなイメージを描く人もいると思う。

まさに以前の僕もそうだった。

だけど実は一点集中はとても心地よい。

呼吸が非常に安定している。

全てのインプットがアウトプットとして感じられる。

呼吸みたいに循環的だからだ。

まさに禅の世界だ。

コツとしてはなるべく体を動かさない方が良い。

僕の場合はそう実感する。

本当に必要最低限の動きだけに制限していく。

眉間のあたりに緊張感が起こったらひたすらに緩め続ける。

体のすべての昨日を適度なテンションに統合していく。

ディティールを語るならばそれが良い集中状態だ。

歯ぎしりをギリギリするような悪い集中状態とはまったく逆の状態だと言える。

だからひとくちに集中力と言っても人が思い描くものはまったく違うのだ。

閑話休題。

Macを使っていてデスクトップを見ることなど今まではなかった。

まず色々なアプリケーションの窓に溢れていた。

窓が多すぎた。

今はディスプレイの四分の一ほどを1個のアプリケーションが占め、他の四分の三をデスクトップ背景が占める。

この自主的なZenモードをとても気に入っている。

プログラミングや日々の自戒にも静寂が必要。

空白が必要だからだ。

空白を愛せよ。

とあるアジャイルサムライより。

Original Text

君はMacのデスクトップ背景を見たことがあるか？ とあるアジャイルエンジニアより愛を込めて。今日僕はMacのデスクトップの背景を暗い砂漠に変えた。忍者のイメージだ。忍者なら絶対にこれを使う。Zapier連携で投稿しているせいで画像が載せられないのが残念だ。Macのデスクトップ背景などまず見ることはなかった。今までであれば。だがしかし最近はZenモードを実践している。OSでもアプリケーションでもなるべく。余計な情報を一切排除して一点集中する。会社の賢者も昨日話していた。マルチタスキングは実は健康に悪いものを食べ続けるよりも脳に悪いと。だからなんとかして一点集中の技術を身に着けてゆく。禅だ。一点集中というと体がガチガチに緊張して疲れ果てるようなイメージを描く人もいると思う。まさに以前の僕もそうだった。だけど実は一点集中はとても心地よい。呼吸が非常に安定している。全てのインプットがアウトプットとして感じられる。呼吸みたいに循環的だからだ。まさに禅の世界だ。コツとしてはなるべく体を動かさない方が良い。僕の場合はそう実感する。本当に必要最低限の動きだけに制限していく。眉間のあたりに緊張感が起こったらひたすらに緩め続ける。体のすべての昨日を適度なテンションに統合していく。ディティールを語るならばそれが良い集中状態だ。歯ぎしりをギリギリするような悪い集中状態とはまったく逆の状態だと言える。だからひとくちに集中力と言っても人が思い描くものはまったく違うのだ。閑話休題。Macを使っていてデスクトップを見ることなど今まではなかった。まず色々なアプリケーションの窓に溢れていた。窓が多すぎた。今はディスプレイの四分の一ほどを1個のアプリケーションが占め、他の四分の三をデスクトップ背景が占める。この自主的なZenモードをとても気に入っている。プログラミングや日々の自戒にも静寂が必要。空白が必要だからだ。空白を愛せよ。とあるアジャイルサムライより。

English Translated

Have you seen the desktop background of Mac? From a certain agile engineer with love. Today I changed my desktop background to a dark desert. It is an image of a ninja. If a ninja absolutely uses this. It is a pity that I can not put images on account of Zapier collaboration posting. I never saw Mac's desktop background etc. If it is up to now. But recently I practice Zen mode. Be sure to use OS and applications as well. We eliminate unnecessary information and focus on one point. The company 's wise man was talking yesterday. Multitasking is actually bad for the brain rather than continuing to eat something bad for health. So somehow I will be wearing a focused technique. It is Zen. I think that there are people who draw an image that the body gets nervous and exhausted due to tightness on one point. Even before me, it was the same. However, in fact one point concentration is very comfortable. Breathing is very stable. All inputs are felt as outputs. It is because it is cyclical like breathing. It is exactly the world of Zen. As a trick it is better not to move the body as much as possible. In my case I realize that. It really limits it to the minimum necessary movement. If a sense of tension arises around the glabella, continue to loosen all at once. We will integrate all the yesterday's in the body into moderate tension. If you talk about detail it is a good concentration situation. It can be said that it is totally in the opposite state to the bad concentrating state like grinding bruxism. So even if you say concentration at a moment, what people envision is quite different. Cruel talk time. There was not anything like seeing the desktop when using a Mac. It was full of windows of various applications. There were too many windows. Now one application occupies about a quarter of the display and the other three quarters occupy the desktop background. I like this voluntary Zen mode very much. Silence is necessary for programming and daily self-regulation. It's because you need a blank. Love the blank. From a certain agile samurai.

Links

• いなうらゆうまはここにいた 2019-03-07

はじめに

Mac の日本語配列キーボード使いの僕が、肩甲骨の痛みを緩和するために、日本語配列の貴重な分割キーボード Mistel Barocco MD600 を購入してカスタマイズしたメモです。

カスタマイズ内容

macOS のキーボードカスタマイズツール Karabiner Elements と Barocco 自体のカスタマイズ機能で下図のように変更しました。ほぼ Mac の配列が再現されています。

Barocco のカスタマイズ機能

• FN を押しながら ¥ を押すと、E/J が ESC キーに変わる（キーが青色に光る）
• WIN と KANA と右スペースを同時に押すと、右下の \, FN, PN, CTRL キーがそれぞれ ↑, ←, ↓, → のカーソルキーに変わる。

※ FN + I, J, K, L でカーソルキーとして動作するが、カーソルキーを多用する僕としてはこの位置では打ちにくいためこのように変更。FN が使えなくなるが僕はほぼ使わないので問題なし。

Karabiner Elements (Simple Modifications)

下記のようにキー配置を交換。

• CAPS LOCK -> 左Control (caps_lock -> left_control)
• 左CTRL -> Caps Lock (left_control -> caps_lock)
• WIN -> 左ALT (left_command -> left_option)
• WIN -> 左Command (left_option -> left_command)
• 左スペースの左の謎のキー -> 英数 (international4 -> lang1)
• 右スペースの右の謎のキー -> かな (international5 -> lang2)
• KANA -> 右Command (international2 -> right_command)

※ 僕は入力切替に英数・かなキーを多用する。

Karabiner Elements (Complex Modifications)

右シフトを押しながら↑（変更前の \）を押すことで _ の入力になるように、Karabiner Elements のカスタムコード（下記）で設定。

{
  "title": "Custom",
  "rules": [
    {
      "description": "左Shift + ↑ -> `_`",
      "manipulators": [
        {
          "from": {
            "key_code": "up_arrow",
            "modifiers": {
              "mandatory": [
                "right_shift"
              ],
              "optional": [
                "any"
              ]
            }
          },
          "to": [
            {
              "key_code": "international1"
            }
          ],
          "type": "basic"
        }
      ]
    }
  ]
}

慣れる

最後の難点として、僕は右手人差し指で押す B キーが左側のキーボードにあるということ。これは２日くらいがんばったら左手人差し指で自然に押せるようになった。