|
0
|
1 <!doctype html>
|
|
|
2
|
|
|
3 <title>CodeMirror: JavaScript mode</title>
|
|
|
4 <meta charset="utf-8"/>
|
|
|
5 <link rel=stylesheet href="../../doc/docs.css">
|
|
|
6
|
|
|
7 <link rel="stylesheet" href="../../lib/codemirror.css">
|
|
|
8 <script src="../../lib/codemirror.js"></script>
|
|
|
9 <script src="../../addon/edit/matchbrackets.js"></script>
|
|
|
10 <script src="../../addon/comment/continuecomment.js"></script>
|
|
|
11 <script src="../../addon/comment/comment.js"></script>
|
|
|
12 <script src="javascript.js"></script>
|
|
|
13 <style>.CodeMirror {border-top: 1px solid black; border-bottom: 1px solid black;}</style>
|
|
|
14 <div id=nav>
|
|
|
15 <a href="https://codemirror.net/5"><h1>CodeMirror</h1><img id=logo src="../../doc/logo.png" alt=""></a>
|
|
|
16
|
|
|
17 <ul>
|
|
|
18 <li><a href="../../index.html">Home</a>
|
|
|
19 <li><a href="../../doc/manual.html">Manual</a>
|
|
|
20 <li><a href="https://github.com/codemirror/codemirror5">Code</a>
|
|
|
21 </ul>
|
|
|
22 <ul>
|
|
|
23 <li><a href="../index.html">Language modes</a>
|
|
|
24 <li><a class=active href="#">JavaScript</a>
|
|
|
25 </ul>
|
|
|
26 </div>
|
|
|
27
|
|
|
28 <article>
|
|
|
29 <h2>JavaScript mode</h2>
|
|
|
30
|
|
|
31
|
|
|
32 <div><textarea id="code" name="code">
|
|
|
33 // Demo code (the actual new parser character stream implementation)
|
|
|
34
|
|
|
35 function StringStream(string) {
|
|
|
36 this.pos = 0;
|
|
|
37 this.string = string;
|
|
|
38 }
|
|
|
39
|
|
|
40 StringStream.prototype = {
|
|
|
41 done: function() {return this.pos >= this.string.length;},
|
|
|
42 peek: function() {return this.string.charAt(this.pos);},
|
|
|
43 next: function() {
|
|
|
44 if (this.pos < this.string.length)
|
|
|
45 return this.string.charAt(this.pos++);
|
|
|
46 },
|
|
|
47 eat: function(match) {
|
|
|
48 var ch = this.string.charAt(this.pos);
|
|
|
49 if (typeof match == "string") var ok = ch == match;
|
|
|
50 else var ok = ch && match.test ? match.test(ch) : match(ch);
|
|
|
51 if (ok) {this.pos++; return ch;}
|
|
|
52 },
|
|
|
53 eatWhile: function(match) {
|
|
|
54 var start = this.pos;
|
|
|
55 while (this.eat(match));
|
|
|
56 if (this.pos > start) return this.string.slice(start, this.pos);
|
|
|
57 },
|
|
|
58 backUp: function(n) {this.pos -= n;},
|
|
|
59 column: function() {return this.pos;},
|
|
|
60 eatSpace: function() {
|
|
|
61 var start = this.pos;
|
|
|
62 while (/\s/.test(this.string.charAt(this.pos))) this.pos++;
|
|
|
63 return this.pos - start;
|
|
|
64 },
|
|
|
65 match: function(pattern, consume, caseInsensitive) {
|
|
|
66 if (typeof pattern == "string") {
|
|
|
67 function cased(str) {return caseInsensitive ? str.toLowerCase() : str;}
|
|
|
68 if (cased(this.string).indexOf(cased(pattern), this.pos) == this.pos) {
|
|
|
69 if (consume !== false) this.pos += str.length;
|
|
|
70 return true;
|
|
|
71 }
|
|
|
72 }
|
|
|
73 else {
|
|
|
74 var match = this.string.slice(this.pos).match(pattern);
|
|
|
75 if (match && consume !== false) this.pos += match[0].length;
|
|
|
76 return match;
|
|
|
77 }
|
|
|
78 }
|
|
|
79 };
|
|
|
80 </textarea></div>
|
|
|
81
|
|
|
82 <script>
|
|
|
83 var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
|
|
|
84 lineNumbers: true,
|
|
|
85 matchBrackets: true,
|
|
|
86 continueComments: "Enter",
|
|
|
87 extraKeys: {"Ctrl-Q": "toggleComment"}
|
|
|
88 });
|
|
|
89 </script>
|
|
|
90
|
|
|
91 <p>
|
|
|
92 JavaScript mode supports several configuration options:
|
|
|
93 <ul>
|
|
|
94 <li><code>json</code> which will set the mode to expect JSON
|
|
|
95 data rather than a JavaScript program.</li>
|
|
|
96 <li><code>jsonld</code> which will set the mode to expect
|
|
|
97 <a href="http://json-ld.org">JSON-LD</a> linked data rather
|
|
|
98 than a JavaScript program (<a href="json-ld.html">demo</a>).</li>
|
|
|
99 <li><code>typescript</code> which will activate additional
|
|
|
100 syntax highlighting and some other things for TypeScript code
|
|
|
101 (<a href="typescript.html">demo</a>).</li>
|
|
|
102 <li><code>trackScope</code> can be set to false to turn off
|
|
|
103 tracking of local variables. This will prevent locals from
|
|
|
104 getting the <code>"variable-2"</code> token type, and will
|
|
|
105 break completion of locals with javascript-hint.</li>
|
|
|
106 <li><code>statementIndent</code> which (given a number) will
|
|
|
107 determine the amount of indentation to use for statements
|
|
|
108 continued on a new line.</li>
|
|
|
109 <li><code>wordCharacters</code>, a regexp that indicates which
|
|
|
110 characters should be considered part of an identifier.
|
|
|
111 Defaults to <code>/[\w$]/</code>, which does not handle
|
|
|
112 non-ASCII identifiers. Can be set to something more elaborate
|
|
|
113 to improve Unicode support.</li>
|
|
|
114 </ul>
|
|
|
115 </p>
|
|
|
116
|
|
|
117 <p><strong>MIME types defined:</strong> <code>text/javascript</code>, <code>application/javascript</code>, <code>application/x-javascript</code>, <code>text/ecmascript</code>, <code>application/ecmascript</code>, <code>application/json</code>, <code>application/x-json</code>, <code>application/manifest+json</code>, <code>application/ld+json</code>, <code>text/typescript</code>, <code>application/typescript</code>.</p>
|
|
|
118 </article>
|
