スクリプト (Web)

[9] Web におけるスクリプト (script) は、 Webブラウザーで実行されるプログラム片です。スクリプトには古典スクリプトとモジュールスクリプトがあります。

仕様書

分類

[118] スクリプトには、古典スクリプト (classic script) とモジュールスクリプトがあります >>11。

[159] JavaScript では両者をそれぞれスクリプトとモジュールと呼んでいます >>158。 HTML の用語 (>>118) は、どちらも script 要素を通じて利用することによります >>158。

[163] script 要素はスクリプトの型 (the script's type) を持ちます。初期状態では未設定です。値は classic や module です。 >>162

<script type> も参照。

[99] WorkerGlobalScope には型 (type) があり、その値は classic か module のいずれかです。 >>98 それぞれ古典スクリプトとモジュールスクリプトを表します。

[25] サービスワーカーは、型 (type) を持ちます。その値は classic か module のいずれかです。初期値は classic です。 >>24 それぞれ古典スクリプトとモジュールスクリプトを表します。

[34] ジョブは、ワーカー型 (worker type) を持ちます >>33。その値は classic か module のいずれかです >>33。

[155] ワーカーの作成時には、 WorkerOptions 辞書の type メンバー >>100 や ServiceWorkerOptions 辞書の type メンバー >>32 の値により、古典スクリプトかワーカースクリプトのいずれかを指定できます。値は WorkerType >>100, >>32、すなわち classic か module のいずれか >>156 です。 type 省略時の既定値は classic です >>100, >>32。

[160] 古典スクリプトとモジュールスクリプト

js: JavaScript 用語
html: HTML 用語
script: script 要素
script type: スクリプトの型
workertype: WorkerType
worker: Worker
sharedworker: SharedWorker
serviceworker: ServiceWorker
currentScript: document.currentScript

html: 古典スクリプト
script: <script></script>
js: スクリプト
script type: classic
workertype: classic
worker: new Worker (..., {})
sharedworker: new SharedWorker (..., {})
currentScript: ○
serviceworker: navigator.serviceWorker.register (..., {type: "classic"})

html: モジュールスクリプト
js: モジュール
workertype: module
script: <script type=module></script>
script type: module
worker: new Worker (..., {type: "module"})
sharedworker: new SharedWorker (..., {type: "module"})
currentScript: ×
serviceworker: navigator.serviceWorker.register (..., {type: "module"})

状態

[12] スクリプト (script) >>11 は、次の状態を持ちます。

[83] スクリプトの持つ状態

[17] 設定群オブジェクト (settings object): スクリプト設定群オブジェクト。同じ文脈の他のスクリプトと共有している設定諸々です。 >>11 [18] 強い参照です >>64。
かつてはスクリプトの関連する設定群オブジェクト (relevant settings object for a script) とも呼ばれました >>11。
記録 (record): 古典スクリプトの場合はスクリプト記録、モジュールスクリプトの場合はソーステキストモジュール記録。あるいは構文解析誤りが値を持つ場合、 null。 >>11
構文解析誤り (parse error): JavaScript値。 >>11
再び投げるエラー (error to rethrow): JavaScript値。 >>11
基底URL: モジュール指定子を解決する時に使う基底URLです。外部スクリプトではスクリプトを取得した URL で、文書中のスクリプトでは文書基底URLです。 >>11
fetchオプション群: スクリプトfetchオプション群 >>11。

[120] 古典スクリプトは次の状態をも持ちます。

[15] エラーミュート (muted errors) フラグ: 設定されている場合には、このスクリプトのエラーにはエラー情報を提供しません。 >>11 [16] 起源が異なるスクリプトについてのエラーから私的な情報が流出する虞があるので、これを抑制するために使います。 >>11
元の資源の絶対URL: エラーの報告で使われます。

ソーステキスト (source text): JavaScript Script として評価されることになる、実行可能なコードのブロックを含む文字列 >>11。更新時にバイト列として比較されることがあります。記録に統合されました。

[122] モジュールスクリプトは、次の状態をも持ちます。

[37] モジュールスクリプトの持つ状態

状態: スクリプトの読み込みの状態を表します。
モジュール記録: 記録に統合されました。
実現値化前エラー (pre-instantiation error): スクリプトの読み込みの失敗を説明する値です。構文解析誤りに統合されました。
credentials mode: 輸入されたモジュールを fetch するのに使う credentials mode です >>11。 fetchオプション群に統合されました。
暗号学的nonce: モジュールスクリプトのfetchの際の nonce の検査に使う文字列です。 fetchオプション群に統合されました。
構文解析器状態: モジュールスクリプトのfetchの際の構文解析器メタデータとして使う値です。 fetchオプション群に統合されました。
エラーである
エラー
実現値化されている

[26] サービスワーカーは、スクリプト資源 (script resource) を持ちます。値はスクリプトまたは null です。初期値は null です。 >>30

[31] スクリプト資源は、 (null でないときに) 次の状態を持ちます。

has ever been evaluated flag: 初期値は未設定。 >>30 サービスワーカーを走らせる処理で利用されます。
HTTPS状態: サービスワーカーを走らせる処理で利用されます。
参照元ポリシー: サービスワーカーを走らせる処理で利用されます。

[161] スクリプトは、次のような一連の処理によって実行されます。

script 要素の挿入またはワーカー構築子の呼び出し
fetch (外部スクリプトの場合)
作成
実行

fetch

[157] スクリプトのfetchも参照。

生成

[10] スクリプトは次の方法で生成することができます。

[69] スクリプトの作成手段

[27] イベントハンドラー (getting the current value of the event handler) HTML Standard も以前はスクリプトを使っていましたが、現在はスクリプトではなく、単なる JavaScript の Function として定義されています。

[40] 仕様書が存在しませんが、歴史的には次のものもありました。

XBL1 (Gecko のみ)
XUL (Gecko のみ)
HTC (IE のみ)
expression() (IE のみ)

[66] この他に、ブラウザー拡張や WebDriver などによってスクリプトが注入されることもあり得ます。 (それがここでいうスクリプトなのかどうかは謎です。それぞれのアーキテクチャ次第で動作が異なるかもしれません。)

[65] eval や文字列引数の Function は、ここでいうスクリプトを作るものではありません。

[67] Webブラウザーが実行するスクリプトであっても、ここでいうスクリプトとは処理方法が異なるものもあります。例えば PAC の JavaScript はまったく異なる方法と環境で実行されます。

[124] 古典スクリプトの作成 (create a classic script) は、 ソーステキスト、 設定群、 エラーミュートフラグ (既定値は偽)、 オプション群、 基底URLについて、次のようにします >>38。

[71] スクリプトを、新しい古典スクリプトに設定します。
[68] 古典スクリプト
設定群オブジェクト
設定群
エラーミュートフラグ
エラーミュートフラグ
構文解析エラー
null
再び投げるエラー
null
基底URL
基底URL
fetchオプション群
オプション群
[130] 設定群の有責閲覧文脈のスクリプトが無効の場合、
1. [131] ソーステキストを、空文字列に設定します。
[63] 結果は、ソーステキスト、 設定群のRealm、 スクリプトについて ParseScript を実行した結果に設定します。
[76] 結果がエラーのリストの場合、
1. [77] スクリプトの構文解析エラーを、 結果 [ 0 ] に設定します。
2. [94] スクリプトの再び投げるエラーを、 結果 [ 0 ] に設定します。
[78] それ以外の場合、
1. [79] スクリプトの記録を、結果に設定します。
[80] スクリプトを返します。

[127] モジュールスクリプトの作成 (create a module script) は、 ソーステキスト、 設定群、 スクリプト基底URL、 オプション群について次のようにしなければなりません >>38。

[129] スクリプトを、新しいモジュールスクリプトに設定します。
[48] モジュールスクリプト
モジュール記録
null
設定群オブジェクト
設定群
構文解析エラー
null
再び投げるエラー
null
基底URL
スクリプト基底URL
fetchオプション群
オプション群
[134] 設定群の有責閲覧文脈のスクリプトが無効の場合、
1. [135] ソーステキストを、空文字列に設定します。
[139] 結果を、 ParseModule(ソーステキスト, 設定群の Realm, スクリプト) に設定します。
[140] 結果がエラーのリストの場合、
1. [141] スクリプトの構文解析エラーを、 結果 [ 0 ] に設定します。
[143] それ以外の場合、
1. [49] 記録の RequestedModules の各被要求について、順に、
  1. [52] URL を、 スクリプトの基底URL と被要求についてモジュール指定子を解決した結果に設定します。
  2. [53] URL が失敗の場合、
    1. [54] エラーを、新しい TypeError に設定します。
    2. [55] スクリプトとエラーについて、実現値化前エラーを設定します。
2. [88] スクリプトのモジュール記録を、結果に設定します。
[147] スクリプトを返します。

実行

[23] スクリプトの実行を参照。

ごみ収集

[20] スクリプトは、イベントハンドラーとして用いられるものを除けば >>10 のいずれもその場で作られ、実行され、スクリプトへの参照は残らないので、実行が終わり次第ごみ収集されることになります。

[21] イベントハンドラーについては作られた後何度も実行され得るので、他のイベントハンドラーに置き換えられるなり、 EventTarget もろともごみ収集されるなりするまで、ごみ収集されずに残ることになります。

マーク付けの適合性との関係

本項は古くなっています。

[5] HTML文書は、 script の処理の前後いずれにおいても、 HTML DTD に適合しなければなりません。 HTML4 18.2.4

[4] 仕様書:

HTML 4
- 18.2.4 Dynamic modification of documents <IW:HTML4:"interact/scripts.html#idx-document">

[6] HTML 4 の >>5 の規定はスクリプトが生成する HTML 文書片の適合性に関する議論でしばしば引用されますが、時期や内容からしても、 HTML 4 はおそらく HTML 文書全体にアクセス可能な現在の DOM を想定していません。現実の Webブラウザの処理モデルとも一致していませんし、それほど価値がある引用だとは思えません。

並行性・並列性

[57] 著者から観測可能な範囲において、複数のスクリプトが同時に実行される(ように見える)ことはありません。スクリプトの著者は、マルチスレッドのプログラミングのように複雑な排他制御などを考える必要はありません。

[58] showModalDialog のようにタスクが途中で中断され、後に再開される場合など、特殊な場合においてスクリプトが複数同時に動作するように思えることがありますが、ある時点で処理を進められる状態にあるスクリプトは必ず1つだけです。

[59] ワーカーや異なる起源のスクリプトなど、 postMessage などによってのみ情報伝達が可能なスクリプト同士は、複数同時に動作している可能性がありますが、本当に複数同時に実行されているのか、順番に実行されているのか直接的に知る方法はありませんし、互いのデータに直接的にアクセスする手段もありません。

[60] 詳しくはイベントループの項を参照してください。

歴史

HTML4

[3] (HTML の) クライアント側スクリプト (script) とは、 HTML 文書に添えられた、あるいは HTML 文書中に埋込まれたプログラムです。このプログラムは文書が読込まれた時、あるいは連結が活性化された時などに、クライアントの機械上で実行されます。

[125] HTML 4 18.1 Introduction to scripts <http://www.w3.org/TR/html4/interact/scripts.html#idx-script> より

[128] HTML4 時代には、スクリプトを HTML に埋め込む方法は定義されましたが、その具体的な処理方法は明確にされないままでした。 W3C は以後数年間にわたってこの状態を放置してきました。

[1] DynamicScripting <http://www.interq.or.jp/student/exeal/dss/> JavaScript 系, VBScript, DOM, WSH などについて。著者は mozilla.gr.jp の和訳プロジェクトに参加している人だそうです。 W3C などの仕様もちゃんと参照していますし、内容は信頼できます。

HTML5

[148] HTML5 は歴史上初めてスクリプトの詳細な処理モデルを明文化しました。更に script 要素の async 属性やワーカーなどの新機能を導入しました。

[7] Code defined for one document called after that document is no longer the one being displayed (Ian Hickson <ian@...> 著, 2008-12-23 03:41:08 +09:00 版) <http://permalink.gmane.org/gmane.org.w3c.whatwg.discuss/17268>

[8] IRC logs: freenode / #whatwg / 20090325 (2009-05-16 17:57:49 +09:00 版) <http://krijnhoetmer.nl/irc-logs/whatwg/20090325>

SVG におけるスクリプト実行モデル (と HTML のスクリプト実行モデル) に関する議論です。

[61] The "initialization" steps for Web browsers ( (2014-07-22 08:29:04 +09:00 版)) <https://mail.mozilla.org/pipermail/es-discuss/2014-July/038399.html>

[62] >>2 でスクリプトのスクリプト設定群オブジェクトは環境設定群オブジェクトに改称されています。

環境設定群オブジェクトも参照。

[2] Web Applications 1.0 r8834 Rename script settings objects to environment settings objects to make reuse saner. (2014-10-11 08:43:00 +09:00 版) <https://html5.org/r/8834>

[119] 2016年1月のモジュール導入までは、古典スクリプトがスクリプトと呼ばれていました >>117。

コード入口点

[121] 古典スクリプトのソーステキストは、当時はスクリプトのコード入口点として定義されていました。

[13] スクリプトのコード入口点 (code entry-point) は、実行可能コードのブロックを含むものとして評価されることとなる文字列、または JavaScript関数オブジェクトのいずれかです。 >>11

[72] かつては次のように一般的に規定されていましたが、 JavaScript 以外の言語への対応は削除されました。

[73] スクリプトが他のスクリプトや利用者エージェントに晒す、実行可能コードのブロック。一般的にはコード入口点に対応するコードはスクリプトが構文解析された直後に実行されますが、イベントハンドラーの場合は呼び出される度に実行されます。
[14] JavaScript の script ブロックの場合には、大域コードの実行文脈に対応します。

[74] コード入口点は、イベントハンドラーの場合関数のこともありますが、多くの場合は文字列です。文字列を JavaScript として評価した結果、正しい JavaScript のスクリプトであることもあれば、構文エラーなどが含まれる場合もあります。

[19] コード入口点は、実行すると値を返したり、例外を投げたりします。返された値は、呼び出し元で使われることがあります。例外は、呼び出し元で適宜処理されます。

スクリプトの作成

[123] モジュール導入以前は、古典スクリプトの作成と実行に相当するのはスクリプトの作成という手順でした。

[39] スクリプトの作成 (create a script) >>38は、ワーカーとイベントハンドラーを除くスクリプトを作り、実行する時に呼ばれる手順です。次の引数があります。

スクリプトのソース: スクリプトのソースコードとして使われる文字列。
スクリプトのソースの URL
環境設定群オブジェクト: 環境設定群オブジェクト。
エラーミュート (muted errors) フラグ
エラーを再度投げる (rethrow errors) フラグ
閲覧文脈

[105] 次のようにしなければなりません >>38。

[41] 閲覧文脈でスクリプトが無効なら、ここで停止します。
[46] スクリプトを、新しいスクリプトに設定します。
スクリプト
[47] コード入口点
スクリプトのソース
[44] 設定群オブジェクト
環境設定群オブジェクト
エラーミュートフラグ
エラーミュートフラグ
[42] スクリプトのコード入口点に飛ぶ処理を実行します。 エラーを再度投げるフラグを引き継ぎます。