黒魔術（JavaScript）まとめ - Qiita
まえがき JavaScript、書いてますか？ JavaScriptは今や世界中の人々に愛されています。 stackoverflowの2016年の調査によるとJavaScriptは地球上で最も一般的に使用されているプログラミング言語だそうです。 JavaScript is the most commonly used programming language on earth. Even Back-End developers are more likely to use it than any other language. link しかしJavaScriptは愛されすぎているが故、しばしば黒魔術のようだと比喩されることも少なくありません。 愛と憎しみが紙一重とはこのことですね。 ということでそんなこんなはどうでもいいのですが、自分もJavaScriptは大好きです。 今回は黒魔術まと
ES6時代のコーディングスタイルを考える - Qiita
ここではコーディングスタイルを考える上で、ES6（ECMAScript2015)の以下の特徴に注目して考察するものです。 変数宣言は、constを基本とする クラス宣言文や関数宣言文はブロックスコープ 文字列では、テンプレートリテラルを活用する ジェネレータのために、複数の構文が拡張された また、以下の基準を採用していることを特に触れておきます。 ES5コードの混在、ES5時代のスタイルとの互換性は取らない ES6 modulesが存在しない状況で適用可能なスタイルを取る 視認性を犠牲にコーディング時のミスの影響を隠蔽するスタイル(ヨーダ記法など)は取らない 局所視認性より、全体視認性での高さを重視する 微妙に違うものを区別しやすいスタイルにする 同じものは同じスタイルを取る 一覧しやすくコンパクトに書ける方を採用する 変数宣言は、constを基本とする ES6では再代入を認めないcons
Atsushi's Homepage 〜 Bookmarklet を作ってみる
Bookmarklet とは、JavaScript で記述された小さなプログラムで、 ブラウザの普通のブックマークとして利用できます。 例えば、このようなものです。→ 電卓 Bookmarklet Bookmarklet は普通のブックマーク (お気に入り) となんら変わりませんので、 ブックマークとしてブラウザに登録して、使いたいときに選ぶだけで使えます。 上の電卓 Bookmarklet をブックマークして、そのブックマークを 呼び出してみて下さい。ウィンドゥが開きますので、 "1+1" などの計算式を入れて "OK" を押すと、その式の答えがでてきます。 このようなことができるのが、Bookmarklet です。 JAVASCRIPT::BOOKMARKLET の サイトが Bookmarklet を取り揃えていて有名ですので、 一度見てみると面白いと思います。 ちなみに、私も簡単な
マルチプラットフォームで動く「Electron」は本当に使える技術なのか？｜CodeIQ MAGAZINE
2018年4月25日をもちまして、 『CodeIQ』のプログラミング腕試しサービス、年収確約スカウトサービスは、 ITエンジニアのための年収確約スカウトサービス『moffers by CodeIQ』https://moffers.jp/ へ一本化いたしました。 これまで多くのITエンジニアの方に『CodeIQ』をご利用いただきまして、 改めて心より深く御礼申し上げます。 また、エンジニアのためのWebマガジン「CodeIQ MAGAZINE」は、 リクナビNEXTジャーナル( https://next.rikunabi.com/journal/ )に一部の記事の移行を予定しております。 今後は『moffers by CodeIQ』にて、 ITエンジニアの皆様のより良い転職をサポートするために、より一層努めてまいりますので、 引き続きご愛顧のほど何卒よろしくお願い申し上げます。 また、Cod
javascriptが理解しにくい人へ
javascriptが使えないと… プログラミングの苦労 最近のweb制作の現場ではjavascriptを使う機会が激増している聞く。プログラマーさんとデザイナーさんが分かれているならそんなに心配はないが、状況によってはデザイナーさんが自身でプログラミングに手を出さないといけない現場もあるようだ。むしろjavasc1.javascriptが使えないと…1.プログラミングの苦労2.オブジェクトオブジェクトうるせえんだよ1.オブジェクト指向プログラミング2.オブジェクトとは3.理解がしにくくなると思われる理由1.オブジェクトは既に存在する2.webページはDOM箱で表現される3.やりたいことをするときに4.いきなり難しすぎる4.jQueryの功罪1.jQueryは便利だけど…5.使わない勇気6.javascriptを理解するには1.急がば回れ7.勉強の資料 javascriptが使えないと…
優秀なJavaScriptの開発者になるための5か条 | POSTD
(注記：7/15、いただいた翻訳フィードバックを元に記事を修正いたしました。) 子供の頃、私の興味は互いに関係性のない様々な分野に及んでいました。数学も歴史も大好きでした。 ルネッサンスマン 、つまり 博学者 と言う、複数の分野に秀でた人になりたいと思っていました。これはとても難しい課題で、私は突如として、器用貧乏な人になってしまう危機に直面したのです。 私は特定の分野に特化しなくては、と考え始めました。そうすればたとえルネッサンスマンにはなれなくても、少なくとも、器用貧乏にならなくても済むと思ったのです。どうしたらソフトウェア開発をするのに必要な広い知識を保ちながら、1つの分野で専門性を高めることができるのでしょうか。 この記事では、過去5年間、私が良いJavaScript開発者になるために使ったテクニックとリソースの概要をお伝えしようと思います。 最近の多くのWeb開発者は、ある共通の
JavaScriptを一枚の画像で学習する。javascript-in-one-pic - webhack / ウェブ技術が好き
2015-06-28 JavaScriptを一枚の画像で学習する。javascript-in-one-pic FreeMind？で書かれたJavascriptの基本を学習するツリーマップ画像です。とにかく縦に長い画像です。coodict/javascript-in-one-picgithub.com 最近、githubでawesome-*のように1つの技術を体系的にまとめられた昔風に言えばリンク集が人気です。javascript-in-one-picも1つの技術が1つの画像にまとめられているので分かり易いですね。以下はawesome-*シリーズのawesome-rubyです。 Awesome Rubyawesome-ruby.com おそらく作るのは時間がかかりますが極端に難しいものではないと思います。試して見たい方向けにFreeMindを紹介します。 FreeMind プロジェクト日本語
7 Essential JavaScript Functions
I remember the early days of JavaScript where you needed a simple function for just about everything because the browser vendors implemented features differently, and not just edge features, basic features, like addEventListener and attachEvent. Times have changed but there are still a few functions each developer should have in their arsenal, for performance for functional ease purposes. debounc
Update Your Footer
It is 2025. Update Your Footer. Change your static timestamp to an automatically updating copyright year or other dynamic timestamp. Just copy a code snippet from below or read more. What dynamic timestamp? » JavaScript Snippets This is pure JavaScript, meaning it will refresh the year browser-side, depending on the user's time settings. Just copy the below snippet and paste it where you want your
I am mitsuruog | 進化の早いフロントエンドの世界についていくために、スタイルガイドを有効活用しているという話
フロントエンドの世界では、日々新しいフレームワークやライブラリが生まれています。 初めてそういった新しいものを習得する場合に、なるべくなら近道したいと思うのが人の気持ちだと思います。 まず大変なのが、Hello World から実際のプロダクトやプロトタイプで利用する場合で、これは初めてで何もわからない土地を一人で散策するような感覚にも似ています。 今日、紹介するのは私が進化の早いフロントエンドの世界で、より早く未開の土地に慣れるためにスタイルガイドを有効活用しているという話です。 ちなみにこの記事はFrontrend Advent Calendar 2014 - Qiitaの 6 日目の記事です。 5 日目はじめての CSS 設計 - Qiita(@moschann) 7 日目CSS のプリプロセスとポストプロセス、そして Rework と PostCSS(@morishitter) 良
Post by @0-9
・横80列で折り返す。 普段80列で開発してるわけじゃないけど、横に長いコードも見にくいので。 ・1funtionは30行にする。 これも列指定と同じ意味で。 数字自体はそこまで意味がないけど、長いコードはそれ自体問題がある可能性が高い。 ・1ファイルは200～300行 「JSを1ファイルに200行以上書くと人間は死ぬ」と言われてるけど、実際はもうちょっと多くても大丈夫。 ・インデントは8タブ タブを使う理由は「タブはスペースに一括置換できるけど、スペースはタブに一括置換できない」から。 なので、コード中にコードインデント以外でハードタブは記述しない(文字列内に記述する時は¥tで記述する) タブの表示数はエディタ毎の設定次第だけど、インデントの深いコードが書きにくくなるので8タブで書く。 ただし、インデントの文字数に依存するインデントはしない(4タブでも正常なインデントになるように記述する
ホームページ制作なら渋谷のウェブ制作会社【スタイル】
【スタイル】は東京都渋谷区でホームページ制作を行うウェブ制作会社です。ウェブサイト制作、SEO対策、ウェブマーケティングなどを承っています。良質テンプレートでの格安ホームページ制作プランもあります。
javascript DOMの基本操作まとめ
javascriptのDOM操作の基本をおさらいしておこうと思います。jQueryは少し触ったことがあるのですが、javascript自体はほとんど使ったことがないのでこれを機会に勉強していこうと思います。 ここではDOMの操作とイベント処理をまとめてみます。これが出来るようになると、Web上でインタラクティブな要素を盛り込むことができるようになります。 javascriptの基本 DOM操作 まずはiavascriptのDOM操作から。ここで使うHTMLはこちらです。 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <title>javascriptの練習</title> </head> <body> <div id="main" style="border:1px solid #555;width:400px
サービス終了のお知らせ - NAVER まとめ
サービス終了のお知らせ NAVERまとめは2020年9月30日をもちましてサービス終了いたしました。 約11年間、NAVERまとめをご利用・ご愛顧いただき誠にありがとうございました。
今年こそついにSVG元年？まだ間に合う！SVGの学習に役立つサイト紹介 - 聴く耳を持たない(片方しか)
先日AdobeからこのようなJavaScriptライブラリが公開されました Snap.svg http://plus.adobe-adc.jp/post-4817/ 以前から人気の高かった、IE6でもSVGを表示できるJavaScriptライブラリRaphaelの作者 Dmitry Baranovskiy氏による新たなライブラリで、Raphaelとの違いはSnap.svgではIEなら9以上対応とモダンブラウザを対象にしたこと。さらに自由度と表現力の高いことができるようになっているのが大きな特徴です。 こうしたJavaScriptライブラリがオープンソースで、そしてAdobeから公開されたのは大きなことでこれからSVGもどんどん普及していくのではないでしょうか。 まさに2013年こそついにSVG元年と言えるかもしれません*1。 ……とは言え、そもそもSVGってなに？という人もまだまだ少なくな
`that = this` について思ったこと
thatに思いを馳せる JavaScriptにおいて that = this とか self = this なパターンを頻繁に使うと、作業者の理性が保証されない場合に下記に示す2点の問題が起こりう得ると思っている。 「あー、どうなのかなー、うーん」と思いながら書いてみる。 1.メソッド分割が適切におこなわれない雰囲気 ちょっと極端かも知れないが、Backboneっぽいコードを例にしてみる。 initialize: function() { var that = this; this.listenTo(this.entity, 'success', function() { var bar = that.foo(); that.$el.find('.qux').text(bar); // long. // long.. // logic... }); this.entity.execute(
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Vue.js の基本の「き」を自分なりにまとめてみた
html5-lab.jp
TEST CORDING » Sassの@functionの使い方まとめ – プログラマブルな処理は@function
http://flippinawesome.org/2013/12/23/45-useful-javascript-tips-tricks-and-best-practices/
