File: object.html

package info (click to toggle)
mathjax 1.1-2
  • links: PTS
  • area: main
  • in suites: wheezy
  • size: 128,884 kB
  • sloc: makefile: 118; python: 21
file content (354 lines) | stat: -rw-r--r-- 28,278 bytes parent folder | download
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    
    <title>The MathJax Object-Oriented Programming Model &mdash; MathJax v1.1 documentation</title>
    <link rel="stylesheet" href="../_static/mj.css" type="text/css" />
    <link rel="stylesheet" href="../_static/pygments.css" type="text/css" />
    <script type="text/javascript">
      var DOCUMENTATION_OPTIONS = {
        URL_ROOT:    '../',
        VERSION:     '1.1',
        COLLAPSE_INDEX: false,
        FILE_SUFFIX: '.html',
        HAS_SOURCE:  true
      };
    </script>
    <script type="text/javascript" src="../_static/jquery.js"></script>
    <script type="text/javascript" src="../_static/underscore.js"></script>
    <script type="text/javascript" src="../_static/doctools.js"></script>
    <!--<script type="text/javascript" src="../../../MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>-->
    <link rel="top" title="MathJax v1.1 documentation" href="../index.html" />
    <link rel="up" title="The MathJax API" href="index.html" />
    <link rel="next" title="Describing HTML snippets" href="../HTML-snippets.html" />
    <link rel="prev" title="The Base Jax Class" href="jax.html" /> 
  </head>
  <body>
    
    <div class="related">
      <h3>Navigation</h3>
      <ul>
        <li class="right" style="margin-right: 10px">
          <a href="../genindex.html" title="General Index"
             accesskey="I">index</a></li>
        <li class="right" >
          <a href="../HTML-snippets.html" title="Describing HTML snippets"
             accesskey="N">next</a> |</li>
        <li class="right" >
          <a href="jax.html" title="The Base Jax Class"
             accesskey="P">previous</a> |</li>
        <li><a href="../index.html">MathJax v1.1 documentation</a> &raquo;</li>
          <li><a href="index.html" accesskey="U">The MathJax API</a> &raquo;</li> 
      </ul>
    </div>  

    <div class="document">
      <div class="documentwrapper">
        <div class="bodywrapper">
          <div class="body">
            
  <div class="section" id="the-mathjax-object-oriented-programming-model">
<span id="api-object"></span><h1>The MathJax Object-Oriented Programming Model<a class="headerlink" href="#the-mathjax-object-oriented-programming-model" title="Permalink to this headline">¶</a></h1>
<p>MathJax uses an object-oriented programming model for its main
components, such as the <cite>Input jax</cite>, <cite>Output jax</cite>, and <cite>Element jax</cite>.
The model is intended to be light-weight and is based on JavaScript&#8217;s
prototype inheritance mechanism.  Object classes are created by making
subclasses of <cite>MathJax.Object</cite> or one of its subclasses, and are
instantiated by calling the object class as you would a function.</p>
<p>For example:</p>
<div class="highlight-javascript"><div class="highlight"><pre><span class="nx">MathJax</span><span class="p">.</span><span class="nb">Object</span><span class="p">.</span><span class="nx">Foo</span> <span class="o">=</span> <span class="nx">MathJax</span><span class="p">.</span><span class="nb">Object</span><span class="p">.</span><span class="nx">Subclass</span><span class="p">({</span>
  <span class="nx">Init</span><span class="o">:</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">x</span><span class="p">)</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">SetX</span><span class="p">(</span><span class="nx">x</span><span class="p">)},</span>
  <span class="nx">getX</span><span class="o">:</span> <span class="kd">function</span> <span class="p">()</span> <span class="p">{</span><span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">x</span><span class="p">},</span>
  <span class="nx">setX</span><span class="o">:</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">x</span><span class="p">)</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">x</span> <span class="o">=</span> <span class="nx">x</span><span class="p">}</span>
<span class="p">});</span>
<span class="kd">var</span> <span class="nx">foo</span> <span class="o">=</span> <span class="nx">MathJax</span><span class="p">.</span><span class="nb">Object</span><span class="p">.</span><span class="nx">Foo</span><span class="p">(</span><span class="s2">&quot;bar&quot;</span><span class="p">);</span>
<span class="nx">foo</span><span class="p">.</span><span class="nx">getX</span><span class="p">();</span>                <span class="c1">// returns &quot;bar&quot;</span>
<span class="nx">foo</span><span class="p">.</span><span class="nx">setX</span><span class="p">(</span><span class="s2">&quot;foobar&quot;</span><span class="p">);</span>
<span class="nx">foo</span><span class="p">.</span><span class="nx">getX</span><span class="p">();</span>                <span class="c1">// returns &quot;foobar&quot;</span>
</pre></div>
</div>
<p>Object classes can have static properties and methods, which are
accessed via the object class variable. E.g.,
<tt class="docutils literal"><span class="pre">MathJax.Object.Foo.SUPER</span></tt> or <tt class="docutils literal"><span class="pre">MathJax.Object.Foo.Augment()</span></tt> for
the object in the example above.  Static values are not inherited by
subclasses.</p>
<div class="section" id="static-properties">
<h2>Static Properties<a class="headerlink" href="#static-properties" title="Permalink to this headline">¶</a></h2>
<dl class="describe">
<dt>
<tt class="descname">SUPER</tt></dt>
<dd><p>Pointer to the super class for this subclass.  (It is a reference to
<cite>MathJax.Object</cite> in the example above.)</p>
</dd></dl>

</div>
<div class="section" id="static-methods">
<h2>Static Methods<a class="headerlink" href="#static-methods" title="Permalink to this headline">¶</a></h2>
<dl class="method">
<dt id="Subclass">
<tt class="descname">Subclass</tt><big>(</big><em>def</em><span class="optional">[</span>, <em>static</em><span class="optional">]</span><big>)</big><a class="headerlink" href="#Subclass" title="Permalink to this definition">¶</a></dt>
<dd><p>Creates a subclass of the given class using the contents of the
<cite>def</cite> object to define new methods and properties of the object
class, and the contents of the optional <cite>static</cite> object to define
new static methods and properties.</p>
<table class="docutils field-list" frame="void" rules="none">
<col class="field-name" />
<col class="field-body" />
<tbody valign="top">
<tr class="field"><th class="field-name">Parameters :</th><td class="field-body"><ul class="first simple">
<li><strong>def</strong> &#8212; object that defines the properties and methods</li>
<li><strong>static</strong> &#8212; object that defines static properties and methods</li>
</ul>
</td>
</tr>
<tr class="field"><th class="field-name">Returns :</th><td class="field-body"><p class="first last">the new object class</p>
</td>
</tr>
</tbody>
</table>
</dd></dl>

<dl class="method">
<dt id="Augment">
<tt class="descname">Augment</tt><big>(</big><em>def</em><span class="optional">[</span>, <em>static</em><span class="optional">]</span><big>)</big><a class="headerlink" href="#Augment" title="Permalink to this definition">¶</a></dt>
<dd><p>Adds new properties and methods to the class prototype.  All
instances of the object already in existence will receive the new
properties and methods automatically.</p>
<table class="docutils field-list" frame="void" rules="none">
<col class="field-name" />
<col class="field-body" />
<tbody valign="top">
<tr class="field"><th class="field-name">Parameters :</th><td class="field-body"><ul class="first simple">
<li><strong>def</strong> &#8212; object that defines the properties and methods</li>
<li><strong>static</strong> &#8212; object that defines static properties and methods</li>
</ul>
</td>
</tr>
<tr class="field"><th class="field-name">Returns :</th><td class="field-body"><p class="first last">the object class itself</p>
</td>
</tr>
</tbody>
</table>
</dd></dl>

</div>
<div class="section" id="properties">
<h2>Properties<a class="headerlink" href="#properties" title="Permalink to this headline">¶</a></h2>
<dl class="describe">
<dt>
<tt class="descname">constructor</tt></dt>
<dd><p>Pointer to the constructor function for this class. E.g.,
<tt class="docutils literal"><span class="pre">foo.constructor</span></tt> would be a reference to <tt class="docutils literal"><span class="pre">MathJax.Object.Foo</span></tt>
in the example above.</p>
</dd></dl>

</div>
<div class="section" id="methods">
<h2>Methods<a class="headerlink" href="#methods" title="Permalink to this headline">¶</a></h2>
<dl class="method">
<dt id="Init">
<tt class="descname">Init</tt><big>(</big><span class="optional">[</span><em>data</em><span class="optional">]</span><big>)</big><a class="headerlink" href="#Init" title="Permalink to this definition">¶</a></dt>
<dd><p>An optional function that is called when an instance of the class
is created.  When called, the <cite>this</cite> variable is set to the newly
instantiated object, and the <cite>data</cite> is whatever was passed to the
object constructor.  For instance, in the example above, the
variable <tt class="docutils literal"><span class="pre">foo</span></tt> is created by calling
<tt class="docutils literal"><span class="pre">MathJax.Object.Foo(&quot;bar&quot;)</span></tt>, which calls the
<tt class="docutils literal"><span class="pre">MathJax.Object.Foo</span></tt> object&#8217;s <a class="reference internal" href="#Init" title="Init"><tt class="xref py py-meth docutils literal"><span class="pre">Init()</span></tt></a> method with <cite>data</cite>
equal to <tt class="docutils literal"><span class="pre">&quot;bar&quot;</span></tt>.  If desired, the <a class="reference internal" href="#Init" title="Init"><tt class="xref py py-meth docutils literal"><span class="pre">Init()</span></tt></a> method can
create a <em>different</em> object, and return that, in which case this
becomes the return value for the object constructor.</p>
<table class="docutils field-list" frame="void" rules="none">
<col class="field-name" />
<col class="field-body" />
<tbody valign="top">
<tr class="field"><th class="field-name">Parameters :</th><td class="field-body"><ul class="first simple">
<li><strong>data</strong> &#8212; the data from the constructor call</li>
</ul>
</td>
</tr>
<tr class="field"><th class="field-name">Returns :</th><td class="field-body"><p class="first last"><tt class="docutils literal"><span class="pre">null</span></tt> or the object to be returned by the constructor</p>
</td>
</tr>
</tbody>
</table>
</dd></dl>

<dl class="method">
<dt id="isa">
<tt class="descname">isa</tt><big>(</big><em>class</em><big>)</big><a class="headerlink" href="#isa" title="Permalink to this definition">¶</a></dt>
<dd><p>Returns <tt class="docutils literal"><span class="pre">true</span></tt> if the object is an instance of the given class,
or of a subclass of the given class, and <tt class="docutils literal"><span class="pre">false</span></tt> otherwise.  So
using the <tt class="docutils literal"><span class="pre">foo</span></tt> value defined above,</p>
<div class="highlight-javascript"><div class="highlight"><pre><span class="nx">foo</span><span class="p">.</span><span class="nx">isa</span><span class="p">(</span><span class="nx">MathJax</span><span class="p">.</span><span class="nb">Object</span><span class="p">);</span>      <span class="c1">// returns true</span>
<span class="nx">foo</span><span class="p">.</span><span class="nx">isa</span><span class="p">(</span><span class="nx">MathJax</span><span class="p">.</span><span class="nb">Object</span><span class="p">.</span><span class="nx">Foo</span><span class="p">);</span>  <span class="c1">// returns true</span>
<span class="nx">foo</span><span class="p">.</span><span class="nx">isa</span><span class="p">(</span><span class="nx">MathJax</span><span class="p">.</span><span class="nx">InputJax</span><span class="p">);</span>    <span class="c1">// returns false</span>
</pre></div>
</div>
</dd></dl>

<dl class="method">
<dt id="can">
<tt class="descname">can</tt><big>(</big><em>method</em><big>)</big><a class="headerlink" href="#can" title="Permalink to this definition">¶</a></dt>
<dd><p>Checks if the object has the given <cite>method</cite> and returns <tt class="docutils literal"><span class="pre">true</span></tt>
if so, otherwise returns <tt class="docutils literal"><span class="pre">false</span></tt>.  This allows you to test if an
object has a particular function available before trying to call
it (i.e., if an object implements a particular feature).  For example:</p>
<div class="highlight-javascript"><div class="highlight"><pre><span class="nx">foo</span><span class="p">.</span><span class="nx">can</span><span class="p">(</span><span class="s2">&quot;getX&quot;</span><span class="p">);</span>  <span class="c1">// returns true</span>
<span class="nx">foo</span><span class="p">.</span><span class="nx">can</span><span class="p">(</span><span class="s2">&quot;bar&quot;</span><span class="p">);</span>   <span class="c1">// returns false</span>
</pre></div>
</div>
</dd></dl>

<dl class="method">
<dt id="has">
<tt class="descname">has</tt><big>(</big><em>property</em><big>)</big><a class="headerlink" href="#has" title="Permalink to this definition">¶</a></dt>
<dd><p>Checks if the object has the given <cite>property</cite> and returns <tt class="docutils literal"><span class="pre">true</span></tt>
if so, otherwise returns <tt class="docutils literal"><span class="pre">false</span></tt>.  This allows you to test if an
object has a particular property available before trying to use
it.  For example:</p>
<div class="highlight-javascript"><div class="highlight"><pre><span class="nx">foo</span><span class="p">.</span><span class="nx">has</span><span class="p">(</span><span class="s2">&quot;getX&quot;</span><span class="p">);</span>  <span class="c1">// returns true</span>
<span class="nx">foo</span><span class="p">.</span><span class="nx">has</span><span class="p">(</span><span class="s2">&quot;x&quot;</span><span class="p">);</span>     <span class="c1">// returns true</span>
<span class="nx">foo</span><span class="p">.</span><span class="nx">has</span><span class="p">(</span><span class="s2">&quot;bar&quot;</span><span class="p">);</span>   <span class="c1">// returns false</span>
</pre></div>
</div>
</dd></dl>

</div>
<div class="section" id="accessing-the-super-class">
<h2>Accessing the Super Class<a class="headerlink" href="#accessing-the-super-class" title="Permalink to this headline">¶</a></h2>
<p>If a subclass overrides a method of its parent class, it may want to
call the original function as part of its replacement method.  The
semantics for this are a bit awkward, but work efficiently.  Within a
method, the value <tt class="docutils literal"><span class="pre">arguments.callee.SUPER</span></tt> refers to the super
class, so you can access any method of the superclass using that.  In
order to have <cite>this</cite> refer to the current object when you call the
super class, however, you need to use <tt class="docutils literal"><span class="pre">call()</span></tt> or
<tt class="docutils literal"><span class="pre">apply()</span></tt> to access the given method.</p>
<p>For example, <tt class="docutils literal"><span class="pre">arguments.callee.SUPER.method.call(this,data)</span></tt> would
call the superclass&#8217; <cite>method</cite> and pass it <cite>data</cite> as its argument,
properly passing the current object as <cite>this</cite>.  Alternatively, you can
use <tt class="docutils literal"><span class="pre">this.SUPER(arguments)</span></tt> in place of <tt class="docutils literal"><span class="pre">arguments.callee.SUPER</span></tt>.
It is also possible to refer to the super class explicitly rather than
through <tt class="docutils literal"><span class="pre">arguments.callee.SUPER</span></tt>, as in the following example:</p>
<div class="highlight-javascript"><div class="highlight"><pre><span class="nx">MathJax</span><span class="p">.</span><span class="nx">Class1</span> <span class="o">=</span> <span class="nx">MathJax</span><span class="p">.</span><span class="nb">Object</span><span class="p">.</span><span class="nx">Subclass</span><span class="p">({</span>
  <span class="nx">Init</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">x</span><span class="p">)</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">x</span> <span class="o">=</span> <span class="nx">x</span><span class="p">},</span>
  <span class="nx">XandY</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">y</span><span class="p">)</span> <span class="p">{</span><span class="k">return</span> <span class="s2">&quot;Class1: x and y = &quot;</span> <span class="o">+</span> <span class="k">this</span><span class="p">.</span><span class="nx">x</span> <span class="o">+</span> <span class="s2">&quot; and &quot;</span> <span class="o">+</span> <span class="nx">y</span><span class="p">}</span>
<span class="p">});</span>

<span class="nx">MathJax</span><span class="p">.</span><span class="nx">Class2</span> <span class="o">=</span> <span class="nx">MathJax</span><span class="p">.</span><span class="nx">Class1</span><span class="p">.</span><span class="nx">Subclass</span><span class="p">({</span>
  <span class="nx">XandY</span><span class="o">:</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">y</span><span class="p">)</span> <span class="p">{</span><span class="k">return</span> <span class="s2">&quot;Class2: &quot;</span><span class="o">+</span><span class="nx">arguments</span><span class="p">.</span><span class="nx">callee</span><span class="p">.</span><span class="nx">SUPER</span><span class="p">.</span><span class="nx">XandY</span><span class="p">.</span><span class="nx">call</span><span class="p">(</span><span class="k">this</span><span class="p">,</span><span class="nx">y</span><span class="p">)}</span>
<span class="p">});</span>

<span class="nx">MathJax</span><span class="p">.</span><span class="nx">Class3</span> <span class="o">=</span> <span class="nx">MathJax</span><span class="p">.</span><span class="nx">Class2</span><span class="p">.</span><span class="nx">Subclass</span><span class="p">({</span>
  <span class="nx">XandY</span><span class="o">:</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">y</span><span class="p">)</span> <span class="p">{</span><span class="k">return</span> <span class="s2">&quot;Class3: &quot;</span><span class="o">+</span><span class="nx">MathJax</span><span class="p">.</span><span class="nx">Class2</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">XandY</span><span class="p">.</span><span class="nx">call</span><span class="p">(</span><span class="k">this</span><span class="p">,</span><span class="nx">y</span><span class="p">)}</span>
<span class="p">});</span>

<span class="nx">MathJax</span><span class="p">.</span><span class="nx">Class4</span> <span class="o">=</span> <span class="nx">MathJax</span><span class="p">.</span><span class="nx">Class1</span><span class="p">.</span><span class="nx">Subclass</span><span class="p">({</span>
  <span class="nx">XandY</span><span class="o">:</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">y</span><span class="p">)</span> <span class="p">{</span><span class="k">return</span> <span class="s2">&quot;Class4: &quot;</span><span class="o">+</span><span class="k">this</span><span class="p">.</span><span class="nx">SUPER</span><span class="p">(</span><span class="nx">arguments</span><span class="p">).</span><span class="nx">XandY</span><span class="p">.</span><span class="nx">call</span><span class="p">(</span><span class="k">this</span><span class="p">,</span><span class="nx">y</span><span class="p">)}</span>
<span class="p">});</span>

<span class="kd">var</span> <span class="nx">foo</span> <span class="o">=</span> <span class="nx">MathJax</span><span class="p">.</span><span class="nx">Class2</span><span class="p">(</span><span class="s2">&quot;foo&quot;</span><span class="p">);</span>
<span class="nx">foo</span><span class="p">.</span><span class="nx">XandY</span><span class="p">(</span><span class="s2">&quot;bar&quot;</span><span class="p">);</span>   <span class="c1">// returns &quot;Class2: Class1: x and y = foo and bar&quot;</span>
<span class="kd">var</span> <span class="nx">bar</span> <span class="o">=</span> <span class="nx">MathJax</span><span class="p">.</span><span class="nx">Class3</span><span class="p">(</span><span class="s2">&quot;bar&quot;</span><span class="p">);</span>
<span class="nx">bar</span><span class="p">.</span><span class="nx">XandY</span><span class="p">(</span><span class="s2">&quot;foo&quot;</span><span class="p">);</span>   <span class="c1">// returns &quot;Class3: Class2: Class1: x and y = bar and foo&quot;</span>
<span class="kd">var</span> <span class="nx">moo</span> <span class="o">=</span> <span class="nx">MathJax</span><span class="p">.</span><span class="nx">Class4</span><span class="p">(</span><span class="s2">&quot;moo&quot;</span><span class="p">);</span>
<span class="nx">moo</span><span class="p">.</span><span class="nx">XandY</span><span class="p">(</span><span class="s2">&quot;cow&quot;</span><span class="p">);</span>   <span class="c1">// returns &quot;Class4: Class1: x and y = moo and cow&quot;</span>
</pre></div>
</div>
<p>Since both of these mechanisms are rather awkward, MathJax provides an
alternative syntax that is easier on the programmer, but at the cost
of some inefficiency in creating the subclass and in calling methods
that access the super class.</p>
<p>Since most calls to the super class are to the overridden method, not
to some other method, the method name and the <tt class="docutils literal"><span class="pre">call()</span></tt> are
essentially redundant.  You can get a more convenient syntax by
wrapping the <cite>def</cite> for the <a class="reference internal" href="#Subclass" title="Subclass"><tt class="xref py py-meth docutils literal"><span class="pre">Subclass()</span></tt></a> call in a call to
<tt class="docutils literal"><span class="pre">MathJax.Object.SimpleSUPER()</span></tt>, as in the following example:</p>
<div class="highlight-javascript"><div class="highlight"><pre><span class="nx">MathJax</span><span class="p">.</span><span class="nx">Class1</span> <span class="o">=</span> <span class="nx">MathJax</span><span class="p">.</span><span class="nb">Object</span><span class="p">.</span><span class="nx">Subclass</span><span class="p">({</span>
  <span class="nx">Init</span><span class="o">:</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">x</span><span class="p">)</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">x</span> <span class="o">=</span> <span class="nx">x</span><span class="p">},</span>
  <span class="nx">XandY</span><span class="o">:</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">y</span><span class="p">)</span> <span class="p">{</span><span class="k">return</span> <span class="s2">&quot;Class1: x and y = &quot;</span> <span class="o">+</span> <span class="k">this</span><span class="p">.</span><span class="nx">x</span> <span class="o">+</span> <span class="s2">&quot; and &quot;</span> <span class="o">+</span> <span class="nx">y</span><span class="p">}</span>
<span class="p">});</span>

<span class="nx">MathJax</span><span class="p">.</span><span class="nx">Class2</span> <span class="o">=</span> <span class="nx">MathJax</span><span class="p">.</span><span class="nx">Class1</span><span class="p">.</span><span class="nx">Subclass</span><span class="p">(</span>
  <span class="nx">MathJax</span><span class="p">.</span><span class="nb">Object</span><span class="p">.</span><span class="nx">SimpleSUPER</span><span class="p">({</span>
    <span class="nx">XandY</span><span class="o">:</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">y</span><span class="p">)</span> <span class="p">{</span><span class="k">return</span> <span class="s2">&quot;Class2: &quot;</span><span class="o">+</span><span class="k">this</span><span class="p">.</span><span class="nx">SUPER</span><span class="p">(</span><span class="nx">y</span><span class="p">)},</span>
    <span class="nx">AnotherMethod</span><span class="o">:</span> <span class="kd">function</span> <span class="p">()</span> <span class="p">{</span><span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">x</span><span class="p">}</span>              <span class="c1">// it&#39;s OK if a method doesn&#39;t use SUPER</span>
  <span class="p">})</span>
<span class="p">);</span>

<span class="kd">var</span> <span class="nx">foo</span> <span class="o">=</span> <span class="nx">MathJax</span><span class="p">.</span><span class="nx">Class2</span><span class="p">(</span><span class="s2">&quot;foo&quot;</span><span class="p">);</span>
<span class="nx">foo</span><span class="p">.</span><span class="nx">XandY</span><span class="p">(</span><span class="s2">&quot;bar&quot;</span><span class="p">);</span>     <span class="c1">// returns &quot;Class2: Class1: x and y = foo and bar&quot;</span>
</pre></div>
</div>
</div>
</div>


          </div>
        </div>
      </div>
      <div class="sphinxsidebar">
        <div class="sphinxsidebarwrapper">
  <h3><a href="../index.html">Table Of Contents</a></h3>
  <ul>
<li><a class="reference internal" href="#">The MathJax Object-Oriented Programming Model</a><ul>
<li><a class="reference internal" href="#static-properties">Static Properties</a></li>
<li><a class="reference internal" href="#static-methods">Static Methods</a></li>
<li><a class="reference internal" href="#properties">Properties</a></li>
<li><a class="reference internal" href="#methods">Methods</a></li>
<li><a class="reference internal" href="#accessing-the-super-class">Accessing the Super Class</a></li>
</ul>
</li>
</ul>

  <h4>Previous topic</h4>
  <p class="topless"><a href="jax.html"
                        title="previous chapter">The Base Jax Class</a></p>
  <h4>Next topic</h4>
  <p class="topless"><a href="../HTML-snippets.html"
                        title="next chapter">Describing HTML snippets</a></p>
<div id="searchbox" style="display: none">
  <h3>Quick search</h3>
    <form class="search" action="../search.html" method="get">
      <input type="text" name="q" size="18" />
      <input type="submit" value="Go" />
      <input type="hidden" name="check_keywords" value="yes" />
      <input type="hidden" name="area" value="default" />
    </form>
    <p class="searchtip" style="font-size: 90%">
    Enter search terms or a module, class or function name.
    </p>
</div>
<script type="text/javascript">$('#searchbox').show(0);</script>
        </div>
      </div>
      <div class="clearer"></div>
    </div>
    <div class="related">
      <h3>Navigation</h3>
      <ul>
        <li class="right" style="margin-right: 10px">
          <a href="../genindex.html" title="General Index"
             >index</a></li>
        <li class="right" >
          <a href="../HTML-snippets.html" title="Describing HTML snippets"
             >next</a> |</li>
        <li class="right" >
          <a href="jax.html" title="The Base Jax Class"
             >previous</a> |</li>
        <li><a href="../index.html">MathJax v1.1 documentation</a> &raquo;</li>
          <li><a href="index.html" >The MathJax API</a> &raquo;</li> 
      </ul>
    </div>
    <div class="footer">
        &copy; Copyright 2011 Design Science.
      Created using <a href="http://sphinx.pocoo.org/">Sphinx</a> 1.0.7.
    </div>
    
  </body>
</html>