言語仕様
JavaScriptの「オブジェクト」
プロパティ属性
ES3 互換のオブジェクト定義。
var obj = { x : 1 };
これが以下と等価となる。
var obj = Object.create(Object.prototype,
{ x : {
value : 1,
writable : true, // x の値が変更できる
enumerable : true, // for (var k in obj) で x を辿ることができる
configurable : true // 下に説明
}}
)
メソッド定義の簡略構文
var obj = {
foo() {},
bar() {}
};
上のような構文はデータプロパティの形式( キー : バリュー
)でないのでアクセサプロパティか?と思うが違う。
単に下のものを簡略した書式であり、データプロパティ。
var obj = {
foo: function() {},
bar: function() {}
};
[source,js]
Webブラウザ
Windows8.1にはEdgeはインストールできない(IE11まで)
MS Edgeをインストールできるのは現時点ではWindows10のみ。
Windows8.1の延長サポート期限は 2023年1月10日 であり、このOSにインストールできるMS製ブラウザは IE11 だけ。
HTML
HTMLは他のHTMLをインクルードできない
(Webページの設計を行いたかったのでHTML解説書籍を見て回ったが参考になる記述が全く見つからなかった。 なぜならばHTMLにそのような機能がなかったからだ、という話。)
例えば複数のページ(htmlファイル)に共通ヘッダ(、共通フッタ、共通メニュー、等)を表示させたい場合、 普通に考えればヘッダ部を別ファイルに書き、各ページではそのファイルをインクルードすれば良いが、そのような仕組みはHTML自体は持っていないと考えてよい(iframeを使えば実現可能だが、今回提示したような用途には向いていないようだ。あくまで「元々分離されたもの」を埋め込むのに使うべき?例えばSNSシェアボタンなど)。
そのようにしたい場合、現在ではおおむね2種類の方法のどちらかで解決している。
-
サーバサイドインクルード(SSI; Server-Side Include)
-
WebサーバがあらかじめHTMLを結合した上でクライアントへ送信する。つまりWebサーバの機能。
-
Webフレームワークが提供しているテンプレートエンジンの機能もサーバサイドという意味ではこちらか。
-
-
JavaScriptでリクエストを投げ、その結果を結合する。
ただし、将来的には上記の話は正しくない。 HTML Imports という仕様が実装されればHTML自体がインクルード機能を持つようになるらしい(…という話だったが、実装は取りやめになる方向?)。 現状はChromeのみ実装の模様(参考)。
WebComponents界隈の用語について
WebComponents
HTML仕様の一部。(※おそらくこれは正しい表現ではない)
ブラウザ上で動作するUI(GUI)について、コンポーネント化できるようにする仕様の集合体。 HTML importsもWebComponentsの一部。
webcomponents.js
WebComponentsを様々なブラウザ(これらはそれぞれ実装が異なる)で動作するようにするライブラリの名前。 単なる1ライブラリの名前に仕様名を冠するのはどうなの…?まぎらわしい。 ただ提供ドメイン(webcomponents.org)から想像するに、実質上のWebComponents標準ライブラリなのだろう。
ちなみにこういったブラウザ間の差異を吸収してどのブラウザでも同じような機能をできるようにする実装のことをJS界隈ではpolyfillと呼ぶ。
polymer
歴史的な前後関係を置いておくと、一言で言えば webcomponents.js のラッパー+便利機能が付いたライブラリ。
Googleの方が書かれた解説がわかりやすい(ただし古いので無くなったものもあるようだ)。 文中のplatform.jsが現在のwebcomponents.js。
JavaScript
<プロダクト名>.js(例えばVue.jsとか) の .js の意味
単にJavaScript向けプロダクトという意味の符牒。別に1ファイルから成るとかいう意味ではない。
Java向けプロダクトである Log4J や Twitter4J の '''4J''' と同じ意味合い。
WebComponents / Polymer
Polymer Elements の名前
旧来 core-xxx
と呼んでいたものはv1かv2で iron-xxx
という名前に変わった。
Polymer2.0はtype-extensionをサポートしない
https://www.youtube.com/watch?v=qzh56Ja1eaw&t=3h46m35s で説明していた頃(v0.x)には存在していたようだが、現在はない。 ここで説明している
<input type="text" is="core-input" value="{{text}}">
は、
<iron-input>
<input type="text" value="{{text}}">
</iron-input>
と書くようだ [4]。
Bower
Bower自身がコミュニティからもはやdeprecatedとみなされている。 新規プロジェクトで仕様すべきでは無さそう。
bower install
bower install PolymerElements/iron-list
としたときの引数 PolymerElements/iron-list
はgithub.comのリポジトリ名の模様。
例えばこの例の場合だと https://github.com/PolymerElements/iron-list 。