### JavaScript Comment Syntax Examples
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/statements.txt
Shows examples of single-line ('//') and multi-line ('/* */') comments within JavaScript object literals, demonstrating their placement for documentation.
```javascript
{
// This is a property
aProperty: 1,
/*
* This is a method
*/
aMethod: function() {}
};
```
--------------------------------
### JavaScript Do-While Loop Examples
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/statements.txt
Provides various examples of the JavaScript 'do...while' loop, demonstrating its syntax with different body types, nesting, and integration within other control flow statements.
```javascript
do {
a;
} while (b)
do a; while (b)
do {} while (b)
do do; while (a) while (a)
for (a in b) { do ; while (a) break; }
do
if (true)
do {
} while (false);
while (0);
```
--------------------------------
### Install Library and Header Files
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/CMakeLists.txt
This snippet includes standard GNU install directories and defines rules for installing the tree-sitter-javascript header file, the generated pkg-config file, and the compiled library to their respective system locations.
```CMake
configure_file(bindings/c/tree-sitter-javascript.pc.in
"${CMAKE_CURRENT_BINARY_DIR}/tree-sitter-javascript.pc" @ONLY)
include(GNUInstallDirs)
install(FILES bindings/c/tree-sitter-javascript.h
DESTINATION "${CMAKE_INSTALL_INCLUDEDIR}/tree_sitter")
install(FILES "${CMAKE_CURRENT_BINARY_DIR}/tree-sitter-javascript.pc"
DESTINATION "${CMAKE_INSTALL_DATAROOTDIR}/pkgconfig")
install(TARGETS tree-sitter-javascript
LIBRARY DESTINATION "${CMAKE_INSTALL_LIBDIR}")
```
--------------------------------
### JavaScript Variable Declaration Examples
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/statements.txt
Demonstrates 'var' keyword usage for variable declarations in JavaScript, including single initialization and multiple declarations on one line with mixed initializations.
```javascript
var x = 1;
var x, y = {}, z;
```
--------------------------------
### JavaScript While Loop Examples
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/statements.txt
Shows different forms of the JavaScript 'while' loop, including a single-statement body and a block-statement body, demonstrating basic conditional iteration.
```javascript
while (a)
b();
while (a) {
}
```
--------------------------------
### JavaScript Return Statement Examples
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/statements.txt
Illustrates different ways to use the 'return' statement in JavaScript, including returning no value, a literal value, a sequence expression, or an identifier.
```javascript
return;
return 5;
return 1,2;
return async;
return a;
```
--------------------------------
### Chained Property access
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
Shows an example of chaining multiple method calls and property accesses on an object, common in promise-based or fluent APIs.
```JavaScript
return returned.promise()
.done( newDefer.resolve )
.fail( newDefer.reject )
```
```Tree-sitter AST
(program
(return_statement
(call_expression
(member_expression
(call_expression
(member_expression
(call_expression
(member_expression
(identifier)
(property_identifier))
(arguments))
(property_identifier))
(arguments
(member_expression
(identifier)
(property_identifier))))
(property_identifier))
(arguments
(member_expression
(identifier)
(property_identifier))))))
```
--------------------------------
### JavaScript Decorator with Exported Class and Grammar
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/statements.txt
This example demonstrates the syntax for applying a decorator to a class that is subsequently exported, a common pattern in dependency injection frameworks. The corresponding Tree-sitter grammar parse tree is also provided.
```JavaScript
@injectable()
export class Foo {
}
```
```Tree-sitter Grammar
(program
(export_statement
decorator: (decorator
(call_expression
function: (identifier)
arguments: (arguments)))
declaration: (class_declaration
name: (identifier)
body: (class_body))))
```
--------------------------------
### JavaScript For-Of Loop Examples
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/statements.txt
Demonstrates basic JavaScript 'for...of' loop syntax, including simple iteration over an iterable and destructuring assignment within the loop with a fallback array.
```javascript
for (a of b)
process(a);
for (let {a, b} of items || [])
process(a, b);
```
--------------------------------
### JSX
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
Provides a comprehensive set of examples for various JSX syntax forms, including basic elements, fragment syntax, self-closing tags, attributes (string, expression, boolean), and namespaced components.
```javascript
var a =
b =
c = <> >
d =
e =
f =
g =
h =
i = {...children}
```
--------------------------------
### Constructor calls in JavaScript
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
This snippet demonstrates various ways to use the `new` operator in JavaScript for constructor calls. It includes examples of instantiating classes with and without arguments, as well as chained `new` expressions. The corresponding Tree-sitter parse tree illustrates the `new_expression` and `arguments` nodes.
```JavaScript
new module.Klass(1, "two");
new Thing;
new new module.Klass(1)("two");
new new Thing;
```
```Tree-sitter Parse Tree
(program
(expression_statement
(new_expression
(member_expression
(identifier)
(property_identifier))
(arguments
(number)
(string
(string_fragment)))))
(expression_statement
(new_expression
(identifier)))
(expression_statement
(new_expression
(new_expression
(member_expression
(identifier)
(property_identifier))
(arguments
(number)))
(arguments
(string
(string_fragment)))))
(expression_statement
(new_expression
(new_expression
(identifier)))))
```
--------------------------------
### JavaScript ES Module Import Syntaxes and AST
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/statements.txt
This comprehensive snippet illustrates various ES Module import syntaxes in JavaScript, including default, named, namespace, dynamic imports, and imports with attributes. Each example is paired with its Tree-sitter S-expression parse tree, detailing the AST representation of different import forms.
```JavaScript
import defaultMember from "module-name";
import * as name from "module-name";
import { member } from "module-name";
import { member1 , member2 } from "module-name";
import { member1 , member2 as alias2 } from "module-name";
import { "string name" as alias } from "module-name";
import defaultMember, { member1, member2 as alias2 } from "module-name";
import defaultMember, * as name from "module-name";
import "module-name";
import { member1 , member2 as alias2, } from "module-name";
import pkg from "./package.json" with { type: "json" };
import("a");
import("a").then((m) => {});
import.meta.url;
import { b } from
'b'; /* comment */ import
{ a } from 'a';
```
```Tree-sitter S-expression
(program
(import_statement
(import_clause
(identifier))
(string
(string_fragment)))
(import_statement
(import_clause
(namespace_import
(identifier)))
(string
(string_fragment)))
(import_statement
(import_clause
(named_imports
(import_specifier
(identifier))))
(string
(string_fragment)))
(import_statement
(import_clause
(named_imports
(import_specifier
(identifier))
(import_specifier
(identifier))))
(string
(string_fragment)))
(import_statement
(import_clause
(named_imports
(import_specifier
(identifier))
(import_specifier
(identifier)
(identifier))))
(string
(string_fragment)))
(import_statement
(import_clause
(named_imports
(import_specifier
(string
(string_fragment))
(identifier))))
(string
(string_fragment)))
(import_statement
(import_clause
(identifier)
(named_imports
(import_specifier
(identifier))
(import_specifier
(identifier)
(identifier))))
(string
(string_fragment)))
(import_statement
(import_clause
(identifier)
(namespace_import
(identifier)))
(string
(string_fragment)))
(import_statement
(string
(string_fragment)))
(import_statement
(import_clause
(named_imports
(import_specifier
(identifier))
(import_specifier
(identifier)
(identifier))))
(string
(string_fragment)))
(import_statement
(import_clause
(identifier))
(string
(string_fragment))
(import_attribute
(object
(pair
(property_identifier)
(string
(string_fragment))))))
(expression_statement
(call_expression
(import)
(arguments
(string
(string_fragment)))))
(expression_statement
(call_expression
(member_expression
(call_expression
(import)
(arguments
(string
(string_fragment))))
(property_identifier))
(arguments
(arrow_function
(formal_parameters
(identifier))
(statement_block)))))
(expression_statement
(member_expression
(meta_property)
(property_identifier)))
(import_statement
(import_clause
(named_imports
(import_specifier
(identifier))))
(string
(string_fragment)))
(comment)
(import_statement
(import_clause
(named_imports
(import_specifier
(identifier))))
(string
(string_fragment))))
```
--------------------------------
### JavaScript String Literals and Escaping
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
Examples of JavaScript string literals using single and double quotes, including various escape sequences and multi-line strings. Shows how Tree-sitter parses these constructs into string fragments and escape sequences.
```JavaScript
"A string with \"double\" and 'single' quotes";
'A string with "double" and \'single\' quotes';
'\\'
"\\"
'A string with new \
line';
```
```Tree-sitter AST
(program
(expression_statement
(string
(string_fragment)
(escape_sequence)
(string_fragment)
(escape_sequence)
(string_fragment)))
(expression_statement
(string
(string_fragment)
(escape_sequence)
(string_fragment)
(escape_sequence)
(string_fragment)))
(expression_statement
(string
(escape_sequence)))
(expression_statement
(string
(escape_sequence)))
(expression_statement
(string
(string_fragment)
(escape_sequence)
(string_fragment))))
```
--------------------------------
### Chained callbacks
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
Demonstrates chaining array methods with callback functions, including `map` and `filter`, and how comments are represented in the AST.
```JavaScript
return this.map(function (a) {
return a.b;
})
// a comment
.filter(function (c) {
return c.d;
})
```
```Tree-sitter AST
(program
(return_statement
(call_expression
(member_expression
(call_expression
(member_expression
(this)
(property_identifier))
(arguments
(function_expression
(formal_parameters
(identifier))
(statement_block
(return_statement
(member_expression
(identifier)
(property_identifier)))))))
(comment)
(property_identifier))
(arguments
(function_expression
(formal_parameters
(identifier))
(statement_block
(return_statement
(member_expression
(identifier)
(property_identifier)))))))))
```
--------------------------------
### JavaScript Tagged Template Literals in Function Calls
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
Shows basic examples of tagged template literals used as arguments in function calls, demonstrating both immediate and newline-separated usage. The AST highlights the direct association of the template string with the call expression.
```JavaScript
f `hello`;
f
`hello`;
```
```Tree-sitter AST
(program
(expression_statement
(call_expression
(identifier)
(template_string
(string_fragment))))
(expression_statement
(call_expression
(identifier)
(template_string
(string_fragment)))))
```
--------------------------------
### Function calls
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
Illustrates standard function calls, including method calls with arguments and immediately invoked function expressions (IIFE).
```JavaScript
x.someMethod(arg1, "arg2");
function(x, y) {
}(a, b);
```
```Tree-sitter AST
(program
(expression_statement
(call_expression
(member_expression
(identifier)
(property_identifier))
(arguments
(identifier)
(string
(string_fragment)))))
(expression_statement
(call_expression
(function_expression
(formal_parameters
(identifier)
(identifier))
(statement_block))
(arguments
(identifier)
(identifier)))))
```
--------------------------------
### JavaScript For-Await-Of Loop Example
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/statements.txt
Illustrates the 'for await...of' loop syntax used for iterating over asynchronous iterables, such as streams, typically within an async function.
```javascript
for await (const chunk of stream) {
str += chunk;
}
```
--------------------------------
### Optional chaining property access
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
Demonstrates optional chaining for property access in JavaScript, comparing it with regular property access.
```JavaScript
a . b;
a ?. b;
```
```Tree-sitter AST
(program
(expression_statement
(member_expression
(identifier)
(property_identifier)))
(expression_statement
(member_expression
(identifier)
(optional_chain)
(property_identifier))))
```
--------------------------------
### JavaScript Operator Precedence and Tree-sitter Parse Tree Examples
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
Illustrates the precedence of diverse JavaScript operators (e.g., logical, assignment, ternary, bitwise) and their Tree-sitter parse tree representations. This shows the parsing order and structural hierarchy.
```JavaScript
a <= b && c >= d;
a.b = c ? d : e;
a && b(c) && d;
a && new b(c) && d;
typeof a == b && c instanceof d
a && b | c;
a - b << c;
a in b != c in d;
await a || b;
```
```Tree-sitter Parse Tree
(program
(expression_statement
(binary_expression
(binary_expression
(identifier)
(identifier))
(binary_expression
(identifier)
(identifier))))
(expression_statement
(assignment_expression
(member_expression
(identifier)
(property_identifier))
(ternary_expression
(identifier)
(identifier)
(identifier))))
(expression_statement
(binary_expression
(binary_expression
(identifier)
(call_expression
(identifier)
(arguments
(identifier))))
(identifier)))
(expression_statement
(binary_expression
(binary_expression
(identifier)
(new_expression
(identifier)
(arguments
(identifier))))
(identifier)))
(expression_statement
(binary_expression
(binary_expression
(unary_expression
(identifier))
(identifier))
(binary_expression
(identifier)
(identifier))))
(expression_statement
(binary_expression
(identifier)
(binary_expression
(identifier)
(identifier))))
(expression_statement
(binary_expression
(binary_expression
(identifier)
(identifier))
(identifier)))
(expression_statement
(binary_expression
(binary_expression
(identifier)
(identifier))
(binary_expression
(identifier)
(identifier))))
(expression_statement
(binary_expression
(await_expression
(identifier))
(identifier))))
```
--------------------------------
### Property access
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
Illustrates different ways to access properties in JavaScript objects, including dot notation, bracket notation with a variable, and bracket notation with a string literal.
```JavaScript
x.someProperty;
x[someVariable];
x["some-string"];
```
```Tree-sitter AST
(program
(expression_statement
(member_expression
(identifier)
(property_identifier)))
(expression_statement
(subscript_expression
(identifier)
(identifier)))
(expression_statement
(subscript_expression
(identifier)
(string
(string_fragment)))))
```
--------------------------------
### Tree-sitter Parse Tree for Binary and Unary Expressions
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
An example of a Tree-sitter parse tree fragment demonstrating nested binary and unary expressions, showing how identifiers are structured within these operations. Note that this snippet is a fragment and not a complete program parse tree.
```Tree-sitter
(binary_expression
(identifier)
(identifier)))
(expression_statement
(binary_expression
(identifier)
(identifier)))
(expression_statement
(binary_expression
(identifier)
(identifier)))
(expression_statement
(binary_expression
(unary_expression
(identifier)))
(unary_expression
(identifier)))))
```
--------------------------------
### Parse JSX with HTML Character References
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/literals.txt
Examples showing Tree-sitter's parsing of HTML character references (entities) like ` ` within JSX text content and attribute values.
```JSX
foo bar;
foo;
```
```Tree-sitter S-expression
(program
(expression_statement
(jsx_element
(jsx_opening_element
(identifier))
(jsx_text)
(html_character_reference)
(jsx_text)
(jsx_closing_element
(identifier))))
(expression_statement
(jsx_element
(jsx_opening_element
(identifier)
(jsx_attribute
(property_identifier)
(string
(string_fragment)
(html_character_reference)
(string_fragment))))
(jsx_text)
(jsx_closing_element
(identifier)))))
```
--------------------------------
### Parsing JavaScript Line Comments within Expressions
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/statements.txt
Illustrates how Tree-sitter handles single-line comments placed within a JavaScript expression. The example shows a line comment between an identifier and an operator, and its representation in the abstract syntax tree.
```JavaScript
y // comment
* z;
```
```Tree-sitter AST
(program
(expression_statement
(binary_expression
(identifier)
(comment)
(identifier))))
```
--------------------------------
### Hash Bang Lines in JavaScript and Tree-sitter
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/statements.txt
Illustrates how Tree-sitter parses hash bang (shebang) lines at the beginning of JavaScript files, followed by regular code.
```JavaScript
#!/usr/bin/env node
console.log("HI")
```
```Tree-sitter S-expression
(program
(hash_bang_line)
(expression_statement
(call_expression
(member_expression
(identifier)
(property_identifier))
(arguments
(string
(string_fragment))))))
```
--------------------------------
### With Statements in JavaScript and Tree-sitter
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/statements.txt
Demonstrates the parsing of JavaScript `with` statements, including those with a body containing an expression and those with an empty body.
```JavaScript
with (x) { i; }
with (x) { }
```
```Tree-sitter S-expression
(program
(with_statement
object: (parenthesized_expression
(identifier))
body: (statement_block
(expression_statement
(identifier))))
(with_statement
object: (parenthesized_expression
(identifier))
body: (statement_block)))
```
--------------------------------
### JavaScript Comma Operator and Tree-sitter Parse Tree
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
Shows examples of the JavaScript comma operator, demonstrating its use in sequence expressions and within object literals, along with its representation as 'sequence_expression' in the Tree-sitter parse tree.
```JavaScript
a = 1, b = 2;
c = {d: (3, 4 + 5, 6)};
```
```Tree-sitter
(program
(expression_statement
(sequence_expression
(assignment_expression
(identifier)
(number))
(assignment_expression
(identifier)
(number))))
(expression_statement
(assignment_expression
(identifier)
(object
(pair
(property_identifier)
(parenthesized_expression
(sequence_expression
(number)
(binary_expression
(number)
(number))
(number))))))))
```
--------------------------------
### JavaScript Simple JSX Elements and Tree-sitter Parse Tree
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
Provides examples of basic JSX element syntax in JavaScript, including self-closing elements with attributes, nested elements, and deeply nested member expressions for component names. The Tree-sitter parse tree shows the structural representation of these JSX constructs.
```JavaScript
a =
;
b = a b c;
b = ;
```
```Tree-sitter Parse Tree
(program
(expression_statement
(assignment_expression
(identifier)
(jsx_self_closing_element
(identifier)
(jsx_attribute
(property_identifier)
(string
(string_fragment)))
(jsx_attribute
(property_identifier)
(jsx_expression
(number))))))
(expression_statement
(assignment_expression
(identifier)
(jsx_element
(jsx_opening_element
(member_expression
(identifier)
(property_identifier)))
(jsx_text)
(jsx_element
(jsx_opening_element
(identifier))
(jsx_text)
(jsx_closing_element
(identifier)))
(jsx_text)
(jsx_closing_element
(member_expression
(identifier)
(property_identifier))))))
(expression_statement
(assignment_expression
(identifier)
(jsx_element
(jsx_opening_element
(member_expression
(member_expression
(member_expression
(identifier)
(property_identifier))
(property_identifier))
(property_identifier)))
(jsx_closing_element
(member_expression
(member_expression
(member_expression
(identifier)
(property_identifier))
(property_identifier))
(property_identifier)))))))
```
--------------------------------
### Labeled Statements in JavaScript and Tree-sitter
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/statements.txt
Illustrates the parsing of labeled statements in JavaScript, showing how `break` and `continue` statements can target specific labels within loops or blocks.
```JavaScript
theLoop:
for (;;) {
if (a) {
break theLoop;
} else {
continue theLoop;
}
}
label
: {
break label;
}
async:
while (true) {
continue async;
}
```
```Tree-sitter S-expression
(program
(labeled_statement
label: (statement_identifier)
body: (for_statement
initializer: (empty_statement)
condition: (empty_statement)
body: (statement_block
(if_statement
condition: (parenthesized_expression
(identifier))
consequence: (statement_block
(break_statement
label: (statement_identifier)))
alternative: (else_clause
(statement_block
(continue_statement
label: (statement_identifier))))))))
(labeled_statement
label: (statement_identifier)
body: (statement_block
(break_statement
label: (statement_identifier))))
(labeled_statement
label: (statement_identifier)
body: (while_statement
condition: (parenthesized_expression
(true))
body: (statement_block
(continue_statement
label: (statement_identifier))))))
```
--------------------------------
### Parsing JavaScript Throw Statements with Sequence Expressions
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/statements.txt
Illustrates how Tree-sitter parses `throw` statements that include JavaScript sequence expressions. The examples show throwing the result of an assignment within a sequence, and how this is structured in the AST as a `throw_statement` containing a `sequence_expression`.
```JavaScript
throw f = 1, f;
throw g = 2, g
```
```Tree-sitter AST
(program
(throw_statement
(sequence_expression
(assignment_expression
(identifier)
(number))
(identifier)))
(throw_statement
(sequence_expression
(assignment_expression
(identifier)
(number))
(identifier))))
```
--------------------------------
### Forward slashes after parenthesized expressions
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
Shows examples where forward slashes appear after parenthesized expressions, clarifying their interpretation as division operators or part of regular expressions, depending on context.
```javascript
(foo - bar) / baz
if (foo - bar) /baz/;
(this.a() / this.b() - 1) / 2
```
--------------------------------
### Object Method Definitions Parsing
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
Demonstrates Tree-sitter's parsing of various method definitions within JavaScript object literals, including standard methods, getters, setters, and generator methods.
```JavaScript
{
foo: true,
add(a, b) {
return a + b;
},
get bar() { return c; },
set bar(a) { c = a; },
*barGenerator() { yield c; },
get() { return 1; }
};
```
```Tree-sitter Grammar
(program
(expression_statement
(object
(pair
(property_identifier)
(true))
(method_definition
(property_identifier)
(formal_parameters
(identifier)
(identifier))
(statement_block
(return_statement
(binary_expression
(identifier)
(identifier)))))
(method_definition
(property_identifier)
(formal_parameters)
(statement_block
(return_statement
(identifier))))
(method_definition
(property_identifier)
(formal_parameters
(identifier))
(statement_block
(expression_statement
(assignment_expression
(identifier)
(identifier)))))
(method_definition
(property_identifier)
(formal_parameters)
(statement_block
(expression_statement
(yield_expression
(identifier)))))
(method_definition
(property_identifier)
(formal_parameters)
(statement_block
(return_statement
(number)))))))
```
--------------------------------
### Optional function calls
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
Illustrates optional chaining when calling functions, including direct calls, calls on subscripted expressions, and calls on member expressions.
```JavaScript
a?.(b);
a[b]?.(c);
d.e?.(f);
```
```Tree-sitter AST
(program
(expression_statement
(call_expression
(identifier)
(optional_chain)
(arguments
(identifier))))
(expression_statement
(call_expression
(subscript_expression
(identifier)
```
--------------------------------
### JavaScript Comments Between Statements and Expressions
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/statements.txt
Illustrates how comments can be strategically placed within and between JavaScript statements, object properties, function parameters, and expressions to enhance code readability.
```javascript
// this is the beginning of the script.
// here we go.
var thing = {
// this is a property.
// its value is a function.
key: function(x /* this is a parameter */) {
// this is one statement
one();
// this is another statement
two();
}
};
let foo = bar
// this is a comment
? 'baz' : 'thud';
let a /* >_< */ = 1
```
--------------------------------
### Function parameters with default values
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
Demonstrates JavaScript function declarations including object destructuring and parameters with default values.
```JavaScript
function a({b}, c = d, e = f, async = true) {
}
```
```Tree-sitter AST
(program
(function_declaration
(identifier)
(formal_parameters
(object_pattern
(shorthand_property_identifier_pattern))
(assignment_pattern
(identifier)
(identifier))
(assignment_pattern
(identifier)
(identifier))
(assignment_pattern
(identifier)
(true)))
(statement_block)))
```
--------------------------------
### Parse JavaScript String Quote Escaping
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/literals.txt
Examples demonstrating how Tree-sitter handles various forms of quote escaping within JavaScript string literals, including empty strings, escaped quotes, and the use of different quote types.
```JavaScript
"";
'';
"\"";
"a\"b";
'\'';
'a\'b';
"it's a tiny tiny world";
'"hello"';
```
```Tree-sitter S-expression
(program
(expression_statement (string))
(expression_statement (string))
(expression_statement (string (escape_sequence)))
(expression_statement
(string (string_fragment) (escape_sequence) (string_fragment)))
(expression_statement (string (escape_sequence)))
(expression_statement
(string (string_fragment) (escape_sequence) (string_fragment)))
(expression_statement (string (string_fragment)))
(expression_statement (string (string_fragment))))
```
--------------------------------
### JavaScript Class Definitions, Inheritance, and Private Members
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
This section demonstrates various aspects of JavaScript class syntax, including basic class declarations with static and instance methods, private fields, inheritance using 'extends', constructors, static initialization blocks, and private methods. The Tree-sitter output highlights the distinct nodes for each class feature.
```javascript
class Foo {
#e
static one(a) { return a; };
two(b) { return b; }
three(c) { return c; }
#four(d) { return this.#e; }
}
class Foo extends require('another-class') {
constructor() {
super()
}
static
{
this.#foo = 'bar';
}
bar() {
super.a()
this.#baz()
}
#baz() {
super.a()
}
}
class A{;}
```
```Tree-sitter Parse Tree
(program
(class_declaration
(identifier)
(class_body
(field_definition
(private_property_identifier))
(method_definition
(property_identifier)
(formal_parameters
(identifier))
(statement_block
(return_statement
(identifier))))
(method_definition
(property_identifier)
(formal_parameters
(identifier))
(statement_block
(return_statement
(identifier))))
(method_definition
(property_identifier)
(formal_parameters
(identifier))
(statement_block
(return_statement
(identifier))))
(method_definition
(private_property_identifier)
(formal_parameters
(identifier))
(statement_block
(return_statement
(member_expression
(this)
(private_property_identifier)))))))
(class_declaration
(identifier)
(class_heritage
(call_expression
(identifier)
(arguments
(string
(string_fragment)))))
(class_body
(method_definition
(property_identifier)
(formal_parameters)
(statement_block
(expression_statement
(call_expression
(super)
(arguments)))))
(class_static_block
(statement_block
(expression_statement
(assignment_expression
(member_expression
(this)
(private_property_identifier))
(string
(string_fragment))))))
(method_definition
(property_identifier)
(formal_parameters)
(statement_block
(expression_statement
(call_expression
(member_expression
(super)
(property_identifier))
(arguments)))
(expression_statement
(call_expression
(member_expression
(this)
(private_property_identifier))
(arguments)))))
(method_definition
(private_property_identifier)
(formal_parameters)
(statement_block
(expression_statement
(call_expression
(member_expression
(super)
(property_identifier))
(arguments)))))))
(class_declaration
(identifier)
(class_body)))
```
--------------------------------
### Empty Statements in JavaScript and Tree-sitter
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/statements.txt
Demonstrates how Tree-sitter parses empty statements and blocks in JavaScript, including multiple consecutive empty statements and empty `if/else` blocks.
```JavaScript
if (true) { ; };;;
if (true) {} else {}
```
```Tree-sitter S-expression
(program
(if_statement
(parenthesized_expression
(true))
(statement_block
(empty_statement)))
(empty_statement)
(empty_statement)
(empty_statement)
(if_statement
(parenthesized_expression
(true))
(statement_block)
(else_clause
(statement_block))))
```
--------------------------------
### JavaScript Classes with Reserved Words as Method Names
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
This example demonstrates that JavaScript allows the use of reserved words like 'catch' and 'finally' as method names within a class definition. The Tree-sitter parse tree confirms that these are correctly identified as method definitions.
```javascript
class Foo {
catch() {}
finally() {}
}
```
```Tree-sitter Parse Tree
(program
(class_declaration
(identifier)
(class_body
(method_definition
(property_identifier)
(formal_parameters)
(statement_block))
(method_definition
(property_identifier)
(formal_parameters)
(statement_block)))))
```
--------------------------------
### JavaScript If Statement Syntax and Grammar
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/statements.txt
This section showcases various forms of JavaScript `if` statements, including those with single-line bodies, block bodies, and complex conditions involving update expressions. The corresponding Tree-sitter grammar parse tree is included for each example.
```JavaScript
if (x)
log(y);
if (a.b) {
log(c);
d;
}
if (n-->0){}
```
```Tree-sitter Grammar
(program
(if_statement
condition: (parenthesized_expression
(identifier))
consequence: (expression_statement
(call_expression
function: (identifier)
arguments: (arguments
(identifier)))))
(if_statement
condition: (parenthesized_expression
(member_expression
object: (identifier)
property: (property_identifier)))
consequence: (statement_block
(expression_statement
(call_expression
function: (identifier)
arguments: (arguments
(identifier))))
(expression_statement
(identifier))))
(if_statement
condition: (parenthesized_expression
(binary_expression
left: (update_expression
argument: (identifier))
right: (number)))
consequence: (statement_block)))
```
--------------------------------
### Define CMake Project and Minimum Version
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/CMakeLists.txt
This snippet sets the minimum required CMake version and defines the project 'tree-sitter-javascript' with its version, description, homepage, and supported languages. It's the foundational setup for the entire build.
```CMake
cmake_minimum_required(VERSION 3.13)
project(tree-sitter-javascript
VERSION "0.23.1"
DESCRIPTION "JavaScript grammar for tree-sitter"
HOMEPAGE_URL "https://github.com/tree-sitter/tree-sitter-javascript"
LANGUAGES C)
```
--------------------------------
### Multi-line Variable Declarations Parsing
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
Demonstrates how Tree-sitter parses multi-line variable declarations in JavaScript, including multiple declarators in a single 'var' statement.
```JavaScript
var a = b
, c = d
, e = f;
```
```Tree-sitter Grammar
(program
(variable_declaration
(variable_declarator
(identifier)
(identifier))
(variable_declarator
(identifier)
(identifier))
(variable_declarator
(identifier)
(identifier))))
```
--------------------------------
### JavaScript Relational Operators and Tree-sitter Parse Tree
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
Demonstrates common relational operators in JavaScript (e.g., <, ==, !==) and their representation as 'binary_expression' nodes within the Tree-sitter parse tree.
```JavaScript
x < y;
x <= y;
x == y;
x === y;
x != y;
x !== y;
x >= y;
x > y;
```
```Tree-sitter
(program
(expression_statement
(binary_expression
(identifier)
(identifier)))
(expression_statement
(binary_expression
(identifier)
(identifier)))
(expression_statement
(binary_expression
(identifier)
(identifier)))
(expression_statement
(binary_expression
(identifier)
(identifier)))
(expression_statement
(binary_expression
(identifier)
(identifier)))
(expression_statement
(binary_expression
(identifier)
(identifier)))
(expression_statement
(binary_expression
(identifier)
(identifier)))
(expression_statement
(binary_expression
(identifier)
(identifier))))
```
--------------------------------
### JavaScript Number Literals (Decimal, Hex, Octal, Binary, Scientific)
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
Provides examples of various JavaScript number formats, including integers, floating-point numbers, scientific notation, hexadecimal, octal, and binary representations. The AST simply identifies these as 'number' nodes.
```JavaScript
101;
3.14;
3.14e+1;
0x1ABCDEFabcdef;
0o7632157312;
0b1010101001;
1e+3;
```
```Tree-sitter AST
(program
(expression_statement
(number))
(expression_statement
(number))
(expression_statement
(number))
(expression_statement
(number))
(expression_statement
(number))
(expression_statement
(number))
(expression_statement
(number)))
```
--------------------------------
### Math Operators in JavaScript
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
This snippet provides examples of common mathematical operators in JavaScript, including increment/decrement, arithmetic operations, and exponentiation. It also shows unary plus and minus operators. The Tree-sitter parse tree details the `update_expression`, `binary_expression`, and `unary_expression` nodes for these operations.
```JavaScript
i++;
i--;
i + j * 3 - j % 5;
2 ** i * 3;
2 * i ** 3;
2 ** i ** 3;
+x;
-x;
let + 5;
```
```Tree-sitter Parse Tree
(program
(expression_statement
(update_expression
(identifier)))
(expression_statement
(update_expression
(identifier)))
(expression_statement
(binary_expression
(binary_expression
(identifier)
(binary_expression
(identifier)
(number)))
(binary_expression
(identifier)
(number))))
(expression_statement
(binary_expression
(binary_expression
(number)
(identifier))
(number)))
(expression_statement
(binary_expression
(number)
(binary_expression
(identifier)
(number))))
(expression_statement
(binary_expression
(number)
(binary_expression
(identifier)
(number))))
(expression_statement
(unary_expression
(identifier)))
(expression_statement
(unary_expression
(identifier)))
(expression_statement
(binary_expression
(identifier)
(number))))
```
--------------------------------
### JavaScript Object Literals Parsing
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
Illustrates the Tree-sitter parse tree for various JavaScript object literal forms, including empty objects, simple key-value pairs, mixed key types, and method definitions.
```JavaScript
{};
{ a: "b" };
{ c: "d", "e": f, 1: 2 };
{
g: h
}
{
[methodName]() {
}
}
```
```Tree-sitter Grammar
(program
(statement_block)
(empty_statement)
(expression_statement
(object
(pair
(property_identifier)
(string
(string_fragment)))))
(expression_statement
(object
(pair
(property_identifier)
(string
(string_fragment)))
(pair
(string
(string_fragment))
(identifier))
(pair
(number)
(number))))
(expression_statement
(object
(pair
(property_identifier)
(identifier))))
(expression_statement
(object
(method_definition
(computed_property_name
(identifier))
(formal_parameters)
(statement_block)))))
```
--------------------------------
### JavaScript Variable Assignments and Declarations
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/statements.txt
This snippet illustrates various forms of variable assignment and declaration in JavaScript, including simple assignments, `var`, `const`, and `let` declarations. It also provides the corresponding Tree-sitter S-expression parse tree, demonstrating how these constructs are represented in the AST.
```JavaScript
a = 0;
var b = 0;
const c = 0;
let d = 0;
```
```Tree-sitter S-expression
(program
(expression_statement
(assignment_expression
(identifier)
(number)))
(variable_declaration
(variable_declarator
(identifier)
(number)))
(lexical_declaration
(variable_declarator
(identifier)
(number)))
(lexical_declaration
(variable_declarator
(identifier)
(number))))
```
--------------------------------
### Optional chaining array access
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
Shows optional chaining used with array (subscript) access, contrasting it with standard array access.
```JavaScript
a [b];
a ?. [b];
```
```Tree-sitter AST
(program
(expression_statement
(subscript_expression
(identifier)
(identifier)))
(expression_statement
(subscript_expression
(identifier)
(optional_chain)
(identifier))))
```
--------------------------------
### Await Expressions in JavaScript
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
This snippet showcases the `await` keyword in JavaScript, used to pause execution of an `async` function until a Promise is settled. Examples include awaiting the result of a function call and awaiting a direct Promise variable. The Tree-sitter parse tree highlights the `await_expression` node.
```JavaScript
await asyncFunction();
await asyncPromise;
```
```Tree-sitter Parse Tree
(program
(expression_statement
(await_expression
(call_expression
(identifier)
(arguments))))
(expression_statement
(await_expression
(identifier))))
```
--------------------------------
### The Null-Coalescing Operator in JavaScript
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
This snippet illustrates the null-coalescing operator (`??`) in JavaScript, which provides a default value when the left-hand operand is `null` or `undefined`. The example shows its use in an assignment expression. The Tree-sitter parse tree identifies this as a `binary_expression` within an `assignment_expression`.
```JavaScript
x = b ?? c();
```
```Tree-sitter Parse Tree
(program
(expression_statement
(assignment_expression
(identifier)
(binary_expression
(identifier)
(call_expression
(identifier)
(arguments))))))
```
--------------------------------
### Parsing JavaScript For Loops with Tree-sitter
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/statements.txt
Illustrates Tree-sitter's parsing of various JavaScript `for` loop constructs, including traditional C-style loops, loops with multiple initializers/increments, infinite loops, and `for-in` and `for-of` variations. It provides both the JavaScript source and its S-expression parse tree.
```JavaScript
for (var a, b; c; d)
e;
for (i = 0, init(); i < 10; i++)
log(y);
for (;;) {
z;
continue;
}
for (var i = 0
; i < l
; i++) {
}
for (let in {});
for (let j
of k);
```
```Tree-sitter S-expression
(program
(for_statement
initializer: (variable_declaration
(variable_declarator
name: (identifier))
(variable_declarator
name: (identifier)))
condition: (identifier)
increment: (identifier)
body: (expression_statement
(identifier)))
(for_statement
initializer: (sequence_expression
(assignment_expression
left: (identifier)
right: (number))
(call_expression
function: (identifier)
arguments: (arguments)))
condition: (binary_expression
left: (identifier)
right: (number))
increment: (update_expression
argument: (identifier))
body: (expression_statement
(call_expression
function: (identifier)
arguments: (arguments
(identifier)))))
(for_statement
initializer: (empty_statement)
condition: (empty_statement)
body: (statement_block
(expression_statement
(identifier))
(continue_statement)))
(for_statement
initializer: (variable_declaration
(variable_declarator
name: (identifier)
value: (number)))
condition: (binary_expression
left: (identifier)
right: (identifier))
increment: (update_expression
argument: (identifier))
body: (statement_block))
(for_in_statement
left: (identifier)
right: (object)
body: (empty_statement))
(for_in_statement
left: (identifier)
right: (identifier)
body: (empty_statement)))
```
--------------------------------
### Expressions with rest elements
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
Illustrates the usage of rest and spread elements in JavaScript, specifically within function calls and array destructuring assignments.
```javascript
foo(...rest)
foo = [...[bar] = [baz]]
```
--------------------------------
### Debugger Statements in JavaScript and Tree-sitter
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/statements.txt
Shows the Tree-sitter parse output for JavaScript `debugger` statements, both with and without a semicolon.
```JavaScript
debugger;
debugger
```
```Tree-sitter S-expression
(program
(debugger_statement)
(debugger_statement))
```
--------------------------------
### Objects with Shorthand Property Definitions
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
Shows how Tree-sitter parses JavaScript object literals utilizing shorthand property syntax, including trailing commas.
```JavaScript
x = {a, b, get};
y = {a,};
```
```Tree-sitter Grammar
(program
(expression_statement
(assignment_expression
(identifier)
(object
(shorthand_property_identifier)
(shorthand_property_identifier)
(shorthand_property_identifier))))
(expression_statement
(assignment_expression
(identifier)
(object
(shorthand_property_identifier)))))
```
--------------------------------
### JavaScript Type Operators and Tree-sitter Parse Tree
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
Demonstrates JavaScript's 'typeof' and 'instanceof' operators, showing how they are parsed as 'unary_expression' and 'binary_expression' respectively in the Tree-sitter grammar.
```JavaScript
typeof x;
x instanceof String;
```
```Tree-sitter
(program
(expression_statement
(unary_expression
(identifier)))
(expression_statement
(binary_expression
(identifier)
(identifier))))
```
--------------------------------
### Regular Expressions Parsing
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
Shows how Tree-sitter parses various JavaScript regular expression literals, including those with flags, escaped characters, and comments.
```JavaScript
/one\\/;
/one/g;
/one/i;
/one/gim;
/on\/e/gim;
/on[^/]afe/gim;
/[\\]/]/;
/`) in JavaScript by Tree-sitter. It highlights how these comments are recognized as `html_comment` nodes in the AST, even when they appear on multiple lines or with trailing text, and notes the spec's rejection of certain forms.
```JavaScript
for some reason you can put text after a close comment.
--> note that the x + 1 above should be rejected according to the spec.
--> it should instead be rejected as invalid.
--> you are supposed to only have whitespace or comments before
--> an HTML close comment.
```
```Tree-sitter AST
(program
(html_comment)
(expression_statement
(binary_expression
(identifier)
(identifier)))
(html_comment)
(expression_statement
(binary_expression
(identifier)
(number)))
(html_comment)
(html_comment)
(html_comment)
(html_comment)
(html_comment))
```
--------------------------------
### JavaScript Class and Method Decorators with Tree-sitter AST
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
Illustrates the parsing of JavaScript class and method decorators, including static methods and field definitions. The snippet shows how decorators are represented in the Tree-sitter AST, attached to their respective class or member nodes.
```JavaScript
@reload
@eval
class Foo {
@foo.bar(baz) static foo() {
}
@foo bar = 'baz';
}
```
```Tree-sitter Grammar
(program
(class_declaration
(decorator
(identifier))
(decorator
(identifier))
(identifier)
(class_body
(method_definition
(decorator
(call_expression
(member_expression
(identifier)
(property_identifier))
(arguments
(identifier))))
(property_identifier)
(formal_parameters)
(statement_block))
(field_definition
(decorator
(identifier))
(property_identifier)
(string
(string_fragment))))))
```
--------------------------------
### JavaScript Function Declarations and Expressions with Tree-sitter AST
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
Presents different types of JavaScript function declarations and expressions, including anonymous, named, functions with rest parameters, trailing commas, and reserved keywords as parameters. The Tree-sitter AST illustrates the parsing of these varied function signatures and bodies.
```JavaScript
[
function() {},
function(arg1, ...arg2) {
arg2;
},
function stuff() {},
function trailing(a,) {},
function trailing(a,b,) {},
function reserved(async) {},
function rest(...[_ = x]) {}
]
```
```Tree-sitter Grammar
(program
(expression_statement
(array
(function_expression
(formal_parameters)
(statement_block))
(function_expression
(formal_parameters
(identifier)
(rest_pattern
(identifier)))
(statement_block
(expression_statement
(identifier))))
(function_expression
(identifier)
(formal_parameters)
(statement_block))
(function_expression
(identifier)
(formal_parameters
(identifier))
(statement_block))
(function_expression
(identifier)
(formal_parameters
(identifier)
(identifier))
(statement_block))
(function_expression
(identifier)
(formal_parameters
(identifier))
(statement_block))
(function_expression
(identifier)
(formal_parameters
(rest_pattern
(array_pattern
(assignment_pattern
(identifier)
(identifier)))))
(statement_block)))))
```
--------------------------------
### Parsing JavaScript Throw Statements
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/statements.txt
Demonstrates the parsing of a basic JavaScript `throw` statement by Tree-sitter. It shows how an `Error` object thrown with a string message is represented in the AST as a `throw_statement` containing a `new_expression`.
```JavaScript
throw new Error("uh oh");
```
```Tree-sitter AST
(program
(throw_statement
(new_expression
(identifier)
(arguments
(string
(string_fragment))))))
```
--------------------------------
### Parsing JavaScript Block Comments with Asterisks
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/statements.txt
Demonstrates how Tree-sitter parses various forms of JavaScript block comments, including those with multiple asterisks at the beginning or end, and multi-line block comments. It shows the corresponding AST representation for each comment type.
```JavaScript
/* a */
const a = 1;
/* b **/
const b = 1;
/* c ***/
const c = 1;
/* d
***/
const d = 1;
class E {
f() {
} /*** com
ment ***/
g() {
}
}
```
```Tree-sitter AST
(program
(comment)
(lexical_declaration
(variable_declarator
(identifier)
(number)))
(comment)
(lexical_declaration
(variable_declarator
(identifier)
(number)))
(comment)
(lexical_declaration
(variable_declarator
(identifier)
(number)))
(comment)
(lexical_declaration
(variable_declarator
(identifier)
(number)))
(class_declaration
(identifier)
(class_body
(method_definition
(property_identifier)
(formal_parameters)
(statement_block))
(comment)
(method_definition
(property_identifier)
(formal_parameters)
(statement_block)))))
```
--------------------------------
### JavaScript Export Statement Syntax and Grammar
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/statements.txt
This section illustrates various forms of JavaScript `export` statements, including default exports, named exports, re-exports, and namespace exports, with and without aliases. It also provides the corresponding Tree-sitter grammar parse tree for these constructs.
```JavaScript
export default function () { }
export default function name1() { }
export { name1 as default };
export * from 'foo';
export as someIdentifier from "someModule";
export as "string name" from "someModule";
export { name1, name2, nameN } from 'foo';
export { import1 as name1, import2 as name2, nameN } from 'foo';
export { import1 as "string name" } from 'foo';
export { "string import" as "string export" } from 'foo';
```
```Tree-sitter Grammar
(program
(export_statement
(export_clause
(export_specifier
name: (identifier))
(export_specifier
name: (identifier))
(export_specifier
name: (identifier))
(export_specifier
name: (identifier))))
(export_statement
(export_clause
(export_specifier
name: (identifier)
alias: (identifier))
(export_specifier
name: (identifier)
alias: (identifier))
(export_specifier
name: (identifier))))
(export_statement
(export_clause
(export_specifier
name: (identifier)
alias: (string
(string_fragment)))))
(export_statement
declaration: (lexical_declaration
(variable_declarator
name: (identifier))
(variable_declarator
name: (identifier))
(variable_declarator
name: (identifier))))
(export_statement
declaration: (lexical_declaration
(variable_declarator
name: (identifier)
value: (identifier))
(variable_declarator
name: (identifier)
value: (identifier))
(variable_declarator
name: (identifier))
(variable_declarator
name: (identifier))))
(export_statement
value: (identifier))
(export_statement
value: (object
(pair
key: (property_identifier)
value: (number))
(pair
key: (property_identifier)
value: (array))))
(export_statement
value: (function_expression
parameters: (formal_parameters)
body: (statement_block)))
(export_statement
declaration: (function_declaration
name: (identifier)
parameters: (formal_parameters)
body: (statement_block)))
(export_statement
(export_clause
(export_specifier
name: (identifier)
alias: (identifier))))
(export_statement
source: (string
(string_fragment)))
(export_statement
(namespace_export
(identifier))
source: (string
(string_fragment)))
(export_statement
(namespace_export
(string
(string_fragment)))
source: (string
(string_fragment)))
(export_statement
(export_clause
(export_specifier
name: (identifier))
(export_specifier
name: (identifier))
(export_specifier
name: (identifier)))
source: (string
(string_fragment)))
(export_statement
(export_clause
(export_specifier
name: (identifier)
alias: (identifier))
(export_specifier
name: (identifier)
alias: (identifier))
(export_specifier
name: (identifier)))
source: (string
(string_fragment)))
(export_statement
(export_clause
(export_specifier
name: (identifier)
alias: (string
(string_fragment))))
source: (string
(string_fragment)))
(export_statement
(export_clause
(export_specifier
name: (string
(string_fragment))
alias: (string
(string_fragment))))
source: (string
(string_fragment))))
```
--------------------------------
### Parsing JavaScript For-in Loops with Tree-sitter
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/statements.txt
Explores how Tree-sitter parses various forms of JavaScript `for-in` loops, including those with variable declarations, destructuring, and complex expressions in the iterable part. It provides both the JavaScript source and its S-expression parse tree.
```JavaScript
for (item in items)
item();
for (var item in items || {})
item();
for (const {thing} in things)
thing();
for (x in a, b, c)
foo();
for (x[i] in a) {}
for (x.y in a) {}
for ([a, b] in c) {}
for ((a) in b) {}
for (var foo = bar in baz) {}
```
```Tree-sitter S-expression
(program
(for_in_statement
(identifier)
(identifier)
(expression_statement
(call_expression
(identifier)
(arguments))))
(for_in_statement
(identifier)
(binary_expression
(identifier)
(object))
(expression_statement
(call_expression
(identifier)
(arguments))))
(for_in_statement
(object_pattern
(shorthand_property_identifier_pattern))
(identifier)
(expression_statement
(call_expression
(identifier)
(arguments))))
(for_in_statement
(identifier)
(sequence_expression
(identifier)
(identifier)
(identifier))
(expression_statement
(call_expression
(identifier)
(arguments))))
(for_in_statement
(subscript_expression
(identifier)
(identifier))
(identifier)
(statement_block))
(for_in_statement
(member_expression
(identifier)
(property_identifier))
(identifier)
(statement_block))
(for_in_statement
(array_pattern
(identifier)
(identifier))
(identifier)
(statement_block))
(for_in_statement
(parenthesized_expression
(identifier))
(identifier)
(statement_block))
(for_in_statement
(identifier)
(identifier)
(identifier)
(statement_block)))
```
--------------------------------
### Indented Code After Blocks
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/semicolon_insertion.txt
Demonstrates Tree-sitter's ability to correctly parse JavaScript statements that are indented after a block, such as a `return` statement following a function declaration, without misinterpreting the indentation.
```JavaScript
function x() {}
return z;
```
```Tree-sitter AST
(program
(function_declaration
(identifier)
(formal_parameters)
(statement_block))
(return_statement (identifier)))
```
--------------------------------
### JavaScript Generator Functions and Their Tree-sitter AST
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
Illustrates JavaScript generator functions, including anonymous and named generators, and the use of `yield` and `yield*` expressions. Note: The provided Tree-sitter AST for this snippet is incomplete.
```JavaScript
[
function *() {},
function *generateStuff(arg1, arg2) {
yield;
yield arg2;
yield * foo();
}
]
```
```Tree-sitter Grammar
(program
(expression_statement
(array
(generator_function
(formal_parameters)
(statement_block))
(generator_function
```
--------------------------------
### Multi-Line Chained Expressions in Variable Declarations
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/semicolon_insertion.txt
Illustrates how Tree-sitter parses JavaScript variable declarations where the assigned value is a multi-line chained method call expression, correctly linking the method calls to the initial object creation.
```JavaScript
var a = new A()
.b({c: 'd'})
.e()
```
```Tree-sitter AST
(program
(variable_declaration (variable_declarator
(identifier)
(call_expression
(member_expression
(call_expression
(member_expression
(new_expression (identifier) (arguments))
(property_identifier))
(arguments
(object
(pair (property_identifier) (string (string_fragment))))))
(property_identifier))
(arguments)))))
```
--------------------------------
### Parse JavaScript String Line Continuations
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/literals.txt
Illustrates how Tree-sitter parses string literals that use a backslash followed by a newline for line continuation, which effectively removes the newline from the string's content.
```JavaScript
"hello\
world";
'hello\
world';
```
```Tree-sitter S-expression
(program
(expression_statement
(string (string_fragment) (escape_sequence) (string_fragment)))
(expression_statement
(string (string_fragment) (escape_sequence) (string_fragment))))
```
--------------------------------
### JavaScript Ternary Operator and Tree-sitter Parse Tree
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
Illustrates the JavaScript ternary (conditional) operator, including its use in assignments and with optional chaining, and its representation as 'ternary_expression' in the Tree-sitter parse tree.
```JavaScript
condition ? case1 : case2;
x.y = some.condition ?
some.case :
some.other.case;
a?.1:.2
```
```Tree-sitter
(program
(expression_statement
(ternary_expression
(identifier)
(identifier)
(identifier)))
(expression_statement
(assignment_expression
(member_expression
(identifier)
(property_identifier)))
(ternary_expression
(member_expression
(identifier)
(property_identifier)))
(member_expression
(identifier)
(property_identifier)))
(member_expression
(member_expression
(identifier)
(property_identifier)))
(property_identifier))))
(expression_statement
(ternary_expression
(identifier)
(number)
(number))))
```
--------------------------------
### JavaScript Delete Operator and Tree-sitter Parse Tree
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
Illustrates the 'delete' operator in JavaScript, showing its use with property access and within a ternary expression, and its parsing as a 'unary_expression' in the Tree-sitter grammar.
```JavaScript
delete thing['prop'];
true ? delete thing.prop : null;
```
```Tree-sitter
(program
(expression_statement
(unary_expression
(subscript_expression
(identifier)
(string
(string_fragment)))))
(expression_statement
(ternary_expression
(true)
(unary_expression
(member_expression
(identifier)
(property_identifier)))
(null))))
```
--------------------------------
### Parse JavaScript Strings with Comment-like Content
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/literals.txt
Shows how Tree-sitter correctly parses string literals that contain sequences resembling comments, ensuring they are treated as literal string content rather than actual code comments.
```JavaScript
"//ok\n//what"
```
```Tree-sitter S-expression
(program
(expression_statement
(string (string_fragment) (escape_sequence) (string_fragment))))
```
--------------------------------
### Non-breaking spaces as whitespace
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
Illustrates how non-breaking space characters (e.g., U+2060, U+200B) can appear within comments and are recognized as whitespace by the parser, affecting how source code is interpreted.
```javascript
// Type definitions for Dexie v1.4.1
// Project: https://github.com/dfahlander/Dexie.js
// Definitions by: David Fahlander
// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
```
--------------------------------
### JavaScript Tagged Template Literals with Complex Call Expressions
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
Illustrates advanced usage of tagged template literals in JavaScript, including their application with 'new' expressions, array subscripting, and chained calls. The AST shows the nesting of call and new expressions with template strings.
```JavaScript
new f()`hello`;
new f`hello`;
arr[0]`hello`;
f`hello``goodbye`;
```
```Tree-sitter AST
(program
(expression_statement
(call_expression
(new_expression
(identifier)
(arguments))
(template_string
(string_fragment))))
(expression_statement
(new_expression
(call_expression
(identifier)
(template_string
(string_fragment)))))
(expression_statement
(call_expression
(subscript_expression
(identifier)
(number))
(template_string
(string_fragment))))
(expression_statement
(call_expression
(call_expression
(identifier)
(template_string
(string_fragment)))
(template_string
(string_fragment)))))
```
--------------------------------
### Expressions within JSX elements
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
Demonstrates how JavaScript expressions, including spread attributes and general expressions, can be embedded within JSX elements. This includes attributes, children, and self-closing elements.
```javascript
a = e {f} g
h = {...j}
b =
b =
```
--------------------------------
### JavaScript Void Operator and Tree-sitter Parse Tree
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
Demonstrates the 'void' operator in JavaScript, showing its use to evaluate an expression and return 'undefined', and its parsing as a 'unary_expression' within an 'assignment_expression' in the Tree-sitter grammar.
```JavaScript
a = void b()
```
```Tree-sitter
(program
(expression_statement
(assignment_expression
(identifier)
(unary_expression
(call_expression
(identifier)))))
```
--------------------------------
### JavaScript Template Literals with Interpolation
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
Demonstrates various forms of JavaScript template literals, including single-line, multi-line, and those with embedded expressions (interpolations). Also covers escaped backticks and dollar signs, showing their AST representation.
```JavaScript
`one line`;
`multi
line`;
`multi
${2 + 2}
hello
${1 + 1, 2 + 2}
line`;
`$$$$`;
`$$$$${ 1 }`;
`(a|b)$`;
`$`;
`$${'$'}$$${'$'}$$$$`;
`\ `;
`The command \`git ${args.join(' ')}\` exited with an unexpected code: ${exitCode}. The caller should either handle this error, or expect that exit code.`;
`\\`;
`//`;
```
```Tree-sitter AST
(program
(expression_statement
(template_string
(string_fragment)))
(expression_statement
(template_string
(string_fragment)))
(expression_statement
(template_string
(string_fragment)
(template_substitution
(binary_expression
(number)
(number)))
(string_fragment)
(template_substitution
(sequence_expression
(binary_expression
(number)
(number))
(binary_expression
(number)
(number))))
(string_fragment)))
(expression_statement
(template_string
(string_fragment)))
(expression_statement
(template_string
(string_fragment)
(template_substitution
(number))))
(expression_statement
(template_string
(string_fragment)))
(expression_statement
(template_string
(string_fragment)))
(expression_statement
(template_string
(string_fragment)
(template_substitution
(string
(string_fragment)))
(string_fragment)
(template_substitution
(string
(string_fragment)))
(string_fragment)))
(expression_statement
(template_string
(escape_sequence)))
(expression_statement
(template_string
(string_fragment)
(escape_sequence)
(string_fragment)
(template_substitution
(call_expression
(member_expression
(identifier)
(property_identifier)))
(arguments
(string
(string_fragment))))
(escape_sequence)
(string_fragment)
(template_substitution
(identifier))
(string_fragment)))
(expression_statement
(template_string
(escape_sequence)))
(expression_statement
(template_string
(string_fragment))))
```
--------------------------------
### Parse JavaScript Unicode Identifiers and Object Keys
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/literals.txt
Illustrates Tree-sitter's ability to parse JavaScript code containing Unicode characters in variable names and object property identifiers, demonstrating support for internationalized code.
```JavaScript
const últimaVez = 1
{ 県: '大阪府', '': '' }
```
```Tree-sitter S-expression
(program
(lexical_declaration (variable_declarator (identifier) (number)))
(expression_statement
(object
(pair (property_identifier) (string (string_fragment)))
(pair (string) (string)))))
```
--------------------------------
### JavaScript Array Literals and Their Tree-sitter AST
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
Demonstrates various forms of JavaScript array literals, including empty arrays, arrays with single/multiple items, trailing commas, and assignment expressions within arrays. The corresponding Tree-sitter AST shows how each array structure is parsed.
```JavaScript
[];
[ "item1" ];
[ "item1", ];
[ "item1", item2 ];
[ , item2 ];
[ item2 = 5 ];
```
```Tree-sitter Grammar
(program
(expression_statement
(array))
(expression_statement
(array
(string
(string_fragment))))
(expression_statement
(array
(string
(string_fragment))))
(expression_statement
(array
(string
(string_fragment))
(identifier)))
(expression_statement
(array
(identifier)))
(expression_statement
(array
(assignment_expression
(identifier)
(number)))))
```
--------------------------------
### Parse JSX Attributes with Multi-line String Values
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/literals.txt
Demonstrates how Tree-sitter handles JSX attributes where the string value spans multiple lines, preserving the newline characters within the attribute's content.
```JSX
;
;
```
```Tree-sitter S-expression
(program
(expression_statement
(jsx_element
(jsx_opening_element
(identifier)
(jsx_attribute (property_identifier) (string (string_fragment))))
(jsx_closing_element
(identifier))))
(expression_statement
(jsx_element
(jsx_opening_element
(identifier)
(jsx_attribute (property_identifier) (string (string_fragment))))
(jsx_closing_element
(identifier)))))
```
--------------------------------
### U+2028 as a Line Terminator in JavaScript and Tree-sitter
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/statements.txt
Shows how Tree-sitter handles the Unicode character U+2028 (LINE SEPARATOR) as a valid line terminator within JavaScript code, specifically within a comment.
```JavaScript
let x = { a: // 3
}
```
```Tree-sitter S-expression
(program
(lexical_declaration
(variable_declarator
(identifier)
(object
(pair
(property_identifier)
(comment)
(number))))))
```
--------------------------------
### JavaScript Class Static Property Fields and Getters
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
This snippet showcases the definition of static property fields and static getter methods within JavaScript classes. The Tree-sitter parse tree differentiates between a direct field definition and a method definition for the getter.
```javascript
class Foo {
static foo = 2
}
class Bar {
static get
baz() { return 1; }
}
```
```Tree-sitter Parse Tree
(program
(class_declaration
(identifier)
(class_body
(field_definition
(property_identifier)
(number))))
(class_declaration
(identifier)
(class_body
(method_definition
(property_identifier)
(formal_parameters)
(statement_block
(return_statement
(number)))))))
```
--------------------------------
### Automatic Semicolon Insertion (ASI)
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/semicolon_insertion.txt
Demonstrates how Tree-sitter handles automatic semicolon insertion (ASI) in JavaScript, where semicolons are implicitly added at the end of statements within a block, even when omitted in the source code.
```JavaScript
if (a) {
var b = c
d()
e()
return f
}
```
```Tree-sitter AST
(program
(if_statement
(parenthesized_expression (identifier))
(statement_block
(variable_declaration (variable_declarator (identifier) (identifier)))
(expression_statement (call_expression (identifier) (arguments)))
(expression_statement (call_expression (identifier) (arguments)))
(return_statement (identifier)))))
```
--------------------------------
### Object destructuring assignments
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/destructuring.txt
Illustrates different ways to perform object destructuring assignments in JavaScript, including shorthand properties, nested destructuring, and rest patterns. Also provides the corresponding Tree-sitter parse tree for each example.
```javascript
({a, b: c.d, ...e[f]} = object);
let {a, b, ...c} = object
const {a, b: {c, d}} = object
```
```tree-sitter-parse-tree
(program
(expression_statement (parenthesized_expression (assignment_expression
(object_pattern
(shorthand_property_identifier_pattern)
(pair_pattern
(property_identifier)
(member_expression (identifier) (property_identifier)))
(rest_pattern (subscript_expression (identifier) (identifier))))
(identifier))))
(lexical_declaration (variable_declarator
(object_pattern
(shorthand_property_identifier_pattern)
(shorthand_property_identifier_pattern)
(rest_pattern (identifier)))
(identifier)))
(lexical_declaration (variable_declarator
(object_pattern
(shorthand_property_identifier_pattern)
(pair_pattern
(property_identifier)
(object_pattern
(shorthand_property_identifier_pattern)
(shorthand_property_identifier_pattern))))
(identifier))))
```
--------------------------------
### Alphabetical Infix Operators Split Across Lines
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/semicolon_insertion.txt
Examines Tree-sitter's parsing of JavaScript expressions involving alphabetical infix operators like `in` and `instanceof` when they are split across lines, distinguishing them from identifiers or other syntax elements.
```JavaScript
a
i;
a
in b;
a
ins;
a
inst;
a
instanceof b;
a
instanceofX;
```
```Tree-sitter AST
(program
(expression_statement (identifier))
(expression_statement (identifier))
(expression_statement (binary_expression (identifier) (identifier)))
(expression_statement (identifier))
(expression_statement (identifier))
(expression_statement (identifier))
(expression_statement (identifier))
(expression_statement (binary_expression (identifier) (identifier)))
(expression_statement (identifier))
(expression_statement (identifier)))
```
--------------------------------
### Parse JavaScript Numeric Literals
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/literals.txt
Demonstrates how Tree-sitter's JavaScript grammar parses various forms of numeric literals, including integers, decimals, bigints, and numbers with different bases (hexadecimal, binary, octal) and digit separators.
```JavaScript
04000
400
100n
0xffffffffn
0b00111n
0o1234n
0xa_b_c
0o1_1
0b1_000_000
1_2_3
12_3.4_5e6_7
.4_5e6_7
0b1_000_000n
01
00000123
```
```Tree-sitter S-expression
(program
(expression_statement (number))
(expression_statement (number))
(expression_statement (number))
(expression_statement (number))
(expression_statement (number))
(expression_statement (number))
(expression_statement (number))
(expression_statement (number))
(expression_statement (number))
(expression_statement (number))
(expression_statement (number))
(expression_statement (number))
(expression_statement (number))
(expression_statement (number))
(expression_statement (number)))
```
--------------------------------
### Boolean Operators in JavaScript
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/expressions.txt
This snippet demonstrates the use of logical (Boolean) operators in JavaScript, including logical OR (`||`), logical AND (`&&`), and logical NOT (`!`). It illustrates how these operators combine expressions. The Tree-sitter parse tree shows the `binary_expression` and `unary_expression` nodes representing these logical operations.
```JavaScript
i || j;
i && j;
!a && !b || !c && !d;
```
```Tree-sitter Parse Tree
(program
(expression_statement
(binary_expression
(identifier)
(identifier)))
(expression_statement
(binary_expression
(identifier)
(identifier)))
(expression_statement
(binary_expression
(binary_expression
(unary_expression
(identifier))
(unary_expression
(identifier)))
(binary_expression
(unary_expression
(identifier))
(unary_expression
(identifier))))))
```
--------------------------------
### Single-Line Blocks Without Semicolons
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/semicolon_insertion.txt
Demonstrates Tree-sitter's parsing of JavaScript function declarations with single-line blocks that omit explicit semicolons, relying on automatic semicolon insertion to correctly terminate statements within the block.
```JavaScript
function a() {b}
function c() {return d}
```
```Tree-sitter AST
(program
(function_declaration (identifier) (formal_parameters) (statement_block
(expression_statement (identifier))))
(function_declaration (identifier) (formal_parameters) (statement_block
(return_statement (identifier)))))
```
--------------------------------
### Tree-sitter Parse Output for Control Flow Statements
Source: https://github.com/tree-sitter/tree-sitter-javascript/blob/master/test/corpus/statements.txt
This snippet provides a Tree-sitter S-expression representation of complex control flow, including nested try-catch-finally blocks and throw statements. The original JavaScript code for this specific parse output is not provided in the input.
```Tree-sitter S-expression
(statement_block
(expression_statement
(identifier))))
(finally_clause
(statement_block
(expression_statement
(identifier)))))
```
```Tree-sitter S-expression
(try_statement
(statement_block
(throw_statement
(array
(identifier)
(identifier))))
(catch_clause
(array_pattern
(identifier)
(identifier))
(statement_block)))
```