2021年に知っておきたいJavaScript最適化技術34選 - Qiita
最新の省略テクニック、コツ、秘訣で、JavaScriptコードを最適化する。 開発者の生活というのは常に新しいことを学ぶことで、その変化についていくことは決して難しいことではありません。私は、フロントエンド開発者として知っておく必要のある省略形や機能など、JavaScriptのすべてのベストプラクティスを紹介して、2021年の生活をより快適にしたいと考えています。 JavaScript開発に長く携わっている人でも、コードを追加しなくても問題解決できるような最新機能を知らないこともあるかもしれません。ここで紹介するものは、クリーンで最適化されたJavaScriptのコード記述にも、2021年のJavaScriptの面接準備にも役立ちます。 これは新しいシリーズで、2021年版のJavaScriptコーディングチートシートです。 1. 複数の条件を持つif 配列に複数の値を格納し、includ
ES2015(ES6) 入門 - Qiita
はじめに 今更ですが、ES2015(ES6)で追加された機能や構文に関する備忘録です。 「JSは書けるけどES2015(ES6)はわからないっす...!」といった人達向けの記事です。 入門記事のためイテレータやジェネレータ等のわかりづらかったり、 説明が長くなりそうな機能や構文は割愛しております。 ES2015(ES6)とは ECMASCriptの6th Editionのこと。ECMAScript 6th editionの6を取ってES6と呼ばれていたが、 2015年に標準化されたため正式名称はES2015になった。 正式名称がES2015ならES6という名称を使うのは間違いなのか どちらの名称でも問題はない。 ES6の名称の方がエンジニアコミュニティに中では浸透しているらしく、ES6と記載されていることが多い。 詳細は以下を参考。 ES6 or ES2015 ? 〜WEB+DB PRES
JavaScript入門: 基礎知識をGIFアニメで分かりやすく解説 -総まとめ
JavaScript QuestionsのLydia Hallie氏の「JavaScript Visualized」シリーズすべての翻訳を完了したので、まとめて紹介します。 JavaScriptエンジンの仕組みをはじめ、イベントループ、スコープチェーン、プロトタイプ継承、非同期処理、ジェネレータ関数、Hoisting（巻き上げ）など、GIFアニメを使用して詳しく解説しています。 シリーズ7本すべてと、プラス1として楽しく学べるクイズもあります。 JavaScript イベントループの仕組み JavaScriptでエラーの原因となるHoisting（巻き上げ）の仕組み JavaScriptのスコープチェーン・変数参照の仕組み JavaScriptエンジンの仕組み JavaScript プロトタイプ継承の仕組み JavaScriptのジェネレータ関数とイテレータの仕組み JavaScriptの
JavaScript Primer - 迷わないための入門書
はじめに 本書の目的 この書籍の目的は、JavaScriptというプログラミング言語を学ぶことです。 先頭から順番に読んでいけば、JavaScriptの文法や機能を一から学べるように書かれています。 JavaScriptの文法といった書き方を学ぶことも重要ですが、実際にどう使われているかを知ることも目的にしています。 なぜなら、JavaScriptのコードを読んだり書いたりするには、文法の知識だけでは足りないと考えているためです。 そのため、第一部:基本文法では文法だけではなく現実の利用方法について言及し、第二部:ユースケースでは小さなアプリケーションを例に現実と近い使い方を解説しています。 また、JavaScriptは常に変化を取り入れている言語でもあり、言語自身や言語を取り巻く開発環境も変化しています。 この書籍では、これらのJavaScriptを取り巻く変化に対応できる基礎を身につけ
現代の JavaScript チュートリアル
私たちはこのオープンソースプロジェクトを世界中の人々に提供したいと考えています。このチュートリアルの内容をあなたが知っている言語に翻訳するのを手伝ってください。
【Web Speech API】ブラウザの音声合成(読み上げ)機能を触ってみる - Qiita
この記事は、CPS Lab Advent Calendar 2018の5日目の記事です。 音声認識編 → https://qiita.com/hmmrjn/items/4b77a86030ed0071f548 はじめに みなさん、ウェブサイトで音声合成(読み上げ)、音声認識を使いたいとなった時、どうしますか? Google Cloud Speech API Microsoft Azure Text to Speech API IBM Watson Text to Speech API AWS Amazon Polly などのがつがつとしたWebサービスが思いつくのではないでしょうか? でも、登録しないといけないし、お金かかりそうですよね... 実はそれ、最近のブラウザであれば、無料でできるんです。 Web Speech API とは 自分の周りでは意外と知っている人が少なかったので紹介しま
簡単Javascript & jQueryでテキスト読み上げ - Qiita
$(function(){ $synthes = new SpeechSynthesisUtterance('こんにちわ'); speechSynthesis.speak($synthes); }); $(function(){ // 準備 $voicesを取得したいだけなのだけれども $voise = null; $voiseName = 'Google 日本語'; $voices = speechSynthesis.getVoices(); $synthes = new SpeechSynthesisUtterance(); // SpeechSynthesisUtterance()に時間かかるから様子みる $repeat = setInterval(function() { if($synthes){ $voices = speechSynthesis.getVoices(); //
かわいいデザインのツールチップ「grumble.js」
かわいいデザインのツールチップ（吹き出し）効果を与える「grumble.js」 ツールチップ（吹き出し）により、文章や画像の補足をすることで、わかりやすくすることがあります。 よくあるプラグインだとちょっとデザインが・・・という方にgrumble.jsをお勧めします。 ポップでかわいいデザインで作成することができます。 sponsors 使用方法 grumble.jsからファイル一式をダウンロード。 <link type="text/css" href="grumble.css" rel="stylesheet" /> <script type="text/javascript" src="jquery-1.6.1.min.js"></script> <script type="text/javascript" src="Bubble.js"></script> <script type=
UIに使用しているアニメーションを今よりもっと魅力的に動かせるようになるチュートリアル
ボタンやパネル、レイアウトなど、最近はWebのユーザインターフェイスでさまざまなアニメーションが利用されています。WebページのUIに使用しているアニメーションを今よりもっと魅力的に動かせるようになるチュートリアルを紹介します。 アニメーションを魅力的に動かすテクニックを段階的に解説しているので、それぞれの効果がよく分かります。 Giving Animations Life 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様に許可を得て翻訳しています。 Step 1: まずはシンプルに動かしてみよう Step 2: バウンドを加える Step 3: バウンドを自然な動きにする Step 4: ディズニー®の12の基本原則を取り入れる Step 5: アニメーションを誇張する Step 6: アニメーションに命を吹き込む キーフレームを簡単に設定できるスクリプト St
JavaScript ファイルに動的にパラメータを渡す方法
<script> var foo = "{$foo}"; var bar = "{$bar}"; </script> <script src="/js/hoge.js"></script> よくある簡単なパターンですが、最もメンテナンスがしにくいです（経験上）。 良くないところは、 ・渡したいパラメータが JavaScript のグローバル変数になる。 ・記述する順番に気を付けなければならない。 ・JavaScript と PHP（Smarty）が分離できない。 ・script タグが２つあってカッコワルイ（超重要！！）。 です。 後述のパターン２～４を検討した方が良いです。
Reference - JavaScript用Facebook SDK - ドキュメンテーション - Meta for Developers
Facebook SDK for JavaScript - ReferenceReference docs for each of the full list of methods and functions available in the SDK.
JavaScript - MDC
JavaScript チュートリアル 初級編 JavaScript の基礎 JavaScript の第一歩 JavaScript の構成要素 JavaScript オブジェクト入門 JavaScript ガイド 入門編 文法とデータ型 制御フローとエラー処理 ループとイテレーター 関数 式と演算子 数と日付 テキスト処理 正規表現 インデックス付きコレクション キー付きコレクション オブジェクトを利用する Using classes プロミスの使用 JavaScript 型付き配列 イテレーターとジェネレーター メタプログラミング JavaScript モジュール 中級編 クライアントサイド JavaScript フレームワーク クライアントサイド Web API Language overview JavaScript のデータ構造 等値比較と同一性 プロパティの列挙可能性と所有権 クロ
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でAndroidアプリを開発！ Macでも動くAndroidScript｜Mac - 週刊アスキー
Androidアプリのプログラミング環境「AndroidScript」をご存知だろうか? 最大の特徴は、ウェブサイトやウェブアプリ開発などに用いられるJavaScript言語を採用している点にある。 JavaScriptを使いながらも、独立したAndroidアプリに近い機能や使い勝手を実現したプログラムを実装可能。JavaScript言語の学習用としても適している。現在はベータ版のため、無料で利用でき、搭載されている機能の完成度は高い。 AndroidScriptには、詳しいドキュメントと豊富なサンプルコードが付属している。これに含まれる「Alert」や「LoadText」といった単一機能のサンプルコードは、その場で動作を確認し、コピーして自分のプログラムに張り付けるといったことも可能だ。 これらのサンプルを順に試し、どのような仕組みになっているかを確かめていけば、独自のアプリを作る際に非
JavaScript プログラマの職種は4種類くらいに分けるべき
jser.md はじめに JavaScript を使っていると「JavaScript出来るの？ jQuery / AngularJS / Node.js etc... で困ってるんだけどさー」みたいな話を振られることがあります。 そういった時に、自分は一般的なライブラリの使い方やフレームワークに対して大した知見も興味もないので、わざわざ説明するのも面倒なのでこうして文章にしておきます。(本当に届いて欲しい人に限って、こういう文章が届かないのはわかっていますが、文章を書くこと自体が気晴らしだと思って諦めます。) 「フロントエンドエンジニア」という言葉の汎用性 先ほどのような話は自分に限ったことではなく、たぶん経験のある人も多いでしょう。 振られた話が自分の分かる範囲、あるいは興味のあるものならばまだ良いのですが、そうでないことがあまりに多すぎます。 話を振られるだけならともかく「JavaSc
WebページからのPUTとDELETE - Webアプリケーション構築入門2
このWikiは、拙著『Webアプリケーション構築入門』（森北出版, 第2版, 2011）のドラフトであり、今後更新する予定はありません。このWiki内での「教科書」という表記は、旧版を指していることに注意してください。 新しい情報は、サポートサイトに掲載されています。 HTML5より前のHTMLでは、フォームで利用できるHTTPメソッドはGETとPOSTだけである。そのため、PUTやDELETEを使う場合には、JavaScriptが必要になる（JavaScriptでのHTTPリクエストを参照）。一部のケータイのブラウザのように、JavaScriptをサポートしていないブラウザでは、PUTやDELETEはPOSTで代用しなければならない。PUTやDELETEをPOSTで代用する方法には、以下の2つがあるが、フォームで利用できるのは、パラメータ_methodを利用する方法だけである。 メソッド
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
YUI Library
Layouts - Pure
omotan.com
omotan.com
