この資料では、JavaScript でオブジェクト指向プログラミングを行う際に備えておくことが望ましい、基礎知識や概念について解説します。 【対象者】 ・JavaScript でアプリケーションを構築できる方 ・JavaScript におけるオブジェクト指向プログラミングの 実現手法や原理への理解を深めたい方 ・Java 的なクラスベースの言語との違いに違和感や混乱を 感じてらっしゃる方
最強オブジェクト指向言語 JavaScript 再入門！
この資料では、JavaScript でオブジェクト指向プログラミングを行う際に備えておくことが望ましい、基礎知識や概念について解説します。 【対象者】 ・JavaScript でアプリケーションを構築できる方 ・JavaScript におけるオブジェクト指向プログラミングの 実現手法や原理への理解を深めたい方 ・Java 的なクラスベースの言語との違いに違和感や混乱を 感じてらっしゃる方
覚醒!JavaScript
7月19日に行った「覚醒！JavaScript」勉強会で使用したスライドです。 http://connpass.com/event/7082/
JavaScript初級者から中級者になろう — uhyohyo.net
このページの最終更新日：2019年7月4日 JavaScript。主にWebページを作るのに使われるほか、現在ではさまざまなところで活躍しているプログラミング言語です。 このページはJavaScriptの中級講座です。最新鋭ではないかもしれませんが、読み進めれば大抵のものを自分で作れるようになることでしょう。 言い訳とJavaScriptの歴史 / 問い合わせ 最近の更新2017/10/05 全ページを手直ししました。十六章第六回を追加。2017/11/9 十六章第二十一回・十六章第二十二回を追加。2017/12/2 十七章第三回・十七章第四回を追加。2017/12/3 十七章第五回・十七章第六回・十七章第七回を追加。概要コンテンツは第一篇と第二篇に分かれています。 JavaScriptは昔からWebページに動きを与えるものとして用いられてきましたが、第一篇ではそのような、昔からあるJav
今年からジワジワくる【秘伝】のJavaScript - {ライブラリ系}初回編 - Qiita
と私が勝手に思っているだけですが 早速それを紹介？ではなくメモります。 理由 誰かが、情報発信をしないとダメかなと思い、気づいたメモとして残します。 ちょっと変わり種を紹介したかった 将来的に流行ったりした時に少しうれしいからです。 JS 正確には、JavaScriptです そして、私はJSエンジニアではありませんが、初めてJSに触れたのは小学生の頃初めて買ってもらったWindows98のPCです。あの頃は意味もなく動いたりすることが面白くて仕方なかったのです。 今回は、そんな幼少の気持ちを奮い起こしたものを紹介します。 それでは紹介 順番は適当です。見た方が面白いと感じたものを使っていただければという感じです。そして、一介のエンジニアたる私の独断と偏見でメモしてるだけですので、あまり内容は気にしないでください。ああ、JSも知らない残念なやつだと罵ってくださっても構いません、実際そのとおり
JavaScriptで覚えておくとよいデータ構造 - 配列・オブジェクト - いろいろ解析日記
JavaScriptで必要なデータ構造の覚書です。 目次 配列 配列を生成する。 配列にデータを追加する。 配列にデータを格納する。 配列からデータを取得する。 配列中のすべてのデータに同じ処理をする。 オブジェクト オブジェクトを生成する。 オブジェクトにデータを格納する。 オブジェクトからデータを取得する。 オブジェクト中のすべてのデータに同じ処理をする。 関連記事 配列 配列は複数件のデータを扱うためのデータ構造です。 ■配列を生成する。 配列の生成は以下のように行います。 var 配列の名前 = []; var 配列の名前 = [ データ, データ, … ]; 配列の生成では、配列の名前を指定します。 もし、生成時にデータを格納する場合に、[]内にデータを指定します。 なお、JavaScriptでは配列の生成時にサイズを指定しません。 例えば、空の配列array1を生成するには、以
ホームページ制作なら渋谷のウェブ制作会社【スタイル】
【スタイル】は東京都渋谷区でホームページ制作を行うウェブ制作会社です。ウェブサイト制作、SEO対策、ウェブマーケティングなどを承っています。良質テンプレートでの格安ホームページ制作プランもあります。
気軽にプログラミングを始められるWebエディタ『runstant』作りました - Qiita
7月19日. 久しぶりの３連休. 予定はぎっしりだった. だが神からのお告げがあった. なんか作れと. 気づいたらオレの指は Macbook Air の薄いキーボードの上だった. ってことで連休中にちょっとしたツール作りました. 気軽にプログラミングを始められるWebエディタです. 名前は runstant. run + instant の略で, インスタントラーメンのように一瞬で気軽に実行できるよって意味です. ログイン不要, サーバー通信なしで一瞬で プログラミングを始めることができます!! 一応, tmlib.js 公式エディタ的な 位置づけなのでデフォルトで tmlib.js のサンプルが入ってます. とりあえず触ってみてください -> こちら 特徴 ログインの必要ないよ 状態を hash で保存するのでサーバー通信しないよ html/css/javascript が書けるよ ちょ
レスポンシブ対応サイトを作成する超軽量のスクリプト -skel.js | コリス
スタンドアローンで動作する19KBの超軽量スクリプト。 さまざまなレイアウトに対応できるグリッド。 表示サイズごとのブレイクポイントの設定も簡単。 resetやbox-modelなどの有用なCSSのショートカットを用意。 プラグイン機能も備えているので、拡張にも対応。 skel.jsのデモ デモはシンプルな構成のページが表示が用意されています。 まずはデスクトップサイズとして、幅1200pxで表示してみます。 デモページ：幅480pxで表示 skel.jsの使い方 jQueryや他のスタイルシートなどを用意せずに、すぐに利用できます。 Step 1: 外部ファイル 当スクリプトを外部ファイルとして記述します。 <script src="skel.js"></script> jQueryもスタイルシートも他のファイルは必要ありません。 Step 2: スクリプトのセットアップ スクリプトのセ
IE7,8で透過PNGのフェードイン時に画像がジャギる現象の解消 - Qiita
//ユーザーエージェントの取得(バージョンの取得) var ua = window.navigator.appVersion.toLowerCase(); $(function(){ //IE7,8の時だけ処理 if(ua.indexOf("msie 7.") != -1 || ua.indexOf("msie 8.") != -1){ $('img').each(function(){ var src = $(this).attr('src'); if(src.indexOf('.png') != -1){ $(this).css({ 'filter': 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src="'+src+'", sizingMethod="scale");' }); } }); } });
JavaScript フレームワークがデータバインディングを実現する４通りの手法
最近流行りの JavaScript MV* フレームワークは、どれもデータバインディングをサポートしているが、実現方法はフレームワークによって異なる。 この記事では、各種フレームワークがどのようにモデルの変更を検知しているかを次の 4 つのパターンに分類して紹介する。 モデル クラス方式 (Ember.js、Backbone.js、Ractive.js、Knockout.js など) 力ずく方式 (AngualrJS) モデル書き換え方式 (Vue.js) Object.observe 方式 (Polymer) パターン名は私が勝手に名づけたものだけど、このへんの雰囲気が理解できれば、フレームワークごとの個性が分かるだろうし、利用イメージもわきやすいんじゃないかと思っている。 1. モデル クラス方式 「モデルとして扱えるのはフレームワークが用意したモデル クラスのインスタンスだけ」という
【JavaScript】ぎゃぁぁぁできた！(*ﾟ∀ﾟ*) ページ上部に戻るボタン(解決・設置編) - がちゃまにあ日報
むしむしむしむし。 湿度80％の部屋で過ごしているがちゃまにあですどーもこんにちは。 今日は朝から町内会の草刈りに駆り出されてきました。 2時間くらいなんですけどね。ずっとしゃがんでたから腰が痛い。 ついでに足首と股関節も。 整体とか行ったほうがいいのかなー。うーむ。 今日は昨日投げた疑問の解決編です。 元ネタ↓ 【JavaScript】上部に戻るボタンを付けたい(疑問編) - がちゃまにあ日報 謎は全て(じゃないけど)解けた･･･！ 昨日の時点ではこんな感じ。 <a id="page-top" href="#blog-title">ページトップへ</a> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script type="text/javascript"> $(
凹みTips
はじめに だいぶ前、2018 年の終わりごろに Boids（群体）シミュレーションを ECS の勉強のために書きました。 tips.hecomi.com 上記記事では当時の API を使っており、Unity 側では ECS の実装もまだ色々と検証中だったように思われます。最近は全く追っていませんでしたがあれから 6 年ほど経過し、API 体系も円熟したと思われるため、あらためて現状の実装の調査も兼ねて書き直してみることにしました。以前の実装と比較しながら色々と考察もしていければと思います。 Boids 自体の実装解説については以前の記事をご参照ください。本記事では「ECS のセットアップ」の項以降の内容について、新しい ECS の仕組みの概念獲得のためにあれこれ試行錯誤していく形式で展開していきます。前回はチュートリアル形式でしたが、今回は一つ一つ意味を確認しながら見ていきますので、結構冗
jQuery fontIconPicker - Web Fontを使ったアイコンピッカー MOONGIFT
Web Fontを使ったフォントアイコンはデザイン上で色々な場面で使えますが、さらにユーザに選ばせたりする上でも便利な代物です。しかし元々はテキストであり、Web Fontが入っていないと豆腐になってしまうため、そのUIが問題になります。 そこで使ってみたいのがjQuery fontIconPickerです。ドロップダウン、入力によるフィルタリングまで使える選択ライブラリです。 jQuery fontIconPickerの使い方 ドロップダウンの一例。フォントアイコンが綺麗に並んでいます。 インクリメンタルに絞り込みができます。 カテゴリから絞り込むこともできます。 ダークテーマもあります。 HTMLでの記述は次のようになります。 <select id="myselect" name="myselect" class="myselect"> <option value="">No icon
片手間のJavaScriptから脱出するためにこれからのWebエンジニアが理解すべきこと - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? はじめに 最近、こういった記事が世間をにぎわせている。こりゃエヴァの話なんてしてる場合じゃねぇ！と思ってさくっとこの辺の事情を理解するために必要なことをまとめてみる。 Railsが時代に合わなくなってきた Javascriptを使うのをやめろ：Railsの時代遅れ云々についての結論 昔ながらの「片手間に書くJavaScript」の限界 GoogleやTwitterでも実現できないのだから使うな問題 この話は、どの地点の何の話をしているのかよくわからないのです。現在ではかなりステップバック＆改善が行われ、Safari自体のクラッシュはアプ
wp_enqueue_script したjsファイルにphpから変数を渡す | devLog
タイトルどおりの事がしたく、調べてみるととても簡単だったのでメモ。 wp_localize_scriptというタグを使います。 たとえばphpから下のようにjsを読ませて、 wp_register_script( 'sample', get_path . '/js/sample.js', "",true); wp_enqueue_script( 'sample' ); wp_localize_scriptを追加します。こんな形になります。 wp_register_script( 'sample', get_path . '/js/sample.js', "",true); wp_enqueue_script( 'sample' ); $variable_array = array( 'hoge' => 'huga'); wp_localize_script( 'sample', 'vari
Volocity.jsを使ってアニメーションのパフォーマンスを比較してみた - beijaflor
CSS vs. JS Animation: Which is Faster? CSS AnimationよりもJavascriptを使った方がパフォーマンスが出るよ、というこの記事を見たので実際に試してみた。 結論 アニメーションさせる時は、Velocity.jsを使いましょう デモ DEMO1 - 画面下からスクロールインしてくるモーダルウィンドウ DEMO2 - 120個の丸が一度に動く、シンプルなアニメーション [source code @ GitHub] 機能比較 ライブラリ 特徴 メリット jQuery(animate()) 標準で組み込まれているアニメーションライブラリ ライブラリの読み込み不要 Velocity.js 標準のanimate()と同じ文法で使える拡張ライブラリ スピード最適化された実装 Transit CSS Animationを制御するためのライブラリ 3d-
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
https://qiita.com/team-aries/items/f1e953ceb6839bab5597
JavaScript でメディアクエリを行う window.matchMedia の使い方
WebAPIのこれまでとこれから
転職・退職代行マガジン -
