Even more jQuery?
Over the past few years I have loved the Javascript language. I know perfectly well how many discussions and holivars are around him. And I know perfectly well its purpose, where it can be applied, and where not.
We all have ever heard of jQuery. For some time now, I literally fell in love with this creature, just like JavaScript itself. There are a lot of lines of code behind my back. Worker, amateur, simple lantern code. Recently, I began to study the structure of my beloved jQuery and came to the conclusion that this is nothing more than a masterpiece.
I have a lot of development in my account with which I tried to simplify the programming process for myself, many of them were jQuery-like. But alas, the development and support stopped and was abandoned due to my busy work and they never went beyond the limits of my hard drive.
Some time ago, already being quite familiar with the jQuery structure, I had the idea: what if we did the constructor, where would we specify the function that would pick up the necessary data for us and collect them into the jQuery object? No, there is no speech here about selector parsing of web pages, about animations, ajax, and other jQuery goodies. I thought: what if our library will adapt to the requirements of the programmer (be it a search of banal numbers, strings, data objects, or even files) regardless of the platform on which this code is running?
')
So the idea came to build this small framework.
Let's see what's what.
jQuery Builder is a microframe designed to create jQuery-like libraries for manipulating various data. At the moment, I have so far decided to inherit the jQuery class from the native js-array, but in the future this will be excluded and my own analogs of the standard methods will be created.
I will give a couple of simple examples:
Example number 1. Suppose we have an array of data from which we need to create a jQuery object with the necessary methods. Let it be banal numbers.
The jQuery field contains the object we need (to be more precise, this is a function), which will contain our sample and the necessary methods (from jQuery.fn).
So, we have just completed the first main task - we have formed our constructor. It is a function in which the loop is executed, iterating over our array. If the number meets our requirements, the number will be added to the sample.
Now create a new method. Everything is done just like in the real jQuery - through the fn object.
I expect this picture in the comments, but everything is much nicer here. This library, in my opinion, may be useful for quickly finding solutions to frequent (and not only) problems regarding arrays.
Example number 2. Now let's do something similar with strings.
In my opinion, everything is very simple and clear. In the next article I will tell you how I applied this library to Adobe After Effects, in which you can write scripts in Javascript. It turned out a jQuery for sorting and managing layers in the composition. In the near future we plan to explore Photoshop's scripting and develop an analog for it.
The repository is here . I promise to gradually supplement with examples.
Thanks for attention.
UPD.
Now I study Coffeescript closely. I plan to rewrite Builder to it.
We all have ever heard of jQuery. For some time now, I literally fell in love with this creature, just like JavaScript itself. There are a lot of lines of code behind my back. Worker, amateur, simple lantern code. Recently, I began to study the structure of my beloved jQuery and came to the conclusion that this is nothing more than a masterpiece.
Why is this article here?
I have a lot of development in my account with which I tried to simplify the programming process for myself, many of them were jQuery-like. But alas, the development and support stopped and was abandoned due to my busy work and they never went beyond the limits of my hard drive.
Some time ago, already being quite familiar with the jQuery structure, I had the idea: what if we did the constructor, where would we specify the function that would pick up the necessary data for us and collect them into the jQuery object? No, there is no speech here about selector parsing of web pages, about animations, ajax, and other jQuery goodies. I thought: what if our library will adapt to the requirements of the programmer (be it a search of banal numbers, strings, data objects, or even files) regardless of the platform on which this code is running?
')
So the idea came to build this small framework.
Let's see what's what.
jQuery Builder is a microframe designed to create jQuery-like libraries for manipulating various data. At the moment, I have so far decided to inherit the jQuery class from the native js-array, but in the future this will be excluded and my own analogs of the standard methods will be created.
I will give a couple of simple examples:
Example number 1. Suppose we have an array of data from which we need to create a jQuery object with the necessary methods. Let it be banal numbers.
Code
// var numbers = [4, 8, 15, 16, 23, 42, 108]; // var builder = new JQueryBuilder(function (selector) { // for(var i = 0; i < numbers.length; i++) { // switch (selector) { // case 'even' : // ... if (numbers[i] % 2 === 0) { // this.push(numbers[i]); } break; // case 'odd' : // ... if (numbers[i] % 2 !== 0) { // this.push(numbers[i]); } break; } } }); The jQuery field contains the object we need (to be more precise, this is a function), which will contain our sample and the necessary methods (from jQuery.fn).
So, we have just completed the first main task - we have formed our constructor. It is a function in which the loop is executed, iterating over our array. If the number meets our requirements, the number will be added to the sample.
Now create a new method. Everything is done just like in the real jQuery - through the fn object.
Code
var $ = builder.jQuery; $.fn.add = function (value) { var self = this; return this.each(function (i) { self[i] += value; }); }; var result = $('even').add(5); console.log(result); // [9, 13, 21, 47, 113] I expect this picture in the comments, but everything is much nicer here. This library, in my opinion, may be useful for quickly finding solutions to frequent (and not only) problems regarding arrays.
Example number 2. Now let's do something similar with strings.
Code
var $ = jQueryBuilder.fromArray().jQuery; $.fn.extend({ reverse: function () { var self = this; return this.each(function (i) { var result = ''; for(var x = self[i].length - 1; x >= 0 ; x--) { result += self[i][x]; } self[i] = result; }); }, upper: function () { var self = this; return this.each(function (i) { self[i] = this.toUpperCase(); }); }, lower: function () { var self = this; return this.each(function (i) { self[i] = this.toLowerCase(); }); } }); var result = $('abcde', 'xyZ', 'HAAR') .reverse() .lower() ; console.log(result); // ["edcba", "zyx", "raah"] In my opinion, everything is very simple and clear. In the next article I will tell you how I applied this library to Adobe After Effects, in which you can write scripts in Javascript. It turned out a jQuery for sorting and managing layers in the composition. In the near future we plan to explore Photoshop's scripting and develop an analog for it.
The repository is here . I promise to gradually supplement with examples.
Thanks for attention.
UPD.
Now I study Coffeescript closely. I plan to rewrite Builder to it.
Source: https://habr.com/ru/post/254713/
All Articles