Using Xpath selectors to extract / combine data from Javascript Objects? - javascript

I'm quite fond of CakePHP Set class, it comes with a few awesome tools i now love. I use it mainly to extract or combine arrays.
I was wondering if there was a way to do just that with javascripts Objects/Arrays of data.
// Desired Usage:
var users = {User: {0:{id:1,name:'A'},1:{id:2,name:'B'}}}
var results = $.extract('/User/id', users);
// results returns:
// {0:1,1:2};
// /User[id>2][<5] Selects all Users with an id > 2 but < 5
It could support on jQuery or maybe just Sizzle.
Do i have to develop thoses functions from zero or is there already some native/plugin xpath selector/extractor support out there ? Can Sizzle do this ?
Thanks a lot!

Look for that library http://code.google.com/p/jsonpath/
Not sure, whether it could process request exactly in this syntax: User[id>2][<5],
but it's rather powerful library and should have similar feature.
Even if there's no function for request parts like "[<5]", you may call
.slice(0, 5);

Related

Javascript ES6 TemplateString a TemplateString

I am using mustache to build out a single string, replacing several variables within it. I would love to use a TemplateString instead, but I need to resolve my string at runtime, and not at code-compile time since I am reading the template string from an external source.
To be clear:
// mustachy example
// template is "foo{{who}}" and myData.whmustao = "manchu"
let myResult = mustache.render(getMyTemplate(),myData);
console.log(myResult); // "foomanchu"
This is pretty lightweight, and I would love to use a TemplateString, but as the example below aludes to - I can't imagine a way to externally provide the string in the first place...
// ES6xy example
let myResult = `foo${myData.who}`; // can't get this at runtime
console.log(myResult); // "foomanchu"
But, I can't imagine a straight-forward, clean, non-sneaky way of achieving this. Can you?
I'm assuming that you're loading data on the client and want to generate a string based on the data returned. You could have a function available that returns the generated string for you
function generateString(val1, val2) {
return `foo${val1} bar${val2};
}
can you call that function on the client as a result of an api call that gets val1 and val2?
this strategy would also work on the server if you delay your response until you have all the data you need
put the template-string into a function, and pass myData
let renderMyTemplate = data => `foo${data.who}`;
//or
let renderMyTemplate = ({who}) => `foo${who}`;
let myResult = renderMyTemplate(myData);
console.log(myResult);
Thank you for your replies and creative solutions. However, I thought that there was no solution because TemplateStrings are an in-code feature, whereas other template solutions (like mustache) are a data-driven feature.
Put in other words, ES6's Template Strings is a language feature which limits its functionality to static in-code strings. Any other imagined flexibilities must rely on dynamic execution of a code you inject into your application, which is every hacker's dream.
So the answer to my original thought, as to whether Mustache is overkill for a simple string that is not hard-coded in your source - is NO. Mustache is the acceptable solution for that scenario.

Getting length (size? count?) of an array in Parse.com cloud code

I believe in javascript, arrays have a ".count" property. However, I believe that when writing Parse cloud code, effectively you cannot use this since .count is in a word, used by Parse (for queries).
(1) Is that correct, and is the reason I gave correctly stated or a shambles?
I believe (it seems to work) you can go ahead and use .length in Parse cloud code for the length of an array; but I'm confused "why" since javascript doco says .length
(2) Is that correct - if so why can it be done?
You inevitably use "underscore" library in Parse projects; in fact does that library offer a way to get the size/length/count of an array?
(3) Is there yet another way, using _ ?
I swear I have seen Parse cloud code using "size" (something or other like that) in relation to arrays;
(4) Is there an idiom using something like 'size' ?
Finally, indeed, considering this typical example of using _,
Parse.Cloud.afterSave("Employee", function(request)
{
var company = request.object.get("company");
var query = new Parse.Query("Employee");
query.equalTo("company", company);
query.include("company");
var justEmails = new Array();
query.each(function(employee)
{
var thatEmail = employee.get("email");
justEmails.push(thatEmail);
}
).then(function()
{
var kount = justEmails.length;
console.log(">>> count is " + kount );
justEmails = _.uniq(justEmails);
kount = justEmails.length;
console.log(">>> but count is now " + kount );
});
});
(5) is there a way to do that in "one line", saying something like _.uniq(justEmails).sizeOrWhateverTheHell();
Finally in summary,
(6) what then is the best and most sensible and most idimoatic way to get simply the length of an array, in javascript in the Parse cloud code milieu -- is it indeed .length?
There is no such thing as count. Arrays (and strings) have a .length property. Use it.
I have no idea what this is asking.
No, use .length.
See 3
_.uniq(whatever).length
See 1
It's just JavaScript.
You are correct and the best way to get the number of elements of an array in javascript (and in Parse cloud code) is to use array.length
Length is the property of the array, whereas size is a function that's defined in some javascript frameworks. Always use the length property to get the number of elements in an array.

Are there any one-way hashing functions available in native JavaScript?

I'd like to be able to create unique tokens* for users based on a hashed string. I know I could, for example, use a md5() library but as the purpose is not cryptographic I was wondering if there was anything I could use "out of the box." Are there any one-way hashing functions available in native JavaScript?
*I realize these won't be strictly unique. I'm ok with a small chance of hashing collision.
In 2020, there is a native API:
SubtleCrypto.digest()
https://developer.mozilla.org/en-US/docs/Web/API/SubtleCrypto/digest
example:
crypto.subtle
.digest("SHA-256", new TextEncoder().encode("hello"))
.then(console.log);
hex string conversion:
const digest = async ({ algorithm = "SHA-256", message }) =>
Array.prototype.map
.call(
new Uint8Array(
await crypto.subtle.digest(algorithm, new TextEncoder().encode(message))
),
(x) => ("0" + x.toString(16)).slice(-2)
)
.join("");
digest({message: "hello"}).then(console.log)
JavaScript does not have native hashing, but there are many libraries.
I recommend crypto-js: https://code.google.com/p/crypto-js/
For example, to use SHA1, you simply:
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/3.1.2/rollups/sha1.js"></script>
<script>
var hash = CryptoJS.SHA1("Message");
</script>
Nothing is available in native JavaScript. You could use something like Murmurhash. There's a JavaScript implementation here: https://github.com/garycourt/murmurhash-js. I haven't used it though so can't vouch for it.
Update: now there are multiple Murmurhash3 implementations available in JavaScript. However, many of them have problems encoding strings to bytes and can produce different results compared to the reference C++ implementation. You can read an analysis on this here, the murmurhash3js-revisited library implements all three variants of the function and conforms to the reference.
Over the horizon, this may be possible with the currently experimental Web Crypto API
https://developer.mozilla.org/en-US/docs/Web/API/Web_Crypto_API
https://developer.mozilla.org/en-US/docs/Web/API/SubtleCrypto
Granted, at the time of this writing it is unrealistic to use in a production environment and will likely be a moving target. However, come 5 years who knows?

JavaScript getElementsByCustomTag('value')?

I know getElementsByName('something') that returns the elements with name="something", but I want to return a list of elements where custom="something", how would I do that?
There are no standard API in the DOM to do this.
If you do not mind adding jQuery to your project, you could query your elements using the jQuery attribute selector:
$("[custom='something']")
To answer my own question, it seems it was easier than I thought.
elements = document.getElementsByTagName('pre');
for (elem = 0;elem < elements.length;elem++)
{
element = elements[elem];
if (element.lang != 'php')
break;
...
}
The above happened to work in my situation. :)
This page lists all the functions of the Document object in the JavaScript available in browsers. Thus it provides getElementById(), getElementByName() and getElementByTagName().
I guess need to use something like JQuery to gain more freedom as it allows you to express more complex "queries". I'm not sure, but that might also be slower, depending on how often you have to look up things.

What JavaScript library should I use for parsing URL parameters?

How do I parse URL parameters in JavaScript? (These are the parameters I would ordinarily call GET parameters or CGI parameters, but in this case the page is basically submitting to itself, not a server, so there is no GET request and definitely no CGI program.)
I've seen a number of routines on the net that I can copy, but I have no idea how robust any of them are. I'm used to other languages like Perl and Java where I can rely on an extremely well-tested and robust library that I know will handle millions of little edge-cases in the standard. I would like the same here, rather than just cutting and pasting an example.
jQuery URL Utils or jQuery URL Parser.
Here's are two simple functions that do the job : http://adamv.com/dev/javascript/querystring
Here is a sample of the API Reference :
var qs = new Querystring();
// Parse a given querystring
var qs2 = new Querystring("name1=value1&name2=value2");
var v1 = qs2.get("name1");
var v3 = qs2.get("name3", "default value");
If it's "submitting to itself," do you need to do GET parameters?
But if you do, most browsers now have the decodeURIComponent function which will handle individual parameters; your job is to split them on & (String#split will do that nicely). If you want a library, jQuery and Prototype are both well-used and tested.
The best way I have found is to simply do it yourself and funnel the params into a global key/value object.
Getting quer params is simple...
just take a couple of .split()'s
var myquery = thewholeurl.split("?")[1]; //will get the whole querystring with the ?
then you can do a
myparams = myquery.split("&")
then you can do
for each param in myparams
{
temp = param.split("=");
mykeys.push(temp[0]);
myvalues.push(temp[1]);
OR
myObject[temp[0]] = temp[1];
}
It's just a matter of style.
This is not perfect code, just psuedo stuff to give you the idea.
I use the parseUri library available here:
http://stevenlevithan.com/demo/parseuri/js/
It allows you to do exactly what you are asking for:
var uri = 'http://google.com/?q=stackoverflow';
var q = uri.queryKey['q'];
// q = 'stackoverflow'
I've been using it for a while so far and haven't had any problems.
I found this useful for simple url parsing, modifying url (like adding new query params): https://github.com/derek-watson/jsUri
I think this library would work quite well, it is independent so you can use it with JQuery or with YAHOO or Dojo, another advantage is that it is pretty well documented.
http://www.openjsan.org/doc/t/th/theory/HTTP/Query/0.03/lib/HTTP/Query.html
You can use HTTP.Query to do all of the work for you in this case. It is only like 1.2 KB compressed so you could even include it in a bigger library if you wanted.
I recommend query-string library
Installing:
npm install query-string
Usage:
import queryString from 'query-string';
console.log(location.search);
//=> '?foo=bar'
const parsed = queryString.parse(location.search);
console.log(parsed);
//=> {foo: 'bar'}
parsed.foo = 'unicorn';
parsed.ilike = 'pizza';
const stringified = queryString.stringify(parsed);
//=> 'foo=unicorn&ilike=pizza'
location.search = stringified;
// note that `location.search` automatically prepends a question mark
console.log(location.search);
//=> '?foo=unicorn&ilike=pizza'
https://www.npmjs.com/package/query-string
Javascript has no built in support for URL parameters.
Anyway, the location.search property returns the portion of current page URL starting from the question mark ('?').
From this, you can write your own parameter parser or you can make use of one of those available in most common Javascript frameworks, such as JQuery and similar.

Categories