MathJaxをデバッグしてJavaScriptの理解を深める ページ2

概要

　MathJaxをデバッグしてJavaScriptの理解を深めるの続きです。

e.MathJax.config.startup.ready() { t.defaultReady d() }

　d()は以下のような関数です。

function d() {
  var e, r;
  t.input && t.output && m();
  var n = t.output ? t.output.name.toLowerCase() : "";
  try {
    for(var i = o(t.input), s = i.next(); !s.done; s = i.next()) {
      var a = s.value,
        l = a.name.toLowerCase();
      g(l, a), 
      b(l, a), 
      t.output && y(l, n, a)
    }
  } catch(t) {
    e = {
      error: t
    }
  } finally {
    try {
      s && !s.done && (r = i.return) && r.call(i)
    } finally {
      if(e) throw e.error
    }
  }
}

　n = 'chtml'(CHTML) で l = 'tex'(TeX) → 'mathml'(MathML)という値。a は input の値。 output 系の l を使った g や b という関数。 output、input両方の l n を使った y という関数を実行する。いずれも a の input 値 を引数にしている。

　g はこんな関数。

function g(r, n) {
  var o = e.MathJax._.core.MathItem.STATE;

  e.MathJax[r + "2mml"] = function(e, r) {
    return void 0 === r && (r = {}), 
           r.end = o.CONVERT, 
           r.format = n.name, /* TeX → MathML */
           h(t.document.convert(e, r))
  }, 
  e.MathJax[r + "2mmlPromise"] = function(e, r) {
    return void 0 === r && (r = {}), 
           r.end = o.CONVERT, 
           r.format = n.name, /* TeX → MathML */ 
           l.handleRetriesFor((function() {
             return h(t.document.convert(e, r))
           }))
  }
}

　で、e.MathJax._.core.MathItem.STATE は、以下のような値。 o に取り込まれます。第一引数 r は Input の 'tex'、第二引数 n は Input 系のオブジェクト n.name は 'TeX' のような値です。

{
  UNPROCESSED: 0,
  FINDMATH: 10,
  COMPILED: 20,
  CONVERT: 100,
  METRICS: 110,
  RERENDER: 125,
  TYPESET: 150,
  INSERTED: 200,
  LAST: 10000,
  CONTEXT_MENU: 170,
  ASSISTIVEMML: 153,
}

　e.MathJax['tex2mml'] と e.MathJax['tex2mmlPromise'] に 関数を格納するのがこの g 関数の役割のようです。o.CONVERT: 100 が r.end に格納される部分がありますが、どのように使われるのかは、この時点ではあまりわかりません。

　次に b が呼ばれます。以下のような関数。

b(t, r) {
  e.MathJax[t + "Reset"] = function() {
    for(var t = [], e = 0; e < arguments.length; e++) 
      t[e] = arguments[e];
    return r.reset.apply(r, s([], i(t), !1))
  }
}

　e.MathJax['texReset'] に関数を格納するのがこの b 関数の役割です。格納した関数がどのように使われるかは、やはりこの時点ではわかりません。 引数の t と 取り込んだ関数の t は別物です。呼び出した時の引数を順次格納していくのに使われているようです。Reset とつくくらいですから、きっと呼び出されたら初期の表示状態にもどるんでしょう。おそらく。

　や、でも、やっぱり関数名が1文字だったり変数名が1文字なのは、理解に苦しむ。何がしたいのか、まったく全貌が見えてこない。リセットする関数が b で変換する関数っぽいのが g とな。何も想像できない。これメンテナンスできる人いるの？ってぐらいすごい。でも更新されてたりするってことはわかってる人いるんだろうな。難しい。この世界にこのプログラムを読み解ける人がいるってことが信じられない。スーパープログラマ中のスーパーだな。この優秀な頭脳が世界にはいくつも存在していて、回ってるのか。恐るべし。

　続いて y です。以下のような関数です。r が tex、n が r が chtml

y(r, n, o) {
  var i = r + "2" + n; /* tex2chtml */
  e.MathJax[i] = function(e, r) { /* e.MathJax['tex2chtml'] */
    return void 0 === r && (r = {}), 
           r.format = o.name, /* TeX → MathML */
           t.document.convert(e, r)
  }, 
  e.MathJax[i + "Promise"] = function(e, r) { /* e.MathJax['tex2chtmlPromise'] */
    return void 0 === r && (r = {}), 
           r.format = o.name, /* TeX → MathML */
           l.handleRetriesFor((function() {
             return t.document.convert(e, r)
           }))
  }, 
  e.MathJax[n + "Stylesheet"] = function() { /* e.MathJax['tex2chtmlStylesheet'] */
    return t.output.styleSheet(t.document)
  }, 
  "getMetricsFor" in t.output && (e.MathJax.getMetricsFor = function(e, r) {
    return t.output.getMetricsFor(e, r)
  })
}

　基本的に関数を定義することが多い関数だったなぁ。何がしたいのかが全くつかめず、テンションダウン。うまいな。作ってる人。おいかけてる人に対してのメッセージを感じる。いなされてるな。サッカーのイメージだ。凄すぎて、ぜんぜんボールが取れない。

　

　

　

　

　

　

　 　

__webpack_modules__[265].call(r.exports, r, r.exports, __webpack_require__)

			265: function(t, e, r) {
				var n, o = this && this.__extends || (n = function(t, e) {
						return n = Object.setPrototypeOf || {
							__proto__: []
						}
						instanceof Array && function(t, e) {
							t.__proto__ = e
						} || function(t, e) {
							for(var r in e) Object.prototype.hasOwnProperty.call(e, r) && (t[r] = e[r])
						}, n(t, e)
					}, function(t, e) {
						if("function" != typeof e && null !== e) throw new TypeError("Class extends value " + String(e) + " is not a constructor or null");

						function r() {
							this.constructor = t
						}
						n(t, e), t.prototype = null === e ? Object.create(e) : (r.prototype = e.prototype, new r)
					}),
					i = this && this.__values || function(t) {
						var e = "function" == typeof Symbol && Symbol.iterator,
							r = e && t[e],
							n = 0;
						if(r) return r.call(t);
						if(t && "number" == typeof t.length) return {
							next: function() {
								return t && n >= t.length && (t = void 0), {
									value: t && t[n++],
									done: !t
								}
							}
						};
						throw new TypeError(e ? "Object is not iterable." : "Symbol.iterator is not defined.")
					},
					s = this && this.__read || function(t, e) {
						var r = "function" == typeof Symbol && t[Symbol.iterator];
						if(!r) return t;
						var n, o, i = r.call(t),
							s = [];
						try {
							for(;
								(void 0 === e || e-- > 0) && !(n = i.next()).done;) s.push(n.value)
						} catch(t) {
							o = {
								error: t
							}
						} finally {
							try {
								n && !n.done && (r = i.return) && r.call(i)
							} finally {
								if(o) throw o.error
							}
						}
						return s
					},
					a = this && this.__spreadArray || function(t, e, r) {
						if(r || 2 === arguments.length)
							for(var n, o = 0, i = e.length; o < i; o++) !n && o in e || (n || (n = Array.prototype.slice.call(e, 0, o)), n[o] = e[o]);
						return t.concat(n || Array.prototype.slice.call(e))
					};
				Object.defineProperty(e, "__esModule", {
					value: !0
				}), e.Package = e.PackageError = void 0;
				var l = r(235),
					c = function(t) {
						function e(e, r) {
							var n = t.call(this, e) || this;
							return n.package = r, n
						}
						return o(e, t), e
					}(Error);
				e.PackageError = c;
				var u = function() {
					function t(e, r) {
						void 0 === r && (r = !1), this.isLoaded = !1, this.isLoading = !1, this.hasFailed = !1, this.dependents = [], this.dependencies = [], this.dependencyCount = 0, this.provided = [], this.name = e, this.noLoad = r, t.packages.set(e, this), this.promise = this.makePromise(this.makeDependencies())
					}
					return Object.defineProperty(t.prototype, "canLoad", {
						get: function() {
							return 0 === this.dependencyCount && !this.noLoad && !this.isLoading && !this.hasFailed
						},
						enumerable: !1,
						configurable: !0
					}), t.resolvePath = function(t, e) {
						void 0 === e && (e = !0);
						var r = {
							name: t,
							original: t,
							addExtension: e
						};
						return l.Loader.pathFilters.execute(r), r.name
					}, t.loadAll = function() {
						var t, e;
						try {
							for(var r = i(this.packages.values()), n = r.next(); !n.done; n = r.next()) {
								var o = n.value;
								o.canLoad && o.load()
							}
						} catch(e) {
							t = {
								error: e
							}
						} finally {
							try {
								n && !n.done && (e = r.return) && e.call(r)
							} finally {
								if(t) throw t.error
							}
						}
					}, t.prototype.makeDependencies = function() {
						var e, r, n = [],
							o = t.packages,
							c = this.noLoad,
							u = this.name,
							p = [];
						l.CONFIG.dependencies.hasOwnProperty(u) ? p.push.apply(p, a([], s(l.CONFIG.dependencies[u]), !1)) : "core" !== u && p.push("core");
						try {
							for(var h = i(p), f = h.next(); !f.done; f = h.next()) {
								var d = f.value,
									m = o.get(d) || new t(d, c);
								this.dependencies.indexOf(m) < 0 && (m.addDependent(this, c), this.dependencies.push(m), m.isLoaded || (this.dependencyCount++, n.push(m.promise)))
							}
						} catch(t) {
							e = {
								error: t
							}
						} finally {
							try {
								f && !f.done && (r = h.return) && r.call(h)
							} finally {
								if(e) throw e.error
							}
						}
						return n
					}, t.prototype.makePromise = function(t) {
						var e = this,
							r = new Promise((function(t, r) {
								e.resolve = t, e.reject = r
							})),
							n = l.CONFIG[this.name] || {};
						return n.ready && (r = r.then((function(t) {
							return n.ready(e.name)
						}))), t.length && (t.push(r), r = Promise.all(t).then((function(t) {
							return t.join(", ")
						}))), n.failed && r.catch((function(t) {
							return n.failed(new c(t, e.name))
						})), r
					}, t.prototype.load = function() {
						if(!this.isLoaded && !this.isLoading && !this.noLoad) {
							this.isLoading = !0;
							var e = t.resolvePath(this.name);
							l.CONFIG.require ? this.loadCustom(e) : this.loadScript(e)
						}
					}, t.prototype.loadCustom = function(t) {
						var e = this;
						try {
							var r = l.CONFIG.require(t);
							r instanceof Promise ? r.then((function() {
								return e.checkLoad()
							})).catch((function(r) {
								return e.failed("Can't load \"" + t + '"\n' + r.message.trim())
							})) : this.checkLoad()
						} catch(t) {
							this.failed(t.message)
						}
					}, t.prototype.loadScript = function(t) {
						var e = this,
							r = document.createElement("script");
						r.src = t, r.charset = "UTF-8", r.onload = function(t) {
							return e.checkLoad()
						}, r.onerror = function(r) {
							return e.failed("Can't load \"" + t + '"')
						}, document.head.appendChild(r)
					}, t.prototype.loaded = function() {
						var t, e, r, n;
						this.isLoaded = !0, this.isLoading = !1;
						try {
							for(var o = i(this.dependents), s = o.next(); !s.done; s = o.next()) {
								s.value.requirementSatisfied()
							}
						} catch(e) {
							t = {
								error: e
							}
						} finally {
							try {
								s && !s.done && (e = o.return) && e.call(o)
							} finally {
								if(t) throw t.error
							}
						}
						try {
							for(var a = i(this.provided), l = a.next(); !l.done; l = a.next()) {
								l.value.loaded()
							}
						} catch(t) {
							r = {
								error: t
							}
						} finally {
							try {
								l && !l.done && (n = a.return) && n.call(a)
							} finally {
								if(r) throw r.error
							}
						}
						this.resolve(this.name)
					}, t.prototype.failed = function(t) {
						this.hasFailed = !0, this.isLoading = !1, this.reject(new c(t, this.name))
					}, t.prototype.checkLoad = function() {
						var t = this;
						((l.CONFIG[this.name] || {}).checkReady || function() {
							return Promise.resolve()
						})().then((function() {
							return t.loaded()
						})).catch((function(e) {
							return t.failed(e)
						}))
					}, t.prototype.requirementSatisfied = function() {
						this.dependencyCount && (this.dependencyCount--, this.canLoad && this.load())
					}, t.prototype.provides = function(e) {
						var r, n;
						void 0 === e && (e = []);
						try {
							for(var o = i(e), s = o.next(); !s.done; s = o.next()) {
								var a = s.value,
									c = t.packages.get(a);
								c || (l.CONFIG.dependencies[a] || (l.CONFIG.dependencies[a] = []), l.CONFIG.dependencies[a].push(a), (c = new t(a, !0)).isLoading = !0), this.provided.push(c)
							}
						} catch(t) {
							r = {
								error: t
							}
						} finally {
							try {
								s && !s.done && (n = o.return) && n.call(o)
							} finally {
								if(r) throw r.error
							}
						}
					}, t.prototype.addDependent = function(t, e) {
						this.dependents.push(t), e || this.checkNoLoad()
					}, t.prototype.checkNoLoad = function() {
						var t, e;
						if(this.noLoad) {
							this.noLoad = !1;
							try {
								for(var r = i(this.dependencies), n = r.next(); !n.done; n = r.next()) {
									n.value.checkNoLoad()
								}
							} catch(e) {
								t = {
									error: e
								}
							} finally {
								try {
									n && !n.done && (e = r.return) && e.call(r)
								} finally {
									if(t) throw t.error
								}
							}
						}
					}, t.packages = new Map, t
				}();
				e.Package = u
			},

			2388: function(t, e, r) {
				var n = this && this.__assign || function() {
						return n = Object.assign || function(t) {
							for(var e, r = 1, n = arguments.length; r < n; r++)
								for(var o in e = arguments[r]) Object.prototype.hasOwnProperty.call(e, o) && (t[o] = e[o]);
							return t
						}, n.apply(this, arguments)
					},
					o = this && this.__values || function(t) {
						var e = "function" == typeof Symbol && Symbol.iterator,
							r = e && t[e],
							n = 0;
						if(r) return r.call(t);
						if(t && "number" == typeof t.length) return {
							next: function() {
								return t && n >= t.length && (t = void 0), {
									value: t && t[n++],
									done: !t
								}
							}
						};
						throw new TypeError(e ? "Object is not iterable." : "Symbol.iterator is not defined.")
					},
					i = this && this.__read || function(t, e) {
						var r = "function" == typeof Symbol && t[Symbol.iterator];
						if(!r) return t;
						var n, o, i = r.call(t),
							s = [];
						try {
							for(;
								(void 0 === e || e-- > 0) && !(n = i.next()).done;) s.push(n.value)
						} catch(t) {
							o = {
								error: t
							}
						} finally {
							try {
								n && !n.done && (r = i.return) && r.call(i)
							} finally {
								if(o) throw o.error
							}
						}
						return s
					},
					s = this && this.__spreadArray || function(t, e, r) {
						if(r || 2 === arguments.length)
							for(var n, o = 0, i = e.length; o < i; o++) !n && o in e || (n || (n = Array.prototype.slice.call(e, 0, o)), n[o] = e[o]);
						return t.concat(n || Array.prototype.slice.call(e))
					};
				Object.defineProperty(e, "__esModule", {
					value: !0
				}), e.CONFIG = e.MathJax = e.Startup = void 0;
				var a, l = r(9515),
					c = r(8666),
					u = r(7233);
				! function(t) {
					var a, l, u = new c.PrioritizedList;

					function h(e) {
						return a.visitTree(e, t.document)
					}

					function f() {
						a = new e.MathJax._.core.MmlTree.SerializedMmlVisitor.SerializedMmlVisitor, l = e.MathJax._.mathjax.mathjax, t.input = v(), t.output = _(), t.adaptor = S(), t.handler && l.handlers.unregister(t.handler), t.handler = M(), t.handler && (l.handlers.register(t.handler), t.document = O())
					}

					function d() {
						var e, r;
						t.input && t.output && m();
						var n = t.output ? t.output.name.toLowerCase() : "";
						try {
							for(var i = o(t.input), s = i.next(); !s.done; s = i.next()) {
								var a = s.value,
									l = a.name.toLowerCase();
								g(l, a), b(l, a), t.output && y(l, n, a)
							}
						} catch(t) {
							e = {
								error: t
							}
						} finally {
							try {
								s && !s.done && (r = i.return) && r.call(i)
							} finally {
								if(e) throw e.error
							}
						}
					}

					function m() {
						e.MathJax.typeset = function(e) {
							void 0 === e && (e = null), t.document.options.elements = e, t.document.reset(), t.document.render()
						}, e.MathJax.typesetPromise = function(e) {
							return void 0 === e && (e = null), t.document.options.elements = e, t.document.reset(), l.handleRetriesFor((function() {
								t.document.render()
							}))
						}, e.MathJax.typesetClear = function(e) {
							void 0 === e && (e = null), e ? t.document.clearMathItemsWithin(e) : t.document.clear()
						}
					}

					function y(r, n, o) {
						var i = r + "2" + n;
						e.MathJax[i] = function(e, r) {
							return void 0 === r && (r = {}), r.format = o.name, t.document.convert(e, r)
						}, e.MathJax[i + "Promise"] = function(e, r) {
							return void 0 === r && (r = {}), r.format = o.name, l.handleRetriesFor((function() {
								return t.document.convert(e, r)
							}))
						}, e.MathJax[n + "Stylesheet"] = function() {
							return t.output.styleSheet(t.document)
						}, "getMetricsFor" in t.output && (e.MathJax.getMetricsFor = function(e, r) {
							return t.output.getMetricsFor(e, r)
						})
					}

					function g(r, n) {
						var o = e.MathJax._.core.MathItem.STATE;
						e.MathJax[r + "2mml"] = function(e, r) {
							return void 0 === r && (r = {}), r.end = o.CONVERT, r.format = n.name, h(t.document.convert(e, r))
						}, e.MathJax[r + "2mmlPromise"] = function(e, r) {
							return void 0 === r && (r = {}), r.end = o.CONVERT, r.format = n.name, l.handleRetriesFor((function() {
								return h(t.document.convert(e, r))
							}))
						}
					}

					function b(t, r) {
						e.MathJax[t + "Reset"] = function() {
							for(var t = [], e = 0; e < arguments.length; e++) t[e] = arguments[e];
							return r.reset.apply(r, s([], i(t), !1))
						}
					}

					function v() {
						var r, n, i = [];
						try {
							for(var s = o(e.CONFIG.input), a = s.next(); !a.done; a = s.next()) {
								var l = a.value,
									c = t.constructors[l];
								if(!c) throw Error('Input Jax "' + l + '" is not defined (has it been loaded?)');
								i.push(new c(e.MathJax.config[l]))
							}
						} catch(t) {
							r = {
								error: t
							}
						} finally {
							try {
								a && !a.done && (n = s.return) && n.call(s)
							} finally {
								if(r) throw r.error
							}
						}
						return i
					}

					function _() {
						var r = e.CONFIG.output;
						if(!r) return null;
						var n = t.constructors[r];
						if(!n) throw Error('Output Jax "' + r + '" is not defined (has it been loaded?)');
						return new n(e.MathJax.config[r])
					}

					function S() {
						var r = e.CONFIG.adaptor;
						if(!r || "none" === r) return null;
						var n = t.constructors[r];
						if(!n) throw Error('DOMAdaptor "' + r + '" is not defined (has it been loaded?)');
						return n(e.MathJax.config[r])
					}

					function M() {
						var r, n, i = e.CONFIG.handler;
						if(!i || "none" === i || !t.adaptor) return null;
						var s = t.constructors[i];
						if(!s) throw Error('Handler "' + i + '" is not defined (has it been loaded?)');
						var a = new s(t.adaptor, 5);
						try {
							for(var l = o(u), c = l.next(); !c.done; c = l.next()) {
								a = c.value.item(a)
							}
						} catch(t) {
							r = {
								error: t
							}
						} finally {
							try {
								c && !c.done && (n = l.return) && n.call(l)
							} finally {
								if(r) throw r.error
							}
						}
						return a
					}

					function O(r) {
						return void 0 === r && (r = null), l.document(r || e.CONFIG.document, n(n({}, e.MathJax.config.options), {
							InputJax: t.input,
							OutputJax: t.output
						}))
					}
					t.constructors = {}, t.input = [], t.output = null, t.handler = null, t.adaptor = null, t.elements = null, t.document = null, t.promise = new Promise((function(e, r) {
						t.promiseResolve = e, t.promiseReject = r
					})), t.pagePromise = new Promise((function(t, e) {
						var n = r.g.document;
						if(n && n.readyState && "complete" !== n.readyState && "interactive" !== n.readyState) {
							var o = function() {
								return t()
							};
							n.defaultView.addEventListener("load", o, !0), n.defaultView.addEventListener("DOMContentLoaded", o, !0)
						} else t()
					})), t.toMML = h, t.registerConstructor = function(e, r) {
						t.constructors[e] = r
					}, t.useHandler = function(t, r) {
						void 0 === r && (r = !1), e.CONFIG.handler && !r || (e.CONFIG.handler = t)
					}, t.useAdaptor = function(t, r) {
						void 0 === r && (r = !1), e.CONFIG.adaptor && !r || (e.CONFIG.adaptor = t)
					}, t.useInput = function(t, r) {
						void 0 === r && (r = !1), p && !r || e.CONFIG.input.push(t)
					}, t.useOutput = function(t, r) {
						void 0 === r && (r = !1), e.CONFIG.output && !r || (e.CONFIG.output = t)
					}, t.extendHandler = function(t, e) {
						void 0 === e && (e = 10), u.add(t, e)
					}, t.defaultReady = function() {
						f(), d(), t.pagePromise.then((function() {
							return e.CONFIG.pageReady()
						})).then((function() {
							return t.promiseResolve()
						})).catch((function(e) {
							return t.promiseReject(e)
						}))
					}, t.defaultPageReady = function() {
						return e.CONFIG.typeset && e.MathJax.typesetPromise ? e.MathJax.typesetPromise(e.CONFIG.elements) : Promise.resolve()
					}, t.getComponents = f, t.makeMethods = d, t.makeTypesetMethods = m, t.makeOutputMethods = y, t.makeMmlMethods = g, t.makeResetMethod = b, t.getInputJax = v, t.getOutputJax = _, t.getAdaptor = S, t.getHandler = M, t.getDocument = O
				}(a = e.Startup || (e.Startup = {})), e.MathJax = l.MathJax, void 0 === e.MathJax._.startup && ((0, l.combineDefaults)(e.MathJax.config, "startup", {
					input: [],
					output: "",
					handler: null,
					adaptor: null,
					document: "undefined" == typeof document ? "" : document,
					elements: null,
					typeset: !0,
					ready: a.defaultReady.bind(a),
					pageReady: a.defaultPageReady.bind(a)
				}), (0, l.combineWithMathJax)({
					startup: a,
					options: {}
				}), e.MathJax.config.startup.invalidOption && (u.OPTIONS.invalidOption = e.MathJax.config.startup.invalidOption), e.MathJax.config.startup.optionError && (u.OPTIONS.optionError = e.MathJax.config.startup.optionError)), e.CONFIG = e.MathJax.config.startup;
				var p = 0 !== e.CONFIG.input.length
			},