Write SQL-like Queries in JavaScript

When doing development on .NET framework using Visual Studio 2008, you must

have used LINQ (Language INtegrated Query). The language allows standard query

operations to be integrated onto the .NET platform, to provide a unified way to

query across objects, databases, and XML in a standard way. This enables

developers to use query style syntaxes in their codes while referring to objects

or datasets.

The whole process makes writing code for fetching values from an object list

easier. A developer doesn't have to write iterations to parse through the object

list, but rather get the work done in SQL query format. Till recently, the same

wasn't possible for Java developers. Using JSINQ, however, you can write similar

SQL queries while programming in JavaScript. This means you now have a query

language in JavaScript that you can use against arrays and DOM node lists. As

LINQ has reduced the need to write lesser code and provides simplicity in code

management, the same would now be possible with JSINQ for JavaScript related

development.

Key features



JSINQ is a JavaScript library, that you can use to implement LINQ style querying
for JavaScript codes. The acronym, JSINQ stands for JavaScript INtegrated Query,

which is a complete implementation of LINQ to objects in JavaScript, which means

that JSINQ is implementation of LINQ's System.Linq.Enumerable and also has a

complete query-expression compiler that translates SQL-style queries into

JavaScript code. JSINQ is a result of a project started by Kai Jager and is

available for download from CodePlex.

By using JSINQ you can not only use it against arrays in JavaScript, but can

be used for writing complex queries find elements in the HTML DOM tree nodes. It

can also be used to create HTML elements dynamically from JSON or XML that have

been passed forward via XMLHttpRequest in a more declarative manner, rather than

writing long iterative codes. Using JSINQ can be extended to other JavaScript

based frameworks like Ajax as well.

You can start using JSINQ by downloading the JSINQ library from the Codeplex

site ( link provided in the direct-hit box), and when you extract the contents

of the zipped archive file you will find two JavaScript files, namely "jsinq-enumerable.js”

and "jsinq-query.js". The jsinq-enumerable is the module that implements the

System.Linq. Enumerable of LINQ from .NET framework in JavaScript, while the

other module, jsinq-query is the implementation in JavaScript for

System.Linq.Queryable and is the query-expression compiler. These are the two

JSINQ files that you need to include in your HTML page to implement LINQ style

querying for objects while writing coding in JavaScript.

Implementing JSINQ



If you want that your developers can write the JavaScript code in a more

declarative manner as LINQ, then you can use JSINQ in your project. Once you

have downloaded the JSINQ library, and extracted it, you have to use the

jsing-enumerable.js and jsinq-query.js JavaScript files, and include them in all

HTML pages where JavaScript shall be used.

These two JavaScript files can be found in the build folder of the JSINQ

extracted zipped file. In the same folder, you can also find sample programs as

well along with the source files. To implement JSINQ for JavaScript in your

project, just copy the two JSINQ files into your project's web directory, where

all your HTML pages are located, and in the code of the web page you can include

the files as follows:

JSINQ lets you create enumerables from arrays or DOM node lists, and for that

you can use jsinq.Enumerable, which is the JavaScript implementation of its

counterpart's System.Linq. Enumerable. To demonstrate how we use use JSINQ to

create enumerables from arrays and how we can do SQL-style querying on those, we

will make an array of customer names. Then we create its enumerable object using

jsinq.Enumerable. On the enumerable object we will enumerate for a condition

that will list all customer names starting with alphabet 'A'.



With jsinq. Enumerable we can write queries using query methods defined in
Enumerable constructor, for example the where() method. The following code

snippet shows this:

document.writeln('Customers names starting with A: ');

var customer = <'Raman', 'Aman', 'Popat', 'Kamal', 'Ankur',

'Manpreet', 'Sandy', 'Samit'>;



var enumerable = new jsinq.Enumerable(customer);


var customerNamesWithA =


enumerable.where(function(customer)


{


return name.charAt(0) == 'A';


}


);

var enumerator = customerNamesWithA.getEnumerator();



while (enumerator.moveNext()) {


var name = enumerator.current();


document.write(name + '
');



}

Enabling SQL-style queries



With Enumerable constructor you have to use query methods, but to write

queries in SQL-like format, JSINQ provides with jsinq.Query constructor. Using

this constructor, you can do SQL-like programming in JavaScript. The following

code snippet demonstrates how you can query on the same customer array and the

customer enumerable used in the previous example and fetch the names of

customers having alphabet 'a' in their names.



document.writeln('Customers having A in their names: ');

var query = new jsinq.Query(' \



from customer in $0 \


where customer.toLowerCase().indexOf("a") > -1 \


orderby customer descending \


select customer \


');


query.setValue(0, enumerable);


var result = query.execute();


var enumerator =


result.getEnumerator();


while (enumerator.moveNext()) {


var name = enumerator.current();


document.write(name + '
');



}

Here JSINQ's query constructor compiles the SQL-style query received as

string and converts it into a JavaScript code. The JSINQ query object acts like

a prepared statement, so when you create the query it isn't executed. This way

you can use the same query over and over again without recompiling it. That is

why placeholders like $0 are used instead of regular expressions. Now using the

setValue() method you can assign our enumerable to the placeholder $0. To

execute the query we use the execute() method. The variable result will have the

enumerable returned from executing the query on our supplied customer enumerable

that we have specified in the setValue() method.

Having gone through the above code samples, you would now appreciate how

JSINQ eases the work of developers by requiring them to write less code in a

more declarative manner, while programming in JavaScript; thanks to the LINQ

style querying capability. We shall explore more such tools in the coming

issues.