![[PukiWiki]](image/pukiwiki.png "[PukiWiki]")
「[[.NET 開発基盤部会 Wiki>http://dotnetdevelopmentinfrastructure.osscons.jp]]」は、「[[Open棟梁Project>https://github.com/OpenTouryoProject/]]」,「[[OSSコンソーシアム .NET開発基盤部会>https://www.osscons.jp/dotNetDevelopmentInfrastructure/]]」によって運営されています。 -[[戻る>HTML/CSS/JavaScript]] *目次 [#q148d6b5] #contents *概要 [#vd489801] SaaS開発で調べたJavaScriptについてのメモ。 *[[宣言とデータ型>JavaScriptの宣言とデータ型]] [#ia153e36] *[[比較処理>JavaScriptの比較処理]] [#r2ad66bf] *[[イベント処理>JavaScriptのイベント処理]] [#e311f48f] *[[JSON処理>JavaScriptのJSON処理]] [#ff279ce5] *[[スレッド処理>JavaScriptのスレッド処理]] [#d6ac8bf9] *[[HTML5>HTML5 JavaScript API]] [#w02f087f] *[[エフェクト>JavaScriptのエフェクト処理]] [#k0f136b5] *言語系 [#l130e56e] **言語仕様 [#r22c47d7] ***特徴 [#h3504c25] -インタプリタ言語 -動的型言語 -イベント駆動型言語 -プロトタイプベースのオブジェクティブ指向言語 ***[[ECMAScript]] [#d8043fec] 現在のJavascriptの仕様 ***CommonJS [#xe3a8701] CommonJSは、module機能のあるJavaScript ***Node.js [#q9fc6e24] Node.jsは、サーバーサイドのJavaScript +[[CommonJS>#xe3a8701]]に準拠 +その後、Node.jsが独自拡張 +Node.jsの拡張仕様に他言語が追随 +Node.js拡張仕様が事実上の[[CommonJS>#xe3a8701]] ※ サーバーサイドのJavaScriptとは言うものの、~ JavaScript系のフロントエンド開発ツールは、~ ほぼ、このNode.jsで開発されている。 **前方互換 [#qd15f83d] ***[[Polyfill>Polyfill (JavaScript)]] [#me2ddef5] ***[[modernizr、Respond.js>https://techinfoofmicrosofttech.osscons.jp/index.php?ASP.NET%20%E3%81%AE%20Modernization#y67baf40]] [#ud04ec3f] 最近のASP.NETのテンプレートに標準同梱されている。 **AltJS [#d11cd6c3] ***[[TypeScript>https://techinfoofmicrosofttech.osscons.jp/index.php?TypeScript]] [#kf4fe370] -Microsoft -変数に型が使える。 ***JSX [#gf642367] -Facebook -Reactで仮想DOMをXMLで扱う。 ***Dart [#fabf5f7e] -Google -普及は進まず、2015年にはVMのChrome統合を断念 -[[TypeScript>#kf4fe370]]をGoogle社内の標準プログラミング言語として承認 ***CoffeeScript [#sb380570] -Railsが採用 -ES6が後継扱いで衰退 **トランスパイラ [#z4771853] 新しい文法を使ったソースコードを、~ [[ES3-ES5>#d8043fec]]までの文法に置き換えるソースコード変換ツール。 ***Babel [#f322ef90] [[ES7やES6>#d8043fec]]の構文で書かれたJavaScriptを、~ 現在のブラウザで使用可能なES5に変換。 ***buble [#f66be3e0] ***Traceur Compiler [#x946c8f6] ***Rollup [#fd225c19] *ツール系 [#s9fa0ab7] **パッケージ・マネージャ [#i6813c82] ***[[bower]] [#q9d1cb30] ***[[npm]] [#y99214ea] **タスク・ランナー [#pec2edb2] 以下のような、諸々の作業を自動化するツール -新JSに対する処理 --新JSのコードを、ブラウザで使えるようにする。 --新JSとは、下記を指している。 ---[[モジュール・バンドラを要するCommonJS>#of6181e9]] ---[[コンパイルを要するAltJS>#d11cd6c3]] ---[[トランスパイラを要するES6・7>#z4771853]] -最小化 -難読化 --ugilify ***[[Gulp]] [#i12160b4] ***[[Grunt]] [#m9245dc4] ***guard [#i7af0988] ***, etc. [#m3a7c36c] **モジュール・バンドラ [#of6181e9] [[CommonJS>#xe3a8701]]のrequire機能(外部モジュール読込)を、~ 階層構造が異なるライブラリを依存ライブラリをバンドルする。 ***browserify [#u16e1dce] ***[[webpack]] [#z8a6be11] [[タスク・ランナー>#pec2edb2]]の要素も含んでいる。 ***rollup [#eba42278] **その他 [#pfc77681] ***ESLint [#zdecbb02] -ESLint 最初の一歩 - Qiita https://qiita.com/mysticatea/items/f523dab04a25f617c87d *ライブラリ、フレームワーク系 [#m13d5905] **ライブラリ [#qba41cc7] ***prototype.js [#vad3f37c] -ライブラリ -オブジェクト指向のクラスと継承の機能を提供 -Prototype JavaScript Framework - Wikipedia~ https://ja.wikipedia.org/wiki/Prototype_JavaScript_Framework ***[[jQuery>#h18c539e]] [#u9783154] -ライブラリ -実績多数 -Bootstrapなど有名所が依存 -jQuery - Wikipedia~ https://ja.wikipedia.org/wiki/JQuery **MV* UIフレームワーク [#l66057b9] ***Backbone.JS [#ub2e8c93] -[[CoffeeScript>#sb380570]]の作者 -Model–view–presenter(MVP) -Backbone.js - Wikipedia~ https://ja.wikipedia.org/wiki/Backbone.js ***KnockoutJS [#j66996af] -Microsoft -Model-View-ViewModel (MVVM) -KnockoutJS - Wikipedia~ https://ja.wikipedia.org/wiki/KnockoutJS ***React [#s4081e43] -Facebook、Instagram -Component志向のMVC -・・・。 ***AngularJS [#ac831ebe] -Google -MVCおよびMVVM --宣言型プログラミング --MVCおよびMVVMアーキテクチャ --"MVC" アーキテクチャにおけるスコープ --双方向データ結合 -AngularJS - Wikipedia~ https://ja.wikipedia.org/wiki/AngularJS ***Vue.js [#o9dc5e69] ***比較 [#z7987c5e] -【2017年版】JavaScriptのフレームワーク比較とニーズの高まり｜フリエン~ https://furien.jp/columns/187/#2-1 -AngularJS vs Knockout.js vs Vue.js vs Backbone.js Frameworks~ https://www.altexsoft.com/blog/engineering/angularjs-vs-knockout-js-vs-vue-js-vs-backbone-js-which-framework-suits-your-project-best/ *その他 [#pd4005a5] **UIライブラリ [#d722853a] ***scheduler and events calendar [#b616969e] -Top 5 : Best jQuery scheduler and events calendar for web applications | Our Code World~ https://ourcodeworld.com/articles/read/55/top-5-best-jquery-scheduler-and-events-calendar-for-web-applications -シフト系は、また、違うようで、JS系では厳しいかもしれない。 --https://www.pro-system.co.jp/products/kinnmu/ver7_new.html *参考 [#k43384ff] **歴史 [#t1bee751] -JavaScript - Wikipedia~ https://ja.wikipedia.org/wiki/JavaScript -Javascriptの歴史~ https://www.slideshare.net/ssuser4be374/javascript-58886880 ***Qiita [#p3f988a2] -Javascriptの歴史~ https://qiita.com/a_rcsin/items/0a3c8c98c8d703c49a22 -JavaScriptの歴史をざっくりまとめたよ!~ https://qiita.com/Mic-U/items/c900a6f62862954d62e0 -JavaScriptが辿った変遷~ https://qiita.com/naoki_mochizuki/items/cc6ef57d35ba6a69117f **昨今 [#q19768fc] ***トレンド [#d2a644b2] -人気上昇中のJavaScriptライブラリを調べてみた - Build Insider --【2014年版】~ http://www.buildinsider.net/web/popularjslib/2014 --【2015年版】~ http://www.buildinsider.net/web/popularjslib/2015 --【2016年版】~ http://www.buildinsider.net/web/popularjslib/2016 -【使い方まで徹底解説】おすすめJavascriptライブラリ厳選10選！~ 侍エンジニア塾ブログ | プログラミング入門者向け学習情報サイト~ http://www.sejuku.net/blog/4559#Bootstrap ***ツール類 [#z34ab455] -レトロエンジニアのための近代Webフロントエンド事情 - Qiita~ https://qiita.com/uctakeoff/items/ce8da368d020273c6064 -HTML／JavaScript開発作業を効率化する便利ツールの活用連載一覧：CodeZine（コードジン）~ https://codezine.jp/article/corner/578 ***今風の書き方 [#ff6801b9] -古い感じがしてかっこわるいと思うコードの書き方10例｜Webpark~ http://weboook.blog22.fc2.com/blog-entry-272.html --1. フレームを使っている --2. centerタグを使っている --3. レイアウトにテーブルを使っている --4. タグが大文字 --5. 改行を連続して使っている --6. 全角スペースで横の間隔を調整している --7. リストを使っていない --8. bodyタグに要素を指定している --9. ワンポイントの画像にimgタグを使っている --10. border等を一括で指定していない -旧石器時代のJavaScriptを書いてる各位に告ぐ、現代的なJavaScript超入門 - Qiita --Section1 ～すぐにでも現代っぽく出来るワンポイントまとめ～~ http://qiita.com/gaogao_9/items/ec2b867d6941173fd0b1 --Section2 ～CommonJSモジュールと仲良くなろう～~ http://qiita.com/gaogao_9/items/190f4b52d6876f0b8d8a --Section3 ～Browserifyをマスターしよう～~ http://qiita.com/gaogao_9/items/0b4bf5cd6416347b3b52 --Section4 ～Gulpで処理を自動化しよう～~ http://qiita.com/gaogao_9/items/d4e23de821d0fd78c13d --Section5 ～ES2015文法を覚えよう(前編)～~ http://qiita.com/gaogao_9/items/18b20ad9b76c9c81b5fa
