タグ

JavaScriptに関するsisidovskiのブックマーク (206)

  • クロージャと高階関数

    Javascriptには関数式と呼ばれるものがあります。関数式は数値や文字列のようにプログラムにリテラルとして書かれた関数です。

  • webRequest APIをざっくり理解する。(あるいはChrome拡張の作り方) – mzsm.me

    昨日2月9日、Google Chrome 17の安定版がリリースされました。 このバージョンでの変更点の一つに、webRequest APIが正式に実装されたことがあります。 これまでこのAPIはexperimental(実験的機能)として実装されていましたが、今回晴れて正式なものになりました。 このAPIを使うと、Chromeが行う通信を監視して通信があるたびにイベントを実行したり、HTTPヘッダを書き換えたりすることができます。 Chrome 17では、User-Agentを他のブラウザに偽装することができる機能がDeveloper Toolsに付いたのですが、その機能もこのAPIを利用して実装されてい(ると思われ)ます。(Developer Tools自体もJavaScriptによって実装された“Webアプリ”なので、多分そのはずです) HTTPヘッダをいじれるというと不安に思われる

  • JavaScriptテストの基礎知識と使えるフレームワーク6選

    JavaScriptテストの基礎知識と使えるフレームワーク6選:フレームワークで実践! JavaScriptテスト入門(1)(1/3 ページ) しっかりとJavaScriptの“テスト”を行うために、最近のJavaScript事情やテストを取り巻く環境、今注目のテストフレームワークを6つ紹介する JavaScriptでもテストを書こう @ITの読者の方たちのほとんどは、どのような言語を主に利用しているのかなどの違いはあるにせよ、日常的にプログラムを書いている方たちが多いかと思います。 アプリケーションを作る、ライブラリを作成する、オープンソースプロジェクトに貢献するなど、皆さんがプログラムを書く場面はそれぞれいくつかあるはずです。それらプログラムを書く場面に共通して大切な習慣の1つとして、「作成するプログラムに対しては必ずテストコードを書く」ことがあるのは、誰にでも同意してもらえることでし

    JavaScriptテストの基礎知識と使えるフレームワーク6選
  • データ構造 - 汎用日記(仮)

    いくつかあるので調べときなーと言われたので。簡単にしらべてみたぬん Hash ハッシュ 連想配列のイメージ。キーとバリューをセットで格納し、キーをもとにバリューを取り出す。 Set セット データの重複がないことが約束されたデータの集合。要素の順序について決まりがない場合に使う。 List リスト リスト内の各要素をポインタによって連結したもの。要素にアクセスする差異、最初からその要素まで順に見ていくため、途中の要素を取り出したい時には不向き。要素は必要なときに作られるため、余分なメモリの確保がない。 参考サイト:ƒAƒ‹ƒSƒŠƒYƒ€‚ƃf�[ƒ^�\‘¢•Ò�@‘æ‚P‚O�Í�@�üŒ`ƒŠƒXƒg Queue キュー 待ち行列 FIFOを採用したデータ構造。データを入れた順に取り出す。 FIFO「最初に入ったものが最初に出てくる」データの入出力方式を First In Firs

    データ構造 - 汎用日記(仮)
  • https://madebyknight.com/javascript-scope/

  • JavaScript練習課題01〜05 - はれ あめ はれ

    JavaScript練習課題(1) 載せていなかった授業内で進めたスクリプト 【J01】 クリックでアラートを表示するJavaScriptを記述しなさい。 (写真は自由。)「function」は使用しない通常のアラート。 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>js01</title> <style type="text/css"> p img { cursor: pointer; } </style> </head> <body> <p><img src="images/hana.jpg" width="500" height="333" onClick="alert('花の写真です')"></p> </body> </html> 【J02】 マウスオーバーでアラートを表示するJavaScriptを記述しなさ

    JavaScript練習課題01〜05 - はれ あめ はれ
  • JavaScriptの再利用とapply

    私がこういうの大嫌いなのは一部では有名な話ですが、職場では寛容に、ネット上では偏屈に、がポリシーなので素直に流しました。

    JavaScriptの再利用とapply
  • JavaScript, apply/call メソッドと prototype 継承 : Serendip – Webデザイン・プログラミング

    こちらのサイト『JavaScriptで継承やるときにprototype書きまくるのめんどい人は – あ、いしかわですね』で Function.apply を使って継承を記述する方法が紹介されていた。 apply と call の使い方を今一度復習しておく。 Function.apply function.apply(obj, args) function を obj のメソッドとして呼び出す。 引数として配列 args を渡すことができる。 function のボディ内では obj に this でアクセスできる。 /* オブジェクトにメソッドを適用させる */ console.log(Array.prototype.reverse.apply([1, 2, 3])); /* [ 3, 2, 1 ] */ console.log(String.prototype.split.apply('

  • CSSやJavaScriptファイルを連結、圧縮·Minify MOONGIFT

    jQueryやPrototypejs、YUIなど様々なJavaScrptライブラリが登場している。また、CSSもフレームワークが出てきており、便利な反面、表示されるまでのコネクション数やダウンロードサイズが肥大化している。 CSSJavaScriptを連結&圧縮 それを解決する手段として、サイズの縮小や複数のファイルをまとめてしまうという方法がある。それを自動化してくれるのがMinifyだ。 今回紹介するオープンソース・ソフトウェアはMinify、JavaScript/CSSの連結、圧縮ソフトウェアだ。 MinifyはPHPで作られており、Webベースで動作する。Minifyにファイルのパスを渡すことで余計な改行や空白を圧縮してサイズを小さくしてくれる。そして複数のファイルを渡すことで連結してくれる機能もある。 生成されたファイル 作成するのは同一ドメイン内のファイルに限られる。また、グ

    CSSやJavaScriptファイルを連結、圧縮·Minify MOONGIFT
  • JavaScript 言語概要 - JavaScript | MDN

    JavaScript チュートリアル 初級編 JavaScript の基礎 JavaScript の第一歩 JavaScript の構成要素 JavaScript オブジェクト入門 JavaScript ガイド 入門編 文法とデータ型 制御フローとエラー処理 ループとイテレーター 関数 式と演算子 数と日付 テキスト処理 正規表現 インデックス付きコレクション キー付きコレクション オブジェクトを利用する Using classes プロミスの使用 JavaScript 型付き配列 イテレーターとジェネレーター メタプログラミング JavaScript モジュール 中級編 クライアントサイド JavaScript フレームワーク クライアントサイド Web API Language overview JavaScript のデータ構造 等値比較と同一性 プロパティの列挙可能性と所有権 クロ

    JavaScript 言語概要 - JavaScript | MDN
  • マンガで分かる JavaScriptプログラミング講座

    はじめに 「マンガでわかるJavaScript」は、難しそうに思えるプログラムを、簡単そうに見えるマンガで解説するという初心者向けの入門講座です。 架空の高校生たちに教える形式で、プログラムの基礎から応用を、解説していきます。一通りのマンガを読めば、かなり実践的なところまで、プログラムを書けるようにしていきます。 (マンガは、左上から右下へと読みます) プログラムというと、けっこう大変そうに思えますが、この講座のテーマは「面倒くさいことを楽にする」です。面倒臭がりで、手抜き大好きの女子高生を主人公にして、楽しくプログラムを学んでいくことにします。 主な対象読者は「これからプログラムを学んでみたい人」「Webの世界に関わっていてJavaScriptを学んでみたい人」「昔JavaScriptを触っていたけど最新のトレンドが分からないので改めて学んでみたい人」などです。初心者だけでなく、Webデ

    マンガで分かる JavaScriptプログラミング講座
  • プロトタイプ(prototype)によるJavaScriptのオブジェクト指向

    はじめに JavaScriptはオブジェクト指向言語です。しかし、そのオブジェクトの性質は、他に良く知られているオブジェクト指向言語のJavaC++と大きく異なっています。 そこでこの記事では、なぜそのような違いがあるのか、JavaScriptにおけるオブジェクト指向の言語思想を見ていくと共に、その違いの根幹であるプロトタイプについて解説していきたいと思います。 なお、この記事はJavaScriptの解説ですが、その内容は、標準仕様のECMAScriptで扱われる範囲に基づいています。従って、同じくECMAScriptを元にしている言語(JScript、ActionScript)でも通じる内容になっています。 対象読者 プログラミングの基的な知識、ならびにオブジェクトやメソッドと言った基礎的な概念については、ここでは解説しません。最低限、オブジェクト指向プログラミングについて理解をして

    プロトタイプ(prototype)によるJavaScriptのオブジェクト指向
  • flash.external.ExternalInterface (Flex 3)

    ExternalInterface クラスは外部 API であり、ActionScript と Flash Player のコンテナとの間で直接通信できるようにするアプリケーションプログラミングインターフェイスです。コンテナの例としては、JavaScript が含まれる HTML ページがあります。JavaScript と ActionScript 間のすべての通信に、ExternalInterface を使用することを推奨します。 HTML ページで JavaScript を使用することにより、Flash Player から ActionScript 関数を呼び出すことができます。ActionScript 関数は値を返すことができ、JavaScript は、呼び出しの戻り値として即座にこの値を受け取ります。 この機能は、fscommand() メソッドに代わるものです。 External

  • JavaScriptのthisキーワードをちゃんと理解する - builder by ZDNet Japan

    前回までのおさらいと今回のあらすじ 前回までの記事で、JavaScriptでオブジェクト指向を行うにあたって必要な知識を一通り網羅しました。その中で、オブジェクトに属する関数=メソッドについても触れました。 今回は、オブジェクトやメソッドと深い関わりのあるキーワード、「this」について解説したいと思います。 thisキーワードについてきっちり理解する 「thisキーワードについてお話しする」と言いましたが、実はthisキーワードは連載中で既に触れています。連載第9回で、このように述べています。 「(thisキーワードは)実行中のコードが「自分自身」を表すオブジェクトにアクセスするためのキーワードです。」 「実行中のコード」とされているのは、関数(メソッド)などの実行可能なコードということです。つまり、thisキーワードはメソッドをメンバに含むオブジェクトを指す、と言って良いでしょう。 例

    JavaScriptのthisキーワードをちゃんと理解する - builder by ZDNet Japan
  • JavaScript基本概念最速マスター - TechTalkManiacs

    プログラミング言語の文法をまとめた最速基礎文法マスターが流行っていますが、それだけだと物足りないので少し視点を変えてJavaScriptという言語の基礎となっている概念について簡単にまとめてみようと思います。(基礎文法についてはこちらを参照してください) (20010/2/4 記述ミス Typoなどを修正しました) JavaScriptの基概念 JavaScriptの基となる概念は次の二つです。 連鎖指向 全てがオブジェクト 連鎖指向はプロトタイプチェーンやクロージャ、全てがオブジェクトであるという性質は連想配列やプリミティブ型などの性質に関わってきます。 連鎖指向 JavaScriptでは変数、オブジェクト、メソッドなどのリソースの利用において鎖のようにリソースを定義や宣言できるポイントが連なり、一番近くの宣言や定義に基づいてリソースの内容が決定される、という仕組みが採用されています

    JavaScript基本概念最速マスター - TechTalkManiacs
  • Felix's Node.js Style Guide(和訳)

    node.jsアプリケーションのスタイルを支配する公的な文章はありません。このガイドはあなたが美しく、一貫したソフトウェアを作れるようになる教訓を与えようとする私の独断の試みです。 このガイドはあなたがnode.jsのみを対象にしていると仮定しています。もしあなたのコードをブラウザなど他の環境でも動かす必要があるのなら、いくつかのガイドは無視してください。 様々なパッケージだけではなくnode.jsもまた、それぞれ自体のスタイルを持っています。なので何かのパッケージの開発に貢献することに興味があるのならば、それぞれのルールに従ってコーディングを楽しんでください。 Tab vs Spaces まずはこの宗教的な問題の話をしましょう。私達の慈悲深い独裁者様はnodeのコアに2スペースのインデントを選択なさったので、彼の秩序に従うのが賢明でしょう。 セミコロン あなたからセミコロンを奪おうとする

  • Node.js チュートリアル | Node ビギナーズブック

    書について 書は、Node.jsでのアプリケーション開発を始めようとする皆さんに、 ”高度な”JavaScriptについて知るべきあらゆることを解説します。 よくある”Hello World”チュートリアルの、はるか上をいくものです。 ステータス 貴方が読んでいるのは、書のいわゆる最終版となります。 つまり書は、間違いが見つかった場合や、 Node.jsの新バージョンにおえる変更点を反映する時のみ、改訂されます。 最終更新日は2012年2月12日です。 書内のコードのサンプルは、Node.jsのバージョン0.6.10でテストしています。 ターゲット読者 書は、RubyPythonPHPJavaのような、少なくともひとつのオブジェクト指向言語を理解しており、 JavaScriptについてはあまり経験がなく、Node.jsについては全く経験がないという、 著者と同じようなバッ

  • canvas要素 + Javascriptで作る、動的コンテンツ

    HTML 5 + Javascriptで作る動的なコンテンツ 前回の授業では、HTML 5について、その成り立ちや特徴を解説した上で、新しい構造化のための要素について解説しました。また、あわせてCSS3によって格段に進歩した表現力について実際にサンプルページを作りながら解説しました。 今までは、Webページで動的に図や画像やアニメーションを描画するにはFlashが代表的な選択肢でした。しかし、ここ数年でその状況が大きく動きつつあります。Flashに代表されるような動的なコンテンツが、専用のプラグイン無しに、HTMLの要素とそれと連携するスクリプトだけで実現できるようになりつつあるのです。こうした技術は、今後のWebの動向を大きく変える可能性を秘めた技術として脚光を浴びています。 HTML 5で動的に画像やアニメーションを生成するためには、canvas要素という新規に導入された要素と、can

    canvas要素 + Javascriptで作る、動的コンテンツ
  • JavaScript基礎文法最速マスター - gifnksmの雑多なメモ

    続々と増え続ける基礎文法最速マスターシリーズ(あまりにも増えてきたので他の言語記事へのリンクは別の記事に移しました)。 JavaScript 版は誰も書いていなかったようなので書いてみます。こういう解説記事的なものを書くのは初めてなので変なところがあったら指摘して頂けるとありがたいです。 JavaScriptの基礎概念についての解説はこちら:JavaScript概念最速マスター - TechTalkManiacs 1/31 23:58追記 コメント欄のos0xさんのご指摘を基に一部追記・修正を行いました。 2/2 2:52追記 switch文・正規表現・例外処理について追加しました。 2/2 6:44追記 コメントでfavrilさんにご指摘頂いた点(typo & コメント・サンプル追加)を修正・加筆しました。 2/2 7:15追記 トラックバックでLiosKさんにご指摘頂いた点(cal

    JavaScript基礎文法最速マスター - gifnksmの雑多なメモ
  • サービス終了のお知らせ - NAVER まとめ

    サービス終了のお知らせ NAVERまとめは2020年9月30日をもちましてサービス終了いたしました。 約11年間、NAVERまとめをご利用・ご愛顧いただき誠にありがとうございました。

    サービス終了のお知らせ - NAVER まとめ