牌語備忘録 -pygo

あくまでもメモです。なるべくオフィシャルの情報を参照してください。

牌語備忘録 -pygo

Javascript

Javascript の値渡しと参照渡しのメモ

let a = [1,2,3] let b = a b[0] = 0 console.info(b) //-> [0, 2, 3] console.info(a) // コピー元も変わる //-> [0, 2, 3] let c = a.concat() // 配列をコピー c[0] = 100 console.info(c) //-> [100, 2, 3] console.info(a) //-> [0, 2, 3] 参考 Array.p…

ナウい Javascript のオブジェクトの複製のやり方メモ

const obj = {hoge: 'HOGE'} const obj1 = Object.assign({}, obj) const obj2 = {...obj} obj.fuga = 'FUGA' console.info(obj) console.info(obj1) console.info(obj2) //-> {hoge: "HOGE", fuga: "FUGA"} //-> {hoge: "HOGE"} //-> {hoge: "HOGE"} {...ob…

Javascript で配列に arr.push() で配列を追加するメモ

let a = [1,2,3] console.info(a) //-> Array(3) [ 1, 2, 3 ] let b = [4,5,6] a.push(...b) console.info(a) //-> Array(6) [ 1, 2, 3, 4, 5, 6 ] ...arr が何だったか忘れがちなのでメモ

Nuxt.js で /hoge?q=fuga みたいなリンクのurlのクエリを取得するメモ

遷移してきたときは created か mountedで 同じ画面でリンク踏んでqueryを変更する場合は beforeRouteUpdate で export default { data () { return { query: '', } }, created() { this.setQuery() }, beforeRouteUpdate(to, from, next) { next(); this.se…

Javascript でオブジェクトを Object.assign とかでコピーして処理しないとヤバそうなのでメモ

処理 const DATA = {id:1, name:'hoge'} const update = (data) => { delete data.id data.name = 'fuga' return data } const main = (data) => { const result = update(data) console.info('result', result) } オブジェクトをコピーしないで実行 元のオ…

近頃の Javascript の関数の書き方メモ

関数定義 追加と上書き的なやつ 関数定義 アロー関数だと this が空 const funcs = { foo: function({a, b}) { console.info(`${a} ${b}!!!1`) console.dir(this) }, bar({a, b}) { console.info(`${a} ${b}!!!2`) console.dir(this) }, baz: ({a, b}) => { …

Nuxt.js で vue-input-tag を使ってみるメモ

Nuxt.js でやってみる plugins 新規作成 src/plugins/vue-input-tag.js import Vue from 'vue' import VueInputTag from 'vue-input-tag' Vue.component('vue-input-tag', VueInputTag) nuxt.config.js に設定を追加 plugins: [ { src: '@/plugins/vue-input…

Nuxt.js と vee-validate でエラーメッセージは日本語でバリデーションするメモ

前提 npm install する場合 plugins/vee-validate.js nuxt.config.js pages/hoge.vue CDN 使う場合(追記20181031) plugins/vee-validate.js nuxt.config.js 参考リンク 前提 nuxt.js でプロジェクト作成済み前提 (nuxt2.0.0) npm install する場合 $ npm i…

css helper 的なやつを Javascript で簡単に生成してみるメモ

Javascript const lineList = [ '.w100 {width: 100%;}', '.text-left {text-align: left;}', '.text-center {text-align: center;}', '.text-right {text-align: right;}', '.text-justify {text-align: justify;}', ]; lineList.forEach(line => { console…

Javascript で非同期処理を async/await を使わない場合・使った場合のメモ

async/await を使わない場合 async/await を使った場合 (あくまでもこんな感じという擬似コードなので動かないです) async/await を使わない場合 promise.then(() => { console.info('ペ'); asyncFunc1.then(() => { console.info('ン'); }).then(() => { …

Node.js でファイルのパスからファイル名や拡張子を取り出すメモ

(node v8.x) const path = require('path'); const filePath = 'hoge/fuga/moge.png'; console.info(path.basename(filePath)); console.info(path.dirname(filePath)); const ext = path.extname(filePath); console.info(ext); console.info(path.basename…

Javascript で非同期処理の戻り値を実行順で取りたい場合のメモ

処理完了順 実行順 処理完了順 function func() { const data = [1, 4, 3, 2,]; for (let i = 0; i < data.length; i += 1) { new Promise(resolve => { setTimeout(() => { resolve(data[i]); }, 1000 * data[i]); }).then(result => console.info(result))…

Tone.js で相対音感を鍛えるイヤートレーニングできるようにしてみるメモ

元ネタ 実装テーマ ソースコード デモサイト 参考 元ネタ これっぽいことを簡単な実装でやってみる 相対音感を鍛える、究極のイヤートレーニング動画【保存版】 実装テーマ jQuery, React, Vue は使わない。単純なコードで。 動作確認は Chrome for Mac のみ…

Javascript で Python の 『[n for n in range(10)]』 みたいなことをやるメモ

python In [1]: [n for n in range(10)] Out[1]: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9] javascript (ES6以降) [...Array(10).keys()] > (10) [0, 1, 2, 3, 4, 5, 6, 7, 8, 9] 参考リンク JavaScript function similar to Python range() - Stack Overflow

Javascript で現在時間の unixtime を取得するメモ

const now = Date.now() console.info(now) //->1534838352015 参考 Date.now() - JavaScript | MDN

Javascriptでファイル名の拡張子だけ取得するメモ

const filename = 'foo/bar.ext.jpg' //方法1 filename.split('.').slice().reverse()[0] //->"jpg" //方法2 filename.split('.').pop(); //->"jpg" 参考 How can I get file extensions with JavaScript? - Stack Overflow

Javascriptでオブジェクトの不特定な階層に値を入れるメモ

前提 コード 前提 空のオブジェクトに object.foo.bar とか object.hoge.fuga.moge とか階層が不特定で値を入れたいみたいな コード const payload = {path: 'come.on.baby.america', value: 'U.S.A'} const segments = payload.path.split('.') let object …

Nuxt.jSでfirebaseui-webを使ってログインするメモ

前提 pages/index.vue components/FirebaseAuth.vue .env 確認 参考 前提 nuxt プロジェクト作成 firebase ログイン・プロジェクト作成 npm -S install firebase firebaseui @nuxtjs/dotenv pages/index.vue <template> <div class="row"> <div class="col s12 m7"> <FirebaseAuth/> </div> </div> </template> <script> import FirebaseAuth from '~/com…

Nuxt.js で materialize 使うためセットアップのメモ

更新2018-07-23 19:20: 挙動がおかしいのでほぼまるまる修正 前提 nuxt.config.js pages/index.vue 確認 参考サイト 前提 nuxt1.4.1 インストール済みで npm run dev できる状態 materializeのCSSとJSが適応されているか確認するためモーダル表示してみる nu…

eslintrc の設定を見直す

$ sudo npm install -g eslint eslint-plugin-react $ eslint --version v5.1.0 .eslintrc { "plugins": ["react"], "extends": [ "eslint:recommended", "plugin:react/recommended" ], "env": { "browser" : true, "node" : true, "mocha": true, "es6" : …

Progressive Web App のメモ

medium.com developers.google.com developers.google.com developers.google.com qiita.com developer.mozilla.org developer.mozilla.org

DjangoのwebサーバからapiサーバーにajaxでPOSTしたら『Credential is not supported if the CORS header ‘Access-Control-Allow-Origin’ is ‘*’』とかなった場合のメモ

(Django1.11.11 + django rest framework3.6.1, jquery-3.2.1) ajaxでPOSTした時のエラー クロスオリジン要求をブロックしました: 同一生成元ポリシーにより、%1$S にあるリモートリソースの読み込みは拒否されます (理由: CORS ヘッダー ‘Access-Control-Al…

Emacs の web-mode で vue 書くのにシンタックスチェックしてほいしい場合のメモ

追記2018-07-19: これイマイチなのでやり直した 続 Emacs の web-mode で vue 書くのにシンタックスチェックしてほいしい場合のメモ - 牌語備忘録 -pygo 下記は使わないけど記録として残しておく 前提 jsのライブラリインストール .eslintrc init.el リンク …

anyenv の ndenv にしたら Emacs の js2-mode で flycheck が動かなくなった場合のメモ

Emacs あるあるの path が通ってないのが原因 eslint のパスを確認 $ which eslint /Users/username/.anyenv/envs/ndenv/shims/eslint emacs lisp init.el でパスを追加 (let ((path (concat (getenv "HOME") "/.anyenv/envs/ndenv/shims"))) (setq exec-pat…

Javascript と Python の真偽値の違いメモ

javascript >> Boolean(0 > 0) false >> Boolean(1 > 0) true >> Boolean(0) false >> Boolean(1) true >> Boolean('0' > 0) false ;; ここ違う >> Boolean('1' > 0) true >> Boolean('0') true >> Boolean('1') true python >>> bool(0 > 0) False >>> bool…

javascript の Map() で const の定数を作る時に初期値を入れるメモ

const HOGE = new Map() .set('popuko', 14) .set('pipimi', 14) console.info(HOGE) // -> Map { 'popuko' => 14, 'pipimi' => 14 } 参考 Map - JavaScript | MDN

ギター指板の音名をランダムに表示するメモ

音名ランダム表示 ソースコード 指板の音名 参考リンク 音名ランダム表示 C $(function(){ var tempo = 70; var delay = 60 / tempo * 1000; function random(arr) { return arr[Math.floor(Math.random() * arr.length)]; } function display_key() { var k…

ギター指板の音名を覚えるためにリロードするとJavascriptでランダムに音名を表示してみるメモ

(追記2017-10-16)いまいち使い勝手が悪いので もっとシンプルなの書いた 音名 テンポ 指板 ソースコード 音名 テンポ 元ネタの動画 参考リンク 音名 var keys = ['C', 'C#/Db', 'D', 'D#/Eb', 'E', 'F', 'F#/Gb', 'G', 'G#/Ab', 'A', 'A#/Bb', 'B']; funct…

Moment.js で今日と1週間後と1週間前の日付を取ってみるメモ

> moment().format('YYYY-MM-DD'); // 今日 "2017-08-23" > moment().add(7, 'days').format('YYYY-MM-DD'); // 7日後 "2017-08-30" > moment().add(-7, 'days').format('YYYY-MM-DD'); // 7日前 "2017-08-16" リンク Moment.js | Docs #add

Eslint で1行のみ error/warning を無視するメモ

よく忘れるのでメモ 1行のみ alert('foo'); // eslint-disable-line no-alert ファイル全体 ちなみにファイル内で無視する場合は最初の行に書く /* eslint-disable no-alert, no-console */ グローバルはこれ /*global hoge*/ 参考リンク Configuring ESLint…