運営元のロゴ Copyright © 2007-2024 All Rights Reserved by Gijutsu-Hyoron Co., Ltd. ページ内容の全部あるいは一部を無断で利用することを禁止します。個別にライセンスが設定されている記事等はそのライセンスに従います。
はてな教科書JavaScript編 講義の目的 JavaScriptについて、自分で調べて学習するための基礎知識を身につける リファレンスをひけば良い部分は覚えない 話の流れ JavaScriptの言語コア部分 構文とか WebとJSにまつわるあれこれ DOM 非同期プログラミング Ajax jQuery フロントエンド設計 Node.js 駆け足で進めるので、速すぎるなら遠慮せず言ってください! LICENSE この作品は クリエイティブ・コモンズ表示 - 非営利 - 継承2.1日本ライセンス の下に提供されています。
Kyoto.js #10で「知られてそうで知られてない少し知られてるECMAScript 2015 (ES6)の新機能」というライトニングトークをしたので、そのスライドに当日しゃべった内容や補足を追記して以下に掲載します。 自己紹介 nanto_vi 情報規格調査会SC 22/ECMAScript Ad hoc委員会 editional issueの報告 ECMAScript 2015 (ECMA-262 6th Edtition) クラス構文 アロー関数 ブロックスコープ Promise etc... 2015年にECMAScriptが大幅に改定されました。クラス構文やアロー関数の追加はあちこちで取り上げられているので皆さんご存知でしょうが、ここではあまり取り上げられていない地味な新機能を紹介します。 Unicodeの符号位置 // 🍣 '\uD83C\uDF63'; // ES5 '
// 変更を監視するノードを選択 const targetNode = document.getElementById("some-id"); // (変更を監視する) オブザーバーのオプション const config = { attributes: true, childList: true, subtree: true }; // 変更が発見されたときに実行されるコールバック関数 const callback = (mutationList, observer) => { for (const mutation of mutationList) { if (mutation.type === "childList") { console.log("子ノードが追加または削除されました。"); } else if (mutation.type === "attributes") { co
このポストは以下の記事を、筆者の許諾を得て意訳したものです。 JavaScript Modules: A Beginner’s Guide 何か誤りがありましたら、ご指摘いただけると幸いです。 (以下、意訳) はしがき もしあなたがJavaScriptの初心者だとしたら、以下の言葉は全く意味の分からないものかもしれません。 モジュール管理 vs モジュール読み込み Webpack vs Browserify AMD vs CommonJS 等々…。 それでもJavaScriptのモジュール周りについて、苦手意識を持たないでください。モジュールに関して理解することは、Webエンジニアにとっては必須科目なのです。 このポストでは、カンタンな解説とコードサンプルによって上記のようなバズワードを解説します。このポストがあなたにとってお役に立つものでありますように。 注:簡素化のために、このポストは
10.How do JavaScript closures work? http://stackoverflow.com/questions/111102/how-do-javascript-closures-work JavaScriptのクロージャーについて 結構とっつきにくい「クロージャー」に苦労されている人も多いかもしれませんが、サンプルコードが多いので英語わからなくても助かります 個人的にはQuestionの「Like the old Albert Einstein said: ... 」というくだりが好きw 9. What does “use strict” do in JavaScript, and what is the reasoning behind it? http://stackoverflow.com/questions/1335851/what-does-use
Select DOM elements by CSS selectorquerySelectorAll - a CSS selector method like the one provided by jQuery. jQuery: $(selector), $(selector, context) Select elements by class namegetElementsByClassName - a fast way of selecting DOM elements by class name in modern browsers. Does not work in IE 8 and below. jQuery: $('.foo') Select elements by tag namegetElementsByTagName - a fast and cross browse
HTMLファイ部のほんだです。 気づきTips! Σ(・ロ・) カヤックの中でもHTML5のWebフロントエンド実装を担当する エンジニアを集めた部署「HTMLファイ部」では、 制作にあたってはまったことや、気づいたことをメモ的に蓄積・共有しています。 通常は、 1. 制作で何かわからないことがでた ▼ 2. Google等で検索して解決の糸口をさがす ▼ 3. こんな方法があったのか〜 と気づきを得る というフローでスキルアップしていくことがもっぱらだと思うのですが、 学びを増やしていくためには違うアプローチも必要なんじゃないかと思います。 カヤックHTMLファイ部では、 1. みんなで蓄積したTipsをざぁっと読む ▼ 2. こんな方法があったのか〜 と気づきを得る ▼ 3. 制作の際に導入していく というフローを繰り返し実践していくことで、 検索では気づけないことを学び、実装力アップ
脱初心者のために これだけは知っておきたい JavaScriptネタ Tsuyoshi Akase 福岡Haxe勉強会 feat. HTML5+α @福岡 第0x00回
タイトル変えました。旧タイトル「JavaScriptでよく使う書き方」。よく使うけど毎回忘れる。 正規表現にマッチするかどうか。 RegExp#testを使う。 /abc/.test("abcdefg") // => true String#searchはマッチした位置を返す。マッチしない場合は-1。先頭にマッチすると0でfalseなので注意。真偽値が欲しい場合はString#searchを使わない。 "abcdefg".search(/xxx/) // => -1 "abcdefg".search(/def/) // => 3 "abcdefg".search(/abc/) == false // => true 正規表現の部分マッチを得る。 部分マッチを得るには、RegExp#execかString#matchを使う。execとmatchの速度は大して変わらない。 正規表現のベンチマー
jQuery and its cousins are great, and by all means use them if it makes it easier to develop your application. If you're developing a library on the other hand, please take a moment to consider if you actually need jQuery as a dependency. Maybe you can include a few lines of utility code, and forgo the requirement. If you're only targeting more modern browsers, you might not need anything more tha
作成:2013/12/24 更新:2014/11/01 Web制作 > サイト構築中にちょっとした動きをのせたいとき、どうすれば良かったのか何度も調べ直さないといけないことがあります。今回はJavaScript で初心者の方でもすぐ活用できるように、使用頻度の高いリファレンスと基本知識をまとめました。 エンジニア速報は Twitter の@commteで配信しています。 もくじ できること 1.リファレンス スクリプトの書き方/基礎知識 2.スクリプトの記述 3.文字列/特殊文字 4.演算子 5.オブジェクト 6.プロトタイプ 7.イベント 8.変数 9.if文 10.配列 11.連想配列 12.正規表現 13.デバッグ できること 1.リファレンス JavaScriptは開発環境の準備がほぼ不要で、コピー&ペーストだけで、動くものができてしまいます。他の言語だとそう簡単にはいきません。サ
2013年 05月 09日 【初心者でもできる!】JavaScriptでFlashのようなタイムラインアニメーションを簡単に作る方法 Yoshiaki Sato はじめまして、フロントエンド担当のヨシアキです。 この記事では、JavaScriptで作るFlashのようなタイムラインアニメーションについて、編集や管理の手間が省けるような作り方を説明していきます。 初心者向けに解説していますので、ぜひこの記事を参考にしてご自分のタイムラインアニメーションを作ってみて下さい! 目次 はじめに - 増え続けるJavaScript製アニメーション 下準備 - HTMLとCSS JavaScriptアニメーションの作成! まとめ このアニメーションのサンプルを見る はじめに - 増え続けるJavaScript製アニメーション iOSなどで表示ができないFlashの代替手段としてJavaScriptで
前回で JavaScript のスコープの基本がわかったので、今回はスコープチェーンとクロージャを勉強してみました。 Call オブジェクトとクロージャの理解がかなり大変でした・・。 変数オブジェクト JavaScript で変数の宣言と参照をするということは、変数オブジェクトを読み書きするということです。 変数オブジェクトというのは、key と value による変数管理専用のハッシュテーブルのこと key が変数名、value が値のセットになっているテーブルで、変数の数だけレコードができるイメージ 変数オブジェクトはプログラマが意識することのない、便宜的なオブジェクト グローバルオブジェクト JavaScript は、ブラウザが新しいページを読み込んだとき、内部的に新しいグローバルオブジェクトを生成して初期化します。 グローバルオブジェクトとは、グローバル変数やグローバル関数を管理す
jQueryを良くする25のTIPS ネタ元:Improve your jQuery - 25 excellent tips ちょっと多いですが、かなり良いTIPSがまとまっています。 Google AJAX Libraries APIを利用しよう Google AJAX Libraries APIを活用すればすばやくライブラリを読み込むことが出来ます。 <script src="http://www.google.com/jsapi"></script> <script type="text/javascript"> // Load jQuery google.load("jquery", "1.2.6"); google.setOnLoadCallback(function() { // Your code goes here. }); </script> 直接読み込むことも出来ます。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く