【JavaScript入門】filterで配列のデータを抽出する方法 | 侍エンジニアブログこんにちは、ライターのマサトです！今回は、配列を操作するメソッド「filter」について学習していきます！「 filter」を使いこなせば、配列データの中から条件に一致した要素だけを簡単に抽出できるようになるので、非常に活用範囲が広いメソッドと言えます。 ただし、使い方にちょっとしたコツが必要で、場合によっては想定していない動作をする場合もあるので注意が必要です。そこでこの記事では、
JavaScriptにおけるvar/let/constの使い分け
JavaScriptの3つある変数宣言、varとletとconstは、よく混乱を生みます。どれも変数を宣言することに変わりはないので、違いがわかりにくいのです。このことが初学者を混乱させている場面をたびたび目にしますし、プログラミングに慣れ親しんだ人でも役割を意識しないまま書いていることがあります。 そこでこの記事では、3つの変数宣言の役割とその使い分けについて、それぞれ簡単に紹介してみます。 3種類の変数宣言とその使い分け var – 変数を宣言する varは、JavaScriptにおいて変数を宣言する上で、最も基本的な方法になります。varで宣言された変数は関数スコープとなり、宣言のスコープ先頭への巻き上げ（Hoisting）が行われます。（※変数のスコープおよび巻き上げについてはここでは解説しません。） var x = 10; x = 20; もともと、JavaScriptの変数宣言
Array.prototype.join() - JavaScript | MDN
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. Learn moreSee full compatibilityReport feedback join() は Array インスタンスのメソッドで、配列の全要素を順に連結した新しい文字列を返します。区切り文字はカンマ、または指定された文字列です。配列にアイテムが一つしかない場合は、区切り文字を使用せずにアイテムが返されます。 const elements = ["Fire", "Air", "Water"]; console.log(elements.join()); // Expected output: "Fi
お疲れさまXMLHttpRequest、こんにちはfetch - Qiita
Service Workersでプッシュ通知を受信できるようになったわけですが([1]: GCM)([2]: Web Push)、Chromeではバージョン48まではGCMで通知だけができるようになっただけで、メッセージ本体は通知を受けてからService Workerでサーバから改めて受け取るような実装をする必要があったりします。 ここで、Service Workersでは、XMLHttpRequestが使えません。その代わり、XMLHttpRequest (以下、XHR)に代わるWHATWGの仕様としてFetch APIがあり、Service WorkersではこのFetch APIを使うことになっていますので、その使い方を簡単に紹介します。 Fetch API自体は、Service Workers専用のものではなく、メインスレッドでもXHRの代わりに使うことが可能です。現時点で実装し
無名再帰関数 - JavaScript（ジャバスクリプト）リファレンス
無名関数は、argumentsオブジェクトのcalleeプロパティを使うことで、再帰的に呼び出すことができる。 サンプル <script type="text/javascript"> ( function ( $var ) { if ( $var <= 10 ) { document.write( $var + ", " ); arguments.callee( ++$var ); } } )( 3 ); </script>
アロー関数式 - JavaScript | MDN
This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2016. Learn moreSee full compatibilityReport feedback アロー関数式は、従来の関数式の簡潔な代替構文ですが、意味的な違いや意図的な使用上の制限もあります。 アロー関数自身には this、arguments、super へのバインドがないので、メソッドとして使用することはできません。 アロー関数はコンストラクターとして使用することはできません。 new をつけて呼び出すと TypeError が発生します。 new.target キーワードにアクセスすることもできません。
Node.js を5分で大雑把に理解する - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? 随時更新します。 対象の人 使ったことないけど、軽く理解はしておきたい人 本格的に勉強する前に、大まかな概要を知りたい人 特徴 サーバーサイドのJavaScript 非同期 (I/Oの処理結果を待たず処理を進める) ノンブロッキングI/O (I/Oの結果を待たないで処理をすすめる。I/O処理が終了したらコールバック関数を実行。) イベントドリブン (何かしらのキッカケで動き始める) シングルスレッド (メモリ消費が少ない、仕事切り替えが少ないので速い) JavaScript エンジンが Google の V8 で速い Node.jsで作
JavaScriptによるHTML5プログラミング入門 - libro
※ページが正常に表示されない場合 AddBlockなどの広告ブロックツールがONになっていると、ページの一部が表示されないことがあります。これらのツールをOFFにしてみてください。
Window: load イベント - Web API | MDN
WindowインスタンスプロパティcachesclosedcookieStorecredentialless Experimental crossOriginIsolatedcryptocustomElementsdevicePixelRatiodocumentdocumentPictureInPicture Experimental event 非推奨; external 非推奨; fence Experimental frameElementframesfullScreen 非標準 historyindexedDBinnerHeightinnerWidthisSecureContextlaunchQueue Experimental lengthlocalStoragelocationlocationbarmenubarmozInnerScreenX 非標準 mozInnerScree
height() - jQuery 日本語リファレンス
最初の要素の高さをピクセル単位で取得します。 jQuery1.2からは、このメソッドでwindowやdocumentの高さも取得できるようになりました。 ボタンをクリックすると、高さを表示します。 サンプルプログラムはiframe内で動いているので、windowの高さは黄色い部分の値になります。予期したよりも小さい値が表示されているかもしれません。その場合は、単独で開いて確認してみて下さい。 <button id="getp">Get Paragraph Height</button> <button id="getd">Get Document Height</button> <button id="getw">Get Window Height</button> <div> </div> <p> Sample paragraph to test height </p> function
Js/Cssファイルの読み込みや出力する方法
CakePHPのHTMLヘルパーにはjsファイルやcssファイルを読み込むためのメソッドが用意されています。ファイルを読み込むのに加えて、出力先を複数指定できるようになっています。 また、インラインに出力する関数も用意されており、動的に出力する際にも便利なようにつくられているようです。 javascriptファイルの読み込み javascriptファイルの読み込みを行うには以下のようにHtmlヘルパーのscriptにパスを指定します。 echo $this->Html->script( 'jsファイル(パス)'); // パスに//が含まれている場合は、CDNから取得される。 echo $this->Html->script( '//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js'); // App.jsBaseUrl(J
制御フローとエラー処理 - JavaScript | MDN
JavaScriptチュートリアルBeginner's tutorialsYour first website: Adding interactivityDynamic scripting with JavaScriptJavaScript frameworks and librariesJavaScript ガイド入門編文法とデータ型制御フローとエラー処理ループとイテレーター関数式と演算子Numbers and stringsRepresenting dates & times正規表現インデックス付きコレクションキー付きコレクションオブジェクトを利用するクラスの使用プロミスの使用JavaScript 型付き配列イテレーターとジェネレーターInternationalizationJavaScript モジュール中級編Advanced JavaScript objectsAsynchrono
JavaScriptにもクラスがやってきた！JavaScriptの新しいclass構文をマスターしよう
JavaScriptにもクラスがやってきた！JavaScriptの新しいclass構文をマスターしよう 高津戸壮（株式会社ピクセルグリッド） ECMAScript 2015（ECMAScript 6）で新たに追加された待望のclass構文について、その概要をサンプルコードを交えて紹介します。 これまでのJavaScriptにおけるクラス 多くのプログラミング言語はクラスを作れる機能を持っていますが、JavaScriptにその機能は用意されていませんでした。しかし、JavaScriptにはprototypeという柔軟な仕組みが存在しており、このprototypeを利用することで、他の言語で表現されている「クラス」と似たような振る舞いを再現することが可能でした。 それは例えば、こんなふうにです。 /* Cat雛形の作成 */ function Cat(name) { this.setName(
変数を宣言する
変数の宣言方法 以前は変数の宣言を行うときに var を使用していましたが、 ECMAScript 2015 (ES6) 以降では var に加えて let と const を使用することができるようになりました。よって変数の宣言は次のいずれかを使用します。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
【JavaScript】プロパティへのアクセス - Qiita
【jQuery】処理実行タイミング $(document).readyと$(window).load - Qiita
jQueryでスクロール位置を取得・設定する：scrollTop() | UX MILK
【JavaScript】関数定義いろいろ - Qiita
Loading...
JavaScript/ウィンドウ/ウィンドウを閉じるボタン - TAG index
