JSDocで型を定義してTypeScriptの恩恵を受ける
普段から TypeScript で開発されているほうならば、TypeScript の恩恵を十分に堪能されていることと思います。 特に私は VS Code のインテリセンスには頼りっぱなしでこれがなければまともにコーディングができない体になってしまいました。 しかし時には、TypeScript という概念が存在しない退屈な世界で開発を行わなけらばならない状況はあるでしょう。私はもはやキーボードでタイピングすることすらままなりません。 そんな JavaScript しか利用できない状況で代替手段となるのが、JSDoc です。JSDoc のアノテーションによって型を付与することによって最低限の支援を受けることができます。 @Type @Type タグを使用すると、TypeScript で型をつけるときと同じように型を宣言できます。
ラベル付き文でif文をbreakする - console.lealog();
っていう使い方もあるのか〜と久々に学びがあったのでメモ。 ラベル付き文 こんな風に、`for`とかループに好きな名前をつけられる。 outer: for (const item of items) { inner: for (const child of item.children) { // ... if (cond) continue outer; // ... } } 「内側のループにいる時に、外側もろとも`break`したり`continue`したりしたい」場合に便利なやつ。 で、このラベルはループにだけつけられると勝手に思い込んでたけど、実は・・！ if文にもラベル よくよく考えると、ラベル付き"文"なので、それが文であればラベルを付けられる！そして`if`もれっきとした"文"だった。 というわけで、こんな風に使える。 outer: if (cond1) { // ... if
プロミスの使用 - JavaScript | MDN
JavaScript チュートリアル 初級編 JavaScript の基礎 JavaScript の第一歩 JavaScript の構成要素 JavaScript オブジェクト入門 JavaScript ガイド 入門編 文法とデータ型 制御フローとエラー処理 ループとイテレーター 関数 式と演算子 数と日付 テキスト処理 正規表現 インデックス付きコレクション キー付きコレクション オブジェクトを利用する Using classes プロミスの使用 JavaScript 型付き配列 イテレーターとジェネレーター メタプログラミング JavaScript モジュール 中級編 クライアントサイド JavaScript フレームワーク クライアントサイド Web API Language overview JavaScript のデータ構造 等値比較と同一性 プロパティの列挙可能性と所有権 クロ
Promise, async/await
私たちはこのオープンソースプロジェクトを世界中の人々に提供したいと考えています。このチュートリアルの内容をあなたが知っている言語に翻訳するのを手伝ってください。
Next.js を Firebase hosting で動かしてSSRする - Qiita
いわゆるサーバーレス。 TL;DR すべてのリクエストを Firebase Functions に流して next.js に食わせた結果を返すとSSRになる。最高。 概要 Firebase Hosting は index.html を上げたら動いてくれる静的サイトホスティングだと思っていたが、 全てのルーティングを Firebase functions に全て受けさせる。こともできた GCP知らない人向けに 一応解説しておくと Firebase Function = Google Cloud Function ≒ AWS Lambda そんでもって、React で SSR したいとき、スクラッチでもいいけど、一番簡単なのは next.js。next.js 公式にも exmaples があり、読んでみたら勉強になったので解説してみる。 Firebase Hosting の設定 { "func
How to use Media Queries in JavaScript with matchMedia — SitePoint
July 31, 2018How to use Media Queries in JavaScript with matchMedia When it was first introduced, responsive design was one of the most exciting web layout concepts since CSS replaced tables. The underlying technology uses media queries to determine the viewing device type, width, height, orientation, resolution, aspect ratio, and color depth to serve different stylesheets. If you thought responsi
Proximity APIでWi-Fi Direct通信 - デバイスとITの架け橋 - Site Home - MSDN Blogs
In Visual Studio 2022 17.10 Preview 2, we’ve introduced some UX updates and usability improvements to the Connection Manager. With these updates we provide a more seamless experience when connecting to remote systems and/or debugging failed connections. Please install the latest Preview to try it out. Read on to learn what the Connection ...
JavaScript イディオム集
JavaScriptでは、初見の人にはさっぱりわからないけれども、ある程度慣れた人は当たり前に使うイディオムが結構たくさんあります。知ってしまえば何てことはないので、私の知っている限りのイディオムとその意味を解説します。 （7/3追記: twitter等で教えていただいた内容を追加しました） +v （数値化） var v = "123"; console.log(+v + 100) // 223 console.log(v + 100) // 123100 vを数値化する方法では最もメジャーです。parseFloat(v) に比べて高速なのに加えて、parseFloatとは細かい挙動が異なります（例えば空文字列の場合、parseFloatならば NaN になりますが、 +v の場合はゼロになります）。必ず数値になることが保証されており、文字列などで数値化出来ない場合はNaNが返ります。 v
[jquery] クリックイベントをセットする際に、後から追加した関数を先に実行させたい の続き : nogunogu
こんにちは。のぐちです。 今週はMavenさんと仲良くしようと努力したのですが、今ひとつ仲良くなりきれず、思ったようなことができませんでした。僕にはMavenさんは難しかったみたいです。 そんなクサクサした気持ちを晴らすべくブログを書きました。よろしければお付き合いください。 さて、前回、後からバインドする関数を、やや強引な感じで最初にバインドされたようにして、実行順序を変えられるか試みました。 その結果、jQuery1.4.3だとFirefoxでもChromeでも意図通りに実行順序を変えられたのですが、jQuery1.3.2ではChromeの方だけ実行順序が変わりません。 ということで、jQueryがバインドされた関数をどのように実行しているかを追ってみます。 バインドされた関数の実行は jQuery.event.handle という関数で行なわれています。 下記がその実行をしている部
The JavaScript console API
In most JavaScript engines, there is a global object console with methods for logging and debugging. That object is not part of the language proper, but has become a de facto standard, since being pioneered by the Firebug debugger. Since their main purpose is debugging, the console methods will most frequently be used during development and rarely in deployed code. This blog post gives an overview
Google Analytics and Responsive Web Design - Introducing Responsive Tracking
Google Analytics and Responsive Web Design - Introducing Responsive Tracking Geschrieben von Henry Zeitler veröffentlich am 07. Feb 2013 in der Kategorie Design, UX Nowadays, responsive web design has become a common approach for building mobile-optimized Websites. As you might know, the technique behind this changes the layout of a page to enhance the user experience depending on the viewport usi
ポップアップブロック回避策
ASP.NETに限らずWebシステムではJavascriptのwindow.open()を使いサブウィンドウを開く場面がよくある。 これがWindowsXP ServicePack2から導入され、Googleツールバーにもあるポップアップブロックによって、効かなくなることがある。それぞれ設定を解除させれば良いが、今回紹介するのは設定解除することなく、回避する方法である。 調べてみると意外に簡単に方法が見つかった。 そもそもポップアップブロックはユーザーが自らの意思でボタンを押したものには働かない。自動で(勝手に)開くウィンドウを阻止するものである。よってサーバーサイドで実行したものは必ずブロックされてしまう。 そこでクライアントサイドのOnClickイベント内で開くように変更すれば良いのである。 例：onclick="window.open('hoge.aspx');return fals
最強オブジェクト指向言語 JavaScript 再入門！
この資料では、JavaScript でオブジェクト指向プログラミングを行う際に備えておくことが望ましい、基礎知識や概念について解説します。 【対象者】 ・JavaScript でアプリケーションを構築できる方 ・JavaScript におけるオブジェクト指向プログラミングの 実現手法や原理への理解を深めたい方 ・Java 的なクラスベースの言語との違いに違和感や混乱を 感じてらっしゃる方Read less
【javascriptを使う人に知って貰いたい（エンジニア、デザイナ問わず）】karmaを使ったテスト駆動開発入門（ついでにJasmineも） - Qiita
$ karma init Which testing framework do you want to use ? Press tab to list possible options. Enter to move to the next question. > jasmine Do you want to use Require.js ? This will add Require.js adapter into files. Press tab to list possible options. Enter to move to the next question. > no Do you want to capture a browser automatically ? Press tab to list possible options. Enter empty string to
JavaScript書くのに入れとくといいもの
Chrome CanaryDevToolsも進化してるのでStableではなくCanaryを Local ProxyPCのみならDevToolsだけでもいいけど、スマホのWebView内解析とか考えるとLocal Proxyは必須 Windowsなら Fiddler （無料） Macなら Charles （有料） Macでお金払うのが嫌な場合 CocProxy for nginx （無料。CUI。Ruby版使うくらいならこちらを） JS製が良くてソース読みたいなら Klepto （無料。GUI。不安定） ソースの文字コード変更ChromeでJS、CSS開くと日本語が化けるので、初期文字コードをUTF-8に変更 （フォント設定（ chrome://settings/fonts ）の一番下を「Unicode (UTF-8)」に） “This Frame” Context Menuiframeの
いままでいくらAmazonで買い物したか合計するブックマークレット書いた - モロ屋
2015/03/02: 現在動作しなくなっているようなので、こちら等を参照してください。 Amazonで使ってきた金額合計してみろ おにゃんこ速報 5：以下、名無しにかわりましてVIPがお送りします：2012/06/16(土) 13:28:46.48 ID:8IYD9aJN0 どうやって合計するの 6：以下、名無しにかわりましてVIPがお送りします：2012/06/16(土) 13:29:58.55 ID:5x4DpozW0 >>5 ちまちま足す というわけで 自分もどれくらいAmazonで使ってるか知りたかったので、集計するコード書きました。 まずこのページに行ってから、 https://www.amazon.co.jp/gp/css/order-history/ 下をコピペしてアドレスバーに貼り付け。 javascript:(function(){var d=document;var
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
XState - JavaScript State Machines and Statecharts
ES5とES6の違いをまとめてみた(メモ) - Qiita
Javascript CDATA section
:: Manwe Security Consulting