- 1. ネコの鳴き声
- 1.0.1. JavaScriptでUTCを9時間足して簡単にJSTの時刻へ変換させる
- 1.0.2. GatsbyにDarkModeをつける
- 1.0.3. Kinx ライブラリ - Process
- 1.0.4. Javascriptで小数を指定桁で切り捨て後に末尾を0埋めする方法
- 1.0.5. 【JavaScript】別ページからアンカーリンク移動時の、固定ヘッダー分ずれ解消
- 1.0.6. Javascriptでchageイベントの取れないhidden項目やiframeの変化をMutationObserverで取得し処理する
- 1.0.7. TECH CAMP 7,8週目
- 1.0.8. はじめてのThree.js 8章 日記
- 1.0.9. Djangoを用いてhtmlからPythonファイルを実行する
- 1.0.10. javascript
- 1.0.11. Javascriptでアコーディオンメニュー作ってみた
- 1.0.12. Nuxt.jsとFirebaseで個人開発アプリをシェアできるウェブサービスを作った話
- 1.0.13. Node.js インストールからREPL、ファイル実行まで(mac)
- 1.0.14. 組込み向けJSインタプリタEspruinoをRaspberryPi上で試す
- 1.0.15. Vue.js 学習ロードマップ 無料で学べる教材リンク
変数をコピーした時の値 vs 参照
まだまだ完璧に理解しているとは言えないのですが、
フォルダの例えですっきりしたのでシェアします。## 値渡しと参照渡し
ひとつの変数から他の変数に中身をコピーしたい場合、
ざっくり言うとStringとObjectで挙動が変わってしまう。– string … コピー元が変わらない
– object … コピー元も書きかわってしまう## Stringの場合
Stringはプリミティブ型。メソッドを持たないデータ型。“`
let name1 = ‘tom’;
let name2 = ‘tom’;
console.log(name1, name2): // tom tomname1 = ‘bob’; //ここでname1を書き換える
console.log(name1, name2): // bob tomname2 = name1; //name1(今はbob)をname2つに入れる。name1のコピーを作ってname2という名前にする
console.log(name1, name2): // bob bob
“`stringは中にvalueしかな
Uncaught TypeError: Cannot read property ‘hoge’ of undefined
### ‘〇〇’ of Undefined
よく出くわすエラーなのですが、〇〇がundefinedで〇〇がおかしい!と私は早とちりしがちなので、
このエラーがどういう意味なのかということを残しておこうと思います。### マリオで見てみよう
こういうobjectがあるとします。
“`
const mario = {
job: ‘plumbing’,
relationship: {
brother: ‘Luige’
}
};
“``mario.hobby`だと、そんなプロパティはないので、`undefined`になります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/126769/1afc2eaa-fa30-a2f4-5143-634390ce09b4.png)
ここまでは想像がつきますね。### cannot read property ‘fire’ of undefined
で、どんなふうに呼び
React-Grid-LayoutでサクッとDrag & Dropできるコンポーネントを作る
React-Grid-Layoutを使用して、Drag & Dropで移動でき、サイズの変更も可能なコンポーネントの実装を試してみます。
完成形は以下のようになります。![react-grid-test.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/503026/9809d4f0-254b-4489-e64c-c8a06ee3c8fe.gif)
#React-Grid-Layoutって?
React-Grid-Layout(以下RGL)はReact用のグリッドレイアウトです(まんま)。
上の画像のように、D&Dでコンポーネントの移動ができるようになります。
また、RGLのインストールにはreact-resizableというパッケージも含まれており、コンポーネントのサイズの変更も可能になります。多分GitHubのREADME見れば実装するのも簡単だと思いますが、
React初めて一週間くらいなので、練習がてらまとめておきたいと思います。####GitHub
https://github.
JavaScriptHack Hackフォルダ オブジェクト指向編/Dom編
#JavaScript Hackとは
##前提
弱いなりにサバイバルしていくためのもの。きちんと学ぶことも必要だが
英語のようにお客さんに単語を並べて乗り切られ、残念な結果は避けたい。
経験としてDomとFormを押さえればいけるのではないかという見込みで
Hackを行っていく。オブジェクト指向は今回はさわりだけしか取り上げないことにする。##概要
なぜJavaScriptをやるか?
→ 今でも使ってるところは使っている。
→ 裏ニーズとしておしゃれなフレームワークを学ぶためにもやっておいたほうがいい。##JavaScriptHack Hackフォルダ オブジェクト指向編
###コンテンツ
オブジェクト指向を学ぶ。
シラバスを作成する。###オブジェクト指向を学ぶ。
Progate JavaScript Ⅳ
https://prog-8.com/languages/es6
###シラバスを作成する。
・オブジェクト
・クラス
・継承##JavaScriptHack Hackフォルダ Dom編
###コンテンツ
Domを学ぶ。
ゲームを作成する。
シラバスを作成する。
【JavaScript】ネコ泣いちゃったゲーム作ってみた(遊び)
##ネコ泣いちゃったゲーム
MDNサイトの学習に沿って、オリジナルの簡単な動作物を作成しました。※MDNサイト↓
https://developer.mozilla.org/ja/docs/Learn/JavaScript/First_steps/What_is_JavaScript##HTML
“`
ネコの鳴き声
“`##JavaScript
“`