「適応障害になってしまって退職をしたい…。でもこれってただの逃げなのかな」 適応障害は人によって症状が違うため、なかなか周りに理解がされにくく、苦しいですよね。 「このまま仕事を続けられそうに…
watermark.jsはHTML5/Canvasを使って画像に動的に透かしを入れるソフトウェア。 watermark.jsはJavaScript製のオープンソース・ソフトウェア。ECサイトやメディアサイトでは画像に透かしを入れて表示している場合がある。社名や自社のロゴを載せることで、転載を防止または抑制する仕組みだ。 画像の左上のマークが透かし 大手のサイトであれば画像を自動的に変換するシステムを導入しているかもしれない。だがwatermark.jsであれば個人や小規模なサイトでも簡単な透かしシステムを導入できるようになる。 watermark.jsはJavaScriptとHTML5のCanvasタグを使って画像を動的に変換する。別途画像を指定することで、その画像を表示したい画像に上書きする形で表示する。透明度、表示位置、クラス名を指定することで細かく表示を制御できるようになっている。
jQueryヘビーなアプリケーションの問題点と、MVCによる構造化の必要性 jQueryは、ブラウザ上で動くJSアプリケーションの開発生産性を劇的に向上させました。DOM操作による動的なページ書き換え処理などは、セレクタを使ってちょろっとコードを書くだけで、ほんの数行で記述できてしまいます。 しかし、この方法の延長で、大規模なJSアプリケーションを構築することは果たして現実的でしょうか。例えば「GMail」や「New Twitter」程度の規模のJSアプリケーションを書かなければならないとしたら、どうでしょう? 大規模なJSアプリケーションを開発するには、こういった手法を延長するのではなく、より洗練されたデザインパターンを導入する必要があります。この目的にぴったりのデザインパターンが、「MVC」デザインパターンです。 MVCパターンは、Webの世界ではサーバサイドプログラミングで広く知られ
はじめに JavaScriptでは関数もオブジェクトです。このことはよく理解されていると思います。関数とメソッドとの明確な違いはなく、どちらも関数オブジェクトである、というところまではよいのですが、関数コールとメソッドコールの違い、あるいはその仕組みは正確に理解されているでしょうか。先日、職場の後輩に問題を出したところ正確に答えられえなかったので、いまさら?と思われるかも知れませんが、関数コールの仕組みを解説します。 関数とメソッド JavaScriptでは関数とメソッドには本質的な違いはありません。オブジェクトのプロパティとして定義される関数を便宜的にメソッドと呼んでいるだけです。parseInt()などのグローバル関数もグローバルオブジェクトのプロパティであり、関数の中でローカルに定義した関数も概念的にはActivation Objectのプロパティなので基本的には全ての関数はメソッド
発端は javascript:alert([].sort.call(null)) これで window オブジェクト取れるのなんで? http://twitter.com/edvakf/status/9222713572 という投稿。 この不可解な挙動を説明することは案外難しい。 まず、ES5のstrict mode以前(つまり、今普通にJavaScriptを使う場合)では、 function fun() { return this; } alert(fun.call(null) === window); がtrueになる。 それから、 var a = [3, 2, 1]; alert(a.sort() === a); alert(a); // [1, 2, 3] sortは破壊的であり、thisを返す。 thisが配列以外の場合については、仕様では未定義であるが、どうなのか。id:nan
pjaxの前にpushStateとは AjaxとjQueryの説明は不要として、pushStateとはなんぞや。 pushStateを使ってブラウザの履歴に対する操作をし、HTMLの一部のみを書き換える動作でもブラウザの戻る/進む機能を実現できる方法のひとつ。Ajaxなページを再現し、かつURLを見慣れた方法で自然にpermalinkを表現できる。 有名なところではGitHubで使われてるアレ。 hash fragment (/#!/) ブラウザの履歴を機能させるため、URL の fragment (#) を使ってAjaxなページを実現する方法。一時期もてはやされた感があるが、さらなる「#!」URL批判 - karasuyamatenguの日記 など合理的な反論があり、これから導入するのはためらわれるところ。 有名なところではTwitterで使われているあの厄介者。 pjaxとは pjax
JsDoc ToolkitはJavaScriptソースに記述されたJavaDoc風なDOCコメントを収集しHTML化するツールである(perlで記述されているJsDocとは別物であることに注意;こちらはRhinoで記述され、必然的にJavaにもアクセスしている。Rhinoなのでこれ自体があらかたJavaScriptで記述されており、ソース自体の解読もより容易である)。 DOCコメント DOCコメントは「/**」で始まり「*/」で終わる;途中の行頭の「*」および空白系文字は無視される。DOCコメントは最初の行の説明文(省略可)と以降1つ又は複数続く、「@」で始まる「タグ」、とで構成され(各ブロックは次のタグまで又はDOCコメント末尾まで、途中の連続する空白系文字は空白1字にまとめられ、またHTMLタグの記述も可)、JsDoc Toolkitはこれらを回収分類しHTML化関数(テンプレートとも
JavaScriptで配列をコピーするのにちょっとハマったので、調べたことを書いておく。以下のコードは llevalで結果を確認した。 JavaScriptでは、以下のようにすると配列のコピーではなく、元の配列への参照となる。 var a = [1, 2, 3]; var b = a; print(a); //[1, 2, 3] print(b); //[1, 2, 3] b[3] = 4; print(a); //[1, 2, 3, 4] print(b); //[1, 2, 3, 4] シンプルな配列ならば、次のようにしてコピーできる。 for文を使う。 var a = [1, 2, 3]; var b = []; for (var i=0, l=a.length; i<l; i++) { b[i] = a[i]; } print(a); //[1, 2, 3] print(b); /
2007年11月26日23:45 カテゴリLightweight Languages javascript - お伺い - Object.prototype.clone() JavaScriptでオブジェクトのディープコピーをどうやってやるのか、これといったものがないようなので作ってCodeReposにおいておきました。 /lang/javascript/clone/trunk/clone.js - CodeRepos::Share - Trac なぜこういうのが必要かというと、 var a = [0,1,2,3]; alert(a); // 0,1,2,3 var a2 = a; a2[4] = 4; // a2を変えると... alert(a2); // 0,1,2,3,4 -- aも変わってしまう! からです。参照でオブジェクトを実装しているものにはJavaScriptでなくてもこう
http://blog.livedoor.jp/dankogai/archives/50957890.html まず、Object.prototypeにメソッドを生やしてしまうとfor inでキーを列挙するときにいちいちhasOwnPropertyを使わないといけなくなるので普通は使いません。影響が大きすぎるので、よっぽど変態的なライブラリじゃないと使わない。他のライブラリと組み合わせるとほぼ確実に問題が起きる。それから、deep_cloneが欲しい場合はJSONを作ってevalすればよい。パフォーマンスを気にする場合とか、浅いコピーが必要な場合はそれなりに工夫する必要があるけど。 で、JSONにするのにFirefoxだとtoSourceというのが使える。unevalというラッパーがあって、これだとnullでも平気。 http://subtech.g.hatena.ne.jp/cho45/
JavaScriptpipe.jspipe - PythonでInfix Syntax(挿入記法 - パイプ風の処理)を | TRIVIAL TECHNOLOGIES on CLOUDを見てJavaScriptでもやってみたくなった。使い方pipe.jsをロードしておく。使用例数列のうち奇数だけを選び昇順にソートした新しい数列を得る console.log( Pipe.s([3,1,6,102,19,8,2,11]) //パイプ処理の開始 | where(function (x) { return x % 2 === 1}) | sort ||Pipe.e() //(数列を得たいときは||Pipe.e()を最後に指定する ); 400万以下の偶数のフィボナッチ数の総和を求める var fib = function () { var a = 0, b = 0; return function
名前(席順に): ジョージ ポール リンゴ ジョン 人狼の数: から 占師の数: 狩人の数: 恋人の数: 狂人の数: 妖狐の数: 襲撃者は: 村人の数:0人から0人 合計人数:0人 昼の長さ: 死亡時に: 投票結果:
alert( [ ] == ![ ] ); /* true */ っていうのはよくJavaScriptのWTFネタとしてよく見るんですが、その仕組みについて深く追いかけたことがありませんでした。 そいで今日、 さっきのがなんでtrueになるのか忘れた…あれー。参照が同一であるかをみるのは、両者ともにObject型だったときのみだったっけ… とツイートしたところ、id:efcl(@azu_re) さんから @esperia09 http://d.hatena.ne.jp/otn/20100222/p1 参照を見るのは=== と、回答を頂いたので、せっかくですし詳しく調べてみることにしました! 問題となる式 alert( [] == ![] ); // true !つけてんのになんでtrueやねん!っていう、ちょっと分かりにくい"仕様"です。(バグじゃないよ!) まずは、この評価がどういう判断
以前書いた「ラムダ計算基礎文法最速マスター」(以下「最速マスター」)は, 予想以上に多くの人に興味を持ってもらえたようですが, 同時に難しくてわからなかったという人も多かったようです. 反響から察するに, 構文を見慣れていない(と錯覚してしまう)ことが理解の妨げになっていたように思います. ラムダ計算の構文は, 実際には全く特殊なものではありません. このことがよくわかるように, 「最速マスター」のラムダ計算の簡約の例をすべてJavaScriptの構文で書いてみました. ......という内容になるはずでしたが, 気がついたらラムダ計算のインタプリタをJavaScriptで実装していました! 実際に動かせるものは下記URLにあります. https://tarao.github.io/LambdaJS/#js 動作確認と既知の問題 Firefox 3.6 Google Chrome 4.1
JavaScriptで型推論付き静的型付け言語のインタプリタを作成しました。これは、サイボウズ・ラボユースのメンバーとして開発をさせていただいたものです。ライセンスは MIT License です。 Ibis Interpreter GitHub 型推論の実装方法を解説するため、メジャーであり気軽に試せるJavaScriptを使って型推論器を書きました。 文法の簡単な説明は Ibis クイックチュートリアル 実装の詳細については JavaScript による型推論器の実装 をご覧ください。
Stored JS in MongoDB is saved in the special system.js collection. The documents there should be structured like: {_id: "sum", value: function (x, y) { return x + y; }} _id is the name of the function, and value is the JS code defining the function. Here’s an example of saving such a function and then using it in an eval. This can be run using the MongoDB shell: > db.system.js.save({_id: "sum", ..
JavaScriptなぜJavaScriptで書いたかには触れないでください。試してみる:http://ajalabox.appspot.com/green/index.htmlGitHub:https://github.com/ajalabox/green名前GreenScript (緑茶)特徴LL(?)*1文法はJavaScriptに似ている(セミコロンの無いJavaScript)型毎に演算子の挙動を定義しているというか内部的には演算子は関数ブロックスコープさりげなくクロージャが使えるオブジェクト指向(現時点で配列以外のオブジェクトは作れない)プロトタイプベース(内部)実行速度が非常に遅いサンプル変数の宣言と代入 //値の宣言(var文は無い→後で作る予定) a := 2 b := 3 print(a, b) //2,3 //ブロックスコープ { a := 200 //新しいスコープで
Shibuya.js テクニカルトーク Test.jsでid:t-wadaさんの話がとても興味深く、 js テスト放浪記 qunit-tapというのが魅力的に感じたのでnode.jsのテストで使ってみました。 GitHub - twada/qunit-tap: A TAP Output Producer Plugin for QUnit quinit-tapとは まずQUnitについて。 QUnit QUnit自体は全然使ったことなくて詳しくは知らないのですが、もともとjQueryのテスト用に作られたテスティングフレームワークで、今はjQueryに関係なく色々な場面でのJavaScriptのテストに使えるようになっている、とのこと。 QUnit is a powerful, easy-to-use, JavaScript test suite. It's used by the jQuer
やりたいことはタイトルのとおり. 要はオーバーロードしたいお... ※※※※ こういう願いは既出であること間違いないっ, ※※※※ よってここに書いてること, あるいは ※※※※ さらにエレガントな事がどっかに書かれてるかもしれないっ!!! とりあえずECMA-262を読んでみる. [p.74] 11.6.1 The Addition operator(+) 読むのがめんどくさいが, 要はReturn the String that hogehogeか, ToNumber(左辺)とToNumber(右辺)の和を返すことしかできない. オーバーロードとかできねーーーー (配列を返せない) んじゃ, 汚いけど, String介してやればいいか...??? > Array.prototype.toString = function(){return this.join(',') + ','} [
現在、Shibuya.js が開催中です!Ustream で http://www.ustream.tv/channel/shibuyajs にて放送されています。これから、このブログの内容をしゃべります! 今回「テスト」がテーマなうえ、Shibuya.js は「役に立つ話担当」「ネタ担当」に分かれていて、僕は「ネタ担当」なんですが(笑)、いつも通りネタです。でも、遠い未来の役立つネタです! きっかけは、id:t-wada さんに、GUIの自動テスト関係の質問をしたら、凄くいいことを教えてもらいました。 全てのテストはサンプリングテストである (少し表現違ったらごめんなさい)話の流れで、部屋を移動しなくていけなくて、たしか、それしか話ができなかったのですが、要するに、サンプリングテストである以上、全ての入力パターンをテストすることは不可能であり、できることは、限られたコストの中で、効率よく
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く