Console Utilities API リファレンス | Chrome DevTools | Chrome for Developers
Console Utilities API には、DOM 要素の選択と検査、オブジェクトのクエリ、読み取り可能な形式でのデータの表示、プロファイラの停止と開始、DOM イベントと関数呼び出しのモニタリングなど、一般的なタスクを実行するための便利な関数のコレクションが含まれています。 console.log()、console.error()、その他の console.* 関数をお探しですか？Console API リファレンスをご覧ください。 $_ $_ は、最後に評価された式の値を返します。 次の例では、単純な式（2 + 2）が評価されます。次に、同じ値を含む $_ プロパティが評価されます。 次の例では、評価された式には最初に名前の配列が含まれています。$_.length を評価して配列の長さを取得すると、$_ に格納されている値が、最後に評価された式 4 に変わります。 0 ～ 4
Movable Type 7のコンテンツタイプとData API 4.0でスマートフォンアプリを試作
プラグインで「Google マップフィールド」...地図が表示され、それを操作することにより緯度・経度が保存できるフィールドがあれば...などと考えました。（Google マップの利用規約上の問題はないか確認が必要ですね） また、今回のアプリでは使用しませんが観光スポットをピックアップして紹介するコンテンツタイプ「モデルコース」も定義しておきます。 コース名 フィールドの種類 必須 コースに含む観光スポット コンテンツタイプを定義し終えたら、データをいくつか入力していきます。 コンテンツデータの一覧を取り出してみる コンテンツタイプに保存されたコンテンツデータの一覧は以下のエンドポイントで取得できます。 /sites/:site_id/contentTypes/:content_type_id/data React Nativeからはfetchでエンドポイントにアクセスし、処理を行います。
ECMAScript regular expressions are getting better! · Mathias Bynens
Support for regular expressions was added to ECMAScript 3 in 1999. Sixteen years later, ES6/ES2015 introduced Unicode mode (the u flag), sticky mode (the y flag), and the RegExp.prototype.flags getter. This article highlights what’s happening in the world of JavaScript regular expressions right now. Spoiler: it’s quite a lot — there are more RegExp-related proposals currently advancing through the
CSS Paint API | Blog | Chrome for Developers
New possibilities in Chrome 65 CSS Paint API (also known as “CSS Custom Paint” or “Houdini’s paint worklet”) is enabled by default starting in Chrome 65. What is it? What can you do with it? And how does it work? Well, read on, will ya’… CSS Paint API allows you to programmatically generate an image whenever a CSS property expects an image. Properties like background-image or border-image are usua
イマドキのJavaScriptの書き方2018
PySpa統合思念体です。これからJavaScriptを覚えるなら、「この書き方はもう覚えなくていい」（よりよい代替がある）というものを集めてみました。 ES6以降の難しさは、旧来の書き方にプラスが増えただけではなく、大量の「旧来の書き方は間違いを誘発しやすいから非推奨」というものを作り出した点にあります。5年前、10年前の本やウェブがあまり役に立たちません。なお、書き方が複数あるものは、好き嫌いは当然あると思いますが、あえて過激に1つに絞っているところもあります。なお、これはこれから新規に学ぶ人が、過去のドキュメントやコードを見た時に古い情報を選別するためのまとめです。残念ながら、今時の書き方のみで構成された書籍などが存在しないからです。 たぶん明示的に書いていても読み飛ばす人はいると思いますが、すでに書いている人向けではありません。これから書くコードをこのスタイルにしていくのは別にいい
JavaScript による一番簡単なスタックとキューの実装方法
JavaScript の Array オブジェクトには配列の先頭要素の取り出し (shift)、最後尾要素への追加 (push)、 最後尾要素の取り出し (pop) 等の操作が実装されています。 Array の持つメソッドだけを使って、スタック及びキューを実装してみましょう。 スタックの実装 スタックは LIFO (Last In First Out) のデータ構造です。つまり、１，２，３ の順番で、 スタックにデータをプッシュすると、取り出すデータは３，２，１ の順番で出てきます。 慣例的に、スタックにデータを入れる操作を push, データを取り出す操作を pop といいます。 JavaScript の Array オブジェクトには既に push, pop が実装されていますから、それをそのまま使いましょう。 クラスの定義方法に不慣れな人は、当サイトの JavaScript によるオブ
Dynamic import() · V8
Dynamic import() introduces a new function-like form of import that unlocks new capabilities compared to static import. This article compares the two and gives an overview of what’s new. Static import (recap) #Chrome 61 shipped with support for the ES2015 import statement within modules. Consider the following module, located at ./utils.mjs: // Default export export default () => { console.log('Hi
画像の遅延読み込みを実装できる軽量のJavaScriptプラグイン「justlazy.js」 – bl6.jp
justlazy.jsは画像の遅延読み込みを実装することができるJavaScriptプラグインです。ファイル容量も軽量で、jQueryに依存することなく使用可能なところがうれしいですね。Webページの読み込み速度を少しでも短縮させたい人にはとても便利な機能といえます。 justlazy.jsの実際のデモや具体的な実装方法は以下のページから確認できます。 デモ デモでは画像以外のコンテンツが先に読み込まれた状態になっていて、画像が表示される場所にはローディングアイコンが表示されています。画像が読み込まれるとローディングアイコンがある位置に画像が表示されます。 先にテキストなどのコンテンツが読み込まれるので、重い画像を読み込んでいる間でもユーザーを無駄に長い時間待たせなくて済むのがいいですね。 画像が読み込まれるまでテキストなどを読み進めることができるので、とても効率的です。 使い方も簡単で、
ES2015+ cheatsheet
A quick overview of new JavaScript features in ES2015, ES2016, ES2017, ES2018 and beyond. Let function fn () { let x = 0 if (true) { let x = 1 // only inside this `if` } } Const const a = 1 let is the new var. Constants work just like let, but can’t be reassigned. See: Let and const
Using ES2017 Async Functions | CSS-Tricks
UGURUS offers elite coaching and mentorship for agency owners looking to grow. Start with the free Agency Accelerator today. ES2017 was finalized in June, and with it came wide support for my new favorite JavaScript feature: async functions! If you’ve ever struggled with reasoning about asynchronous JavaScript, this is for you. If you haven’t, then, well, you’re probably a super-genius. Async func
(Now More Than Ever) You Might Not Need jQuery | CSS-Tricks
They are also currently being implemented in Edge. Fade in an Element jQuery: $elem.fadeIn(); By writing our own CSS we have far more control over how we animate our element. Here I’ll do a simple fade. .thingy { display: none; opacity: 0; transition: .8s; } elem.style.display = "block"; requestAnimationFrame(() => elem.style.opacity = 1); Call an event handler callback only once jQuery: $elem.one
あなたが知らないJavaScriptの便利すぎるショートハンド19選
日頃書いているJavaScriptをもっと短く書く方法を知っていますか？ 目からうろこ、すぐに使えるJavaScriptのショードハンドを紹介します。 JavaScriptを使うすべての開発者に向けて、私が長年かけて身につけたJavaScriptのショートハンド（短縮記法）を資料にしました。コードの違いが分かるように通常の記述方法も併記しました。 1．三項演算子 if-else文を1行に収めた短縮記法です。 通常const x = 20; let answer; if (x > 10) { answer = 'is greater'; } else { answer = 'is lesser'; } ショートハンドconst answer = x > 10 ? 'is greater' : 'is lesser'; 従来のif文を1行に収めることも可能です。 const big = x >
こんなにあった！UIデザイナー向けアニメーションライブラリー最新ベスト9
Webサイトをおしゃれに、かっこよく演出するアニメーション系JavaScriptライブラリー。デザイナーにも使いやすいライブラリーをまとめました。デモを見るだけでもアイデアがひらめくかも？ Webデザインはこの10年間で大きく変わりました。2007年頃は雑誌のように静的なレイアウトが主流でしたが、2017年には数千のパーツが連動して伸縮しながら移動するデザインも可能になりました。 これから、優れたUIデザイナーになるにはWebアニメーション技術に関する知識も必要です。 この記事ではUIデザイン向けの良質なアニメーションライブラリーを9つ紹介します。現時点での最新の情報と、各ライブラリーの強みや弱み、向き不向きをまとめたので、タスクに適したライブラリーを選んでください。 「コーディングプロ級」の開発者ではなくコーディングもこなせるUIデザイナーの視点で各ライブラリーを評価しました。CSSだけ
CSS Animations vs Web Animations API | CSS-Tricks
Get affordable and hassle-free WordPress hosting plans with Cloudways — start your free trial today. There is a native API for animation in JavaScript known as the Web Animations API. We’ll call it WAAPI in this post. MDN has good documentation on it, and Dan Wilson has a great article series. In this article, we’ll compare WAAPI and animations done in CSS. A note on browser support WAAPI has a co
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
How to removeEventListener that is addEventListener with anonymous function?
GitHub - iamkun/dayjs: ⏰ Day.js 2kB immutable date-time library alternative to Moment.js with the same modern API
ScrollBooster
WKWebView. Return a value from native code to JavaScript – igoMobile
The Modern JavaScript Tutorial
The Definitive TypeScript Guide - Blog | SitePen
